Core Web Vitals: Ce sunt acestea și cum le puteți testa?

Ultima actualizare pe 17 septembrie 2020

Oricine conduce un site web știe cât de important este să funcționeze cât mai bine posibil. Site-urile întârziate și prost construite nu reușesc să transmită un sentiment de încredere și credibilitate. Utilizatorul web mediu trebuie să se simtă astfel înainte de a se simți suficient de confortabil pentru a vă folosi site-ul. Pentru a vă ajuta mai bine pe dumneavoastră și pe dezvoltatorii web din întreaga lume să-și îmbunătățească site-urile, Google a lansat recent Core Web Vitals. Acesta este un program nou care oferă o serie de valori pentru a ajuta la determinarea calității și a experienței potențiale a utilizatorului pe un site. În acest articol, vom detalia principalele valori sau valorile vitale web și cum le puteți testa pentru a determina cum sta site-ul dvs.

Care sunt principalele elemente vitale web?

Atunci când se determină calitatea serviciului oferit de un site, există câteva parametri pe care trebuie să le revizuiți pentru a dezvolta o imagine clară. Google l-a restrâns pentru dezvoltatorul web obișnuit. Ei au stabilit că trei metrici sunt principalele componente prin care un site poate fi evaluat. Aceste trei valori sunt cea mai mare vopsea de conținut (LCP), Întârzierea primei introduceri (FID) și Schimbarea aspectului cumulativ (CLS).

Cea mai mare vopsea de conținut este o măsură a cât de repede se încarcă pagina dvs. web. Acesta marchează punctul în care a fost măsurat conținutul principal al paginii în cauză. Aceasta este măsura în care se încarcă cel mai mare bloc de text (sau imagine) de pe pagina dvs. În general, ați dori ca cea mai mare vopsea de conținut de pe site să nu dureze mai mult de 2,5 secunde pentru a se încărca. Cu siguranță, acesta este un punct care merită luat în considerare în timpul designului web .

First Input Delay măsoară modul în care se comportă site-ul dvs. atunci când utilizatorii interacționează cu pagina. Aceasta implică lucruri precum receptivitatea. Ori de câte ori un utilizator face clic pe pagina dvs., timpul necesar site-ului web pentru a răspunde la acel clic este măsurat prin prima întârziere de intrare. De obicei, orice lucru mai rapid de 100 ms este bun, dar după aceea, veți dori să faceți unele îmbunătățiri.

În cele din urmă, Cumulative Layout Shift măsoară stabilitatea elementelor vizuale de pe pagina ta. Este o măsură cuantificabilă a cantității de schimbare neașteptată a aspectului paginii. Pentru fiecare dintre aceste trei valori, veți dori să atingeți percentila 75 sau mai bună dintre toate încărcările de pagină. Acest lucru ar fi considerat „de trecere” în măsura în care sunt luate în considerare aceste valori.

Cum se măsoară valorile vitale web de bază?

Am stabilit că aceste valori pot fi la fel de importante ca o campanie SEO bine executată, deci cum sunt măsurate? Deoarece Google consideră că elementele vitale ale web sunt coloana vertebrală a experienței utilizatorului, s-a angajat să furnizeze instrumente pentru a le măsura. Mai jos sunt trei moduri prin care se poate măsura performanța principală a site-ului lor.

Prin Raportul privind experiența utilizatorului Chrome, Google colectează experiențe anonime, reale ale utilizatorilor pentru fiecare web de bază vital. Acest lucru este util deoarece înseamnă că aplicațiile externe nu trebuie configurate în prealabil. De fapt, Google s-a ocupat deja de asta din timp. În plus, instrumente precum PageSpeed ​​Insights rulează pe aceeași platformă, ceea ce înseamnă că le puteți folosi imediat.

Deși această metodă este destul de simplă și necesită puține contribuții din partea dvs., analiza oferită de această metodă nu este foarte detaliată. Neglijează includerea telemetriei pe vizualizare de pagină, printre altele. Acest lucru ar ajuta pe cineva să diagnosticheze cu precizie orice probleme potențiale cu o pagină web.

Folosind JavaScript

Alternativ, se poate folosi JavaScript pentru a obține un control asupra elementelor vitale web de bază. Cel mai simplu mod de a începe este să trageți pur și simplu intrarea JavaScript din biblioteca sa pentru web-vitals. Acest lucru oferă API-uri web gata de utilizare care sunt precise. În plus, Chrome Web Store oferă o extensie, numită Web Vitals Chrome Extension , care vă permite să raportați despre fiecare web vital fără a fi nevoie să scrieți niciun cod.

În cele din urmă, se pot folosi instrumente de laborator pentru a măsura fiecare dintre elementele vitale ale web. Acest lucru este deosebit de util pentru cei care doresc să își facă o idee despre performanța unui site înainte de a fi lansat. Cu toate acestea, nu înseamnă că valorile câmpului pot fi ignorate. Experiența unui utilizator este afectată de o mare varietate de factori. Exemplele includ condițiile de rețea și programele suplimentare care pot fi rulate de către utilizator. Prin urmare, este în interesul dvs. să profitați de testarea instrumentelor de teren odată ce site-ul dvs. este deschis și funcțional. Este o modalitate simplă de a vă asigura că totul este în ordine.

Alte valori de cunoscut

În timp ce elementele vitale web de bază acoperite sunt cele mai importante de luat în considerare, există și alte valori valoroase ale calității web de luat în considerare. La urma urmei, orice îmbunătățire a performanței site-ului și a plăcerii clienților tăi de un site este de dorit. Aceste măsuri ajută adesea la reglarea fină a diagnosticului unei pagini web. Unele dintre acestea includ măsuri precum Time to First Byte, care este importantă pentru experiența de încărcare a utilizatorilor de pe site-ul dvs. și Time to Interactive, care este utilă dacă aveți o problemă cu interactivitatea de pe site. Ambele, deși importante, nu sunt măsurabile pe teren și, în consecință, nu li se acordă același statut ca principalele elemente vitale web de bază.

Ce se întâmplă cu Lighthouse 6.0?

Dacă sunteți interesat să evaluați calitatea site-ului dvs., un astfel de instrument care vă poate ajuta să începeți dacă sunteți în căutarea unui diagnostic rapid este Lighthouse. Acest program de auditare este automat și este disponibil în Chrome DevTools fie ca extensie disponibilă prin Magazinul Chrome, fie ca modul Node și CLI.

Cea mai recentă versiune a Lighthouse încorporează accentul pus de Google pe elementele vitale web de bază, cum ar fi FDI și CLS, și oferă o evaluare a modului în care site-ul dvs. funcționează în ceea ce privește acele valori. Acum, scorul de performanță furnizat de Lighthouse cu privire la site-ul dvs. a fost actualizat pentru a include aceste modele noi, ceea ce înseamnă că modelul vechi, ponderat, a fost adaptat astfel încât să arate acum:

Aceste noi schimbări au efecte tangibile asupra evaluărilor de performanță ale site-urilor. Doar 20 la sută dintre site-uri au înregistrat o îmbunătățire a scorurilor lor de evaluare, în timp ce aproximativ cincizeci la sută din toate site-urile au înregistrat o scădere de cinci puncte sau mai mare a scorurilor cu scala ponderată recent implementată.

Chrome DevTools

Chrome DevTools, precum Lighthouse, a suferit câteva modificări noi pentru a servi mai bine dezvoltatorilor web. Principalul dintre aceste modificări este remedierea filei de probleme, care în iterațiile anterioare a suferit de probleme frecvente și aglomerație. În plus, panoul de performanță înregistrează acum timpul total de blocare în partea de jos a paginii după înregistrarea performanței de încărcare. Acest instrument măsoară cât timp o pagină pare să fie funcțională, dar nu este de fapt utilizabilă în acest moment, din cauza blocării de către JavaScript a firului principal, împiedicând introducerea utilizatorului să fie acționată de către pagină. În cele din urmă, Tabloul de bord Chrome UX descompune acum paginile în funcție de elementele vitale ale conținutului web, permițând utilizatorilor să compare performanța site-ului lor cu cea a concurenței lor, precum și a industriei în ansamblu.

Core Web Vitals, pe scurt, sunt măsuri ale experienței utilizatorului pe o pagină web. Pe măsură ce lucrurile evoluează, este posibil să se schimbe atât în ​​moduri minore, cât și semnificative. Pe măsură ce vă optimizați pagina web, încercați să mențineți elementele vitale de bază sănătoase și veți fi sigur că îi veți menține mulțumiți pe cei care trec pe site-ul dvs.