Core Web Vitals - Ce sunt acestea și cum să le îmbunătățim?
Publicat: 2022-08-28Google a introdus un nou program în 2020, care se numește Web Vitals. Aceasta se referă la o tehnică care oferă îndrumări privind semnalele de calitate. Potrivit Google, aceste valori sunt esențiale pentru furnizarea unei experiențe excelente de utilizare pe web. În mai 2021, Google a început să folosească Core Web Vitals ca măsurătoare pentru clasarea căutărilor pe platforma sa.
Ce sunt Core Web Vitals?
Core Web Vitals sunt valori pentru măsurarea experienței utilizatorului pe un site. Ei măsoară cât de repede pot interacționa utilizatorii cu un site web și ce rezultate obțin pe baza căutării lor. Core Web Vitals funcționează ca semnale care evaluează cât de ușor și perfect este pentru vizitatorii site-ului să navigheze printr-un site.
Când vă îmbunătățiți site-ul și experiența utilizatorului, experiența paginii dvs. va avea un scor mai mare utilizând valorile Core Web Vitals. Google identifică trei valori vitale web de bază pe care proprietarii de site-uri trebuie să le cunoască și să le încorporeze. Acestea sunt enumerate mai jos:
Încărcare: Denumită și cea mai mare vopsea de conținut (LCP), încărcarea măsoară viteza cu care cele mai mari elemente se încarcă și se afișează pe un site. Aceste elemente includ animații, videoclipuri, text, imagini și altele.
Interactivitate: Google numește această schimbare cumulativă a aspectului (CLS) și se asigură că paginile de pe un site web nu au caracteristici neașteptate sau mișcări confuze care să distragă atenția sau să deranjeze utilizatorii atunci când consumă conținutul site-ului dvs.
Stabilitate vizuală: aceasta este denumită din punct de vedere tehnic First Input Delay (FID) și reflectă nivelul de receptivitate al paginilor unui site atunci când vizitatorii site-ului interacționează pentru prima dată cu ele. FID măsoară și viteza cu care un browser poate genera rezultate pentru utilizatorii de pe site-ul dvs.
Cum să îmbunătățești elementele vitale de bază ale site-ului tău web
Primul lucru pe care trebuie să-l faceți este să efectuați o analiză rapidă a performanței site-ului web pentru a vedea cum se descurcă site-ul dvs. în valorile de bază ale datelor vitale web. Puteți folosi diferite instrumente pentru această analiză, inclusiv Google Search Console și Page Speed Insights, printre altele. După efectuarea analizei, este posibil să descoperiți că trebuie să implementați câteva dintre următoarele sfaturi pentru a vă ajuta să vă îmbunătățiți site-ul.
• Reduceți execuția JavaScript
O evaluare FID slabă înseamnă că pagina dvs. de site interacționează cu vizitatorii peste 300 de milisecunde. Când reduceți și optimizați execuția JavaScript, aceasta reduce intervalul de timp dintre momentul în care browserul dvs. execută codurile JavaScript. Rezultatul este un termen de execuție redus. Google recomandă amânarea JavaScript neutilizat pentru a reduce execuția. Pentru a afla dacă site-ul dvs. are vreun JS neutilizat, urmați pașii de mai jos:
• Accesați site-ul dvs. și faceți clic dreapta pe orice parte, apoi selectați „Inspectați”
• Faceți clic pe fila „Surse” și bifați cele trei puncte din partea de jos. Adăugați un instrument „Acoperire” și faceți clic pe funcția de încărcare. Așteptați finalizarea încărcării și puteți vedea volumul JS neutilizat pe pagina dvs.
Cu aceste cunoștințe, puteți începe să reduceți execuția JS. O modalitate prin care puteți reduce execuția este să utilizați divizarea codului. Cum funcţionează asta? Împărțiți pachetul JavaScript în bucăți mai mici. Bundled JS sunt fișiere combinate care sunt grupate pentru a preveni prea multe solicitări HTTP necesare pentru a încărca o pagină web.
Comprimați și optimizați imaginile
Pentru multe site-uri, imaginile sunt cele mai mari elemente de pe paginile lor. Pentru a vă asigura că site-ul dvs. trece de valorile de încărcare, ar trebui să luați în considerare optimizarea imaginilor de pe site. Cu aceasta, pagina dvs. web devine mai ușoară și viteza de încărcare va crește semnificativ.
O pagină mai ușoară va îmbunătăți, de asemenea, experiența utilizatorului, scorul LCP și clasamentele pe rezultatele motorului de căutare. Pentru a reduce dimensiunea paginii, comprimați imaginile folosind un instrument precum Tiny JPG. Reducerea dimensiunii generale a paginii dvs. nu va afecta rezoluția și calitatea, dar va îmbunătăți rezultatele LCP ale site-ului dvs.
Vă recomandăm să utilizați formatul PNG pentru grafică și JPG pentru imaginile peisaj. Pe lângă comprimarea imaginilor, puteți activa și CDN (Content Delivery Network) pentru imaginile site-ului dvs.
Content Delivery Network este un grup de servere din întreaga lume care stochează conținut de pe web. Aceste servere sunt distribuite în diferite locații; imaginile pot fi livrate de pe serverul cel mai apropiat de utilizator într-un mod mai rapid.
Implementați încărcare leneră
Implementarea lazy loading este foarte importantă atunci când afișați imagini pe site-ul dvs. Când utilizați această tehnică, scorul dvs. de bază vitale web și experiența utilizatorului pe site-ul dvs. nu vor fi afectate negativ. Deci, ce este încărcarea leneșă? Încărcarea leneră permite site-ului dvs. să încarce imagini în același moment în care un utilizator defilează în jos pe pagină. Acest lucru asigură că viteza de încărcare a site-ului dvs. nu este compromisă și că puteți atinge un nivel de scor LCP de top. Există multe beneficii asociate cu încărcarea leneșă. Ei includ:
• Performanță îmbunătățită a site-ului
• Restricție de utilizare a lățimii de bandă
• SEO îmbunătățit pe site
• Păstrați vizitatorii site-ului și minimizați rata de respingere
Dacă operați un site web cu pagini care conțin multe videoclipuri, animații, imagini și alte elemente grele, este important să utilizați încărcare leneșă. După implementarea acestui sfat, puteți compara scorul LCP anterior cu cel nou pe care îl obțineți după implementarea încărcării leneșe.
Utilizați dimensiuni adecvate pentru încorporare și imagini
Scorul CLS mai mare de 0,1 este considerat slab. Principalii vinovați pentru un scor atât de slab sunt elementele grele, cum ar fi încorporarea, reclamele și imaginile fără dimensiune. Pentru a îmbunătăți scorul CLS al site-ului dvs., acordați atenție dimensiunilor. Când utilizați lățimea și înălțimea exacte pentru imagini și încorporare, devine mai ușor pentru browser să aloce volumul potrivit de spațiu în pagină în timpul procesului de încărcare. Asigurați-vă că setați dimensiunile adecvate pentru imagini și încorporare atunci când inserați videoclipuri YouTube pe site-ul dvs. web. Iată cum să redimensionați videoclipurile de pe YouTube pentru a le afișa pe site-ul dvs.
• Accesați YouTube și deschideți videoclipul pe care doriți să îl încorporați în site-ul dvs.
• Căutați butonul de partajare și selectați opțiunea <> Încorporare.
• Veți vedea toate detaliile despre videoclip, inclusiv dimensiunea. Copiați codul și inserați-l în backend-ul site-ului dvs. Acest lucru îl va schimba la lățimea și înălțimea corecte pentru a se potrivi corect în site-ul dvs.
Gânduri finale
Acestea sunt sfaturile de top pe care le puteți folosi pentru a îmbunătăți elementele vitale de bază ale site-ului dvs. web. În această postare, am analizat elementele de bază ale elementelor vitale web de bază și sfaturile pe care le puteți folosi pentru a vă îmbunătăți scorurile. Scorurile îmbunătățite înseamnă că clasamentul tău va crește în rezultatele căutării și va exista o rată semnificativă a ratei de respingere pe site-ul tău.
Care sunt pilonii Core Web Vitals?
Potrivit Google, există trei piloni ai Core Web Vitals și sunt viteza, răspunsul și stabilitatea vizuală.
Cum repar un scor CLS slab?
Când includeți anunțuri într-un flux de conținut, asigurați-vă că dimensiunea spațiului este alocată corect pentru a preveni o schimbare. De asemenea, ar trebui să fiți atenți când plasați reclame nelipicioase în jurul părții superioare a ferestrei de vizualizare. De asemenea, luați în considerare rezervarea unui spațiu pentru un spațiu publicitar pe pagina dvs.
Ce este un scor bun CLS?
Un scor CLS mai mic de 0,1 este considerat de Google un scor bun CLS.
Cum verific dacă Core Web Vitals sunt bune sau slabe?
Auditează-ți pagina web rulând Lighthouse. De asemenea, puteți utiliza extensia Web Vitals pentru a măsura și analiza Core Web Vitals ale site-ului dvs.