4 Sfaturi de top pentru îmbunătățirea auditului Core Web Vitals

Publicat: 2022-05-10

Nu există o regulă strictă și rapidă pentru cum să auditați Core Web Vitals, în special cu o varietate de instrumente terțe de luat în considerare. Detaliem câteva dintre sfaturile noastre de top pentru auditarea vitezei pentru a le incorpora în fluxurile dvs. de lucru, care vor acoperi:

  • Experiență în pagină și Google Search Console
  • Dezavantajele PageSpeed ​​Insights
  • Instrumente de audit de la terți recomandate
  • Înțelegerea diagramelor cu cascade

1. Începeți fluxul de lucru de audit Core Web Vitals cu Search Console

Când auditați un site web pentru viteza site-ului și problemele Core Web Vitals, vă recomandăm să începeți întotdeauna procesul de depanare, examinând secțiunea „Experiență” din Search Console – cu condiția ca accesul să fie disponibil. Consola de căutare adună date reale de utilizator (câmp) din raportul Chrome UX, așa că acesta este o modalitate ușoară de a înțelege care dintre problemele LCP, CLS sau FID vă afectează experiența utilizatorului și, în cele din urmă, potențialul de clasare al site-ului.

Navigați la „Page Experience” > „Core Web Vitals”, iar graficul afișat va afișa numărul de adrese URL care sunt clasificate fie „Bine”, „Necesită îmbunătățire” sau „Slab” pentru proprietatea site-ului web. De exemplu:

Exemplu de grafic Core Web Vitals de la GSC

Consultați graficul de mai jos despre timpi și valori de la Google privind pragurile Core Web Vitals de mai sus.

Bun Necesită îmbunătățire Sărac
LCP <=2,5s <=4s >4s
FID <=100 ms <=300 ms >300 ms
CLS <=0,1 <=0,25 >0,25

De aici, putem evalua dacă majoritatea adreselor URL sunt sau nu clasificate drept Bine”, deci trecând toate cele 3 valori vitale web de bază, sau dacă majoritatea paginilor sunt „Slab” sau „Necesită îmbunătățire”, indicând că există unele probleme tehnice restante. care trebuie rezolvate pentru a trece.

Sfat util: paginile trebuie să treacă toate cele trei elemente vitale web pentru a trece la starea „Bun” și nu este suficient ca majoritatea adreselor URL ale site-ului să fie în intervalul „Necesită îmbunătățire”.

Puteți apoi să detaliați fiecare secțiune pentru a descoperi adresele URL specifice care sunt afectate de problemele de viteză și care necesită auditare. Acestea sunt grupate după cele care sunt similare la nivel de șablon. Deci, în loc să încerci să auditezi toate tipurile diferite de adrese URL pe care le poate avea un site - de exemplu, pagina de pornire, paginile de categorii, paginile de produse, postările de blog etc., problemele cu care se confruntă utilizatorii reali atunci când vizitează site-ul web pot fi centrate doar în jurul 1 sau 2 dintre acestea, ceea ce înseamnă că vă puteți concentra eforturile numai asupra acestor șabloane, ceea ce poate economisi mult timp.

2. Folosiți PageSpeed ​​Insights cu moderație

Deși PageSpeed ​​Insights (PSI) este un instrument util gratuit de la Google, care oferă o imagine de ansamblu la nivel superior asupra oportunităților potențiale de a remedia problemele, este într-adevăr o modalitate leneșă de a audita viteza site-ului dacă este utilizat izolat. Am văzut mulți SEO care au luat recomandările, uneori cuvânt cu cuvânt, și le prezintă înapoi dezvoltatorilor clienților sau echipei tehnice fără a înțelege cu adevărat de ce sau orice context din spatele lor.

Din păcate, acest lucru poate duce adesea la răspunsul la mai multe întrebări, mai ales dacă nu vă aprofundați mai mult în oportunitățile și recomandările pe care instrumentul le va scuipa.

De exemplu, cu toții am auzit de recomandarea „Eliminați resursele de blocare a randării” pentru a accelera încărcarea elementului LCP, dar ce se întâmplă atunci când această resursă este esențială pentru a avea loc la prima vopsea, cum ar fi un script de banner cookie sau activele afectate sunt resurse terțe? Este posibil ca dezvoltatorii să-l dea înapoi direct, deoarece nu vor fi multe ce vor putea face – deci este foarte important ca orice recomandări tehnice luate de la PSI să fie luate cu un praf de sare și investigate în continuare înainte de a le trimite înapoi la dezvoltatori.

De asemenea, este util să știți că PSI utilizează un dispozitiv emulat set (Moto G4) cu Lighthouse, dar problemele pot varia considerabil în funcție de dispozitivul pe care utilizatorii reali îl folosesc cel mai frecvent, așa cum este cazul testării „de laborator”. Poate însemna adesea că PSI nu va returna probleme sau oportunități de testare pe acel dispozitiv specific, chiar dacă știți că există o problemă pentru utilizatorii reali ai site-ului din raportul Chrome UX.

Configurația de testare Lighthouse implicită utilizată de PageSpeed ​​Insights

Prin urmare, recomandăm întotdeauna utilizarea PSI împreună cu alte instrumente de testare a vitezei în care configurația dispozitivului și a conexiunii pot fi ajustate în consecință.

3. Explorați instrumente alternative de auditare a vitezei

Pe lângă utilizarea PageSpeed ​​și a altor instrumente Google, vă recomandăm să explorați și alte instrumente gratuite și freemium de testare a vitezei, cum ar fi WebPageTest (WPT) sau GTMetrix.

WebPageTest are o serie de caracteristici utile și opțiuni de configurare care ajută la testarea vitezei la nivel de pagină. Configurația avansată vă permite să ajustați setări importante de testare, cum ar fi browserul și tipul de dispozitiv, precum și locația de testare. Acest lucru vă permite să vă ajustați auditul, mai ales dacă știți unde se află majoritatea utilizatorilor site-ului, precum și tipul lor de dispozitiv, ceea ce înseamnă că nu vă bazați doar pe dispozitivul simulat prestabilit de la Google.

Aici, puteți, de asemenea, să ajustați setările de conexiune de la conexiunea 3G Fast implicită, precum și să blocați anumite adrese URL dacă doriți să testați creșteri de performanță pentru scripturi supărătoare. Există o mulțime de alte opțiuni de configurare pe care nu le-am enumerat pentru a le explora, dar cele de mai sus sunt cele pe care le-am găsit cele mai utile atunci când audităm elementele vitale web de bază.

Opțiunile utile de configurare avansată ale WebPageTest

Odată ce a fost efectuat un test, navigați la fila Core Web Vitals pentru a obține o defalcare detaliată a performanței pentru fiecare măsură, inclusiv benzi de film, cronologie video, diagrame în cascadă, precum și o defalcare granulară a elementului care a declanșat evenimentul - toate acestea sunt exportabile într-o gamă largă de formate și, cel mai bine, sunt gratuite!

Vizualizarea filmului este deosebit de utilă pentru a înțelege în ce moment al încărcării paginii apar vizual anumite elemente, ceea ce poate ajuta la stabilirea priorităților care ar putea fi încărcate mai rapid. Se va afișa foarte clar dacă există schimbări vizuale semnificative pentru a ajuta la identificarea elementelor care o cauzează.

Exemplu de filmare care arată o problemă CLS din cauza încărcării unui banner cookie

GTMetrix are caracteristici similare cu WebPageTest, cu toate acestea, multe dintre opțiunile avansate care sunt gratuite în WPT sunt disponibile numai în pachetele plătite.

4. Cunoașteți diagramele Cascadei

În termeni de bază, o diagramă în cascadă este o cronologie a momentului în care fișierele sau materialele sunt solicitate, cât timp au durat pentru descărcare și când sunt vizibile pe pagină.

Privirea unei diagrame în cascadă poate părea puțin descurajantă din punct de vedere al offsetului, deoarece există o mulțime de rânduri diferite, lungimi de bare și culori care înseamnă lucruri diferite - dar nu vă lăsați tergiversați! Petrecerea timpului învățând și înțelegerea diagramelor în cascadă este cea mai importantă abilitate pe care ar trebui să o aibă un SEO tehnic pentru auditarea vitezei.

Dacă sunteți obișnuit să utilizați WebPageTest pentru auditarea datelor vitale web, considerăm că diagramele lor în cascadă sunt cele mai ușor de utilizat. WebPageTest oferă o cheie cu coduri de culoare deasupra diagramei care indică informațiile de conectare, tipurile de resurse solicitate și alte evenimente, cum ar fi execuția JS. De asemenea, afișează vizual resursele de blocare a randării, precum și evidențiază resursele solicitate care au un răspuns 3xx sau 4xx.

Sfat util: acordați atenție nuanței deschise și închise a barelor orizontale de pe cascadă, nuanța deschisă indică faptul că resursa a fost solicitată de browser, în timp ce nuanța închisă indică că resursa este descărcată .

Per total, acest lucru ajută la obținerea unei înțelegeri mai profunde a problemelor de performanță de pe site și, la rândul său, face recomandările dvs. pentru a le remedia mai ușor de acționat. Vă recomandăm articolul detaliat al lui Matt Hobbs despre cum să citiți o diagramă cu cascadă pentru a afla mai multe.


Dacă sunteți în căutarea unor sfaturi de specialitate cu privire la rezolvarea problemelor de performanță de pe site-ul dvs., vă rugăm să ne contactați sau să vizitați pagina Servicii tehnice SEO pentru mai multe informații despre cum vă poate ajuta Semetrical.