Core Web Vitals

Ce sunt Core Web Vitals?

Core Web Vitals sunt metrici create de Google pentru a îmbunătăți experiența utilizatorului pe site-uri. Marea varietate de instrumente disponibile pentru a analiza viteza de încărcare a fost unul dintre factorii pe care Google i-a luat în considerare la unificarea tuturor acestor metrici, pentru a simplifica puțin complexitatea implicată în optimizarea timpilor de încărcare. Această inițiativă își propune să ne facă să ne concentrăm pe aceste „semnale de calitate” care sunt atât de importante pentru a obține o experiență optimă a utilizatorului.

Google rezumă în câteva cuvinte pe ce se concentrează Core Web Vitals:

• ›

  Experiența de încărcare

• ›

  Interactivitate

• ›

  Stabilitatea vizuală a conținutului paginii

Largest Contentful Paint sau LCP

LCP sau Largest Contentful Paint este o metrică care ne spune timpul de încărcare pentru ca cea mai „mare” piesă de conținut vizibilă utilizatorului să fie disponibilă și utilă. Cu alte cuvinte, Google spune că elementele plasate în ceea ce cunoaștem ca „Above the Fold” trebuie să se încarce rapid și să fie lizibile, și astfel să fie disponibile utilizatorului pentru a putea interacționa cu ele.

Ar trebui clarificat că elementele care apar atunci când utilizatorul dă clic pe ecran sau derulează nu afectează LCP-ul. Cel mai mare conținut poate fi un bloc de text, un videoclip, o imagine etc.

Clasificarea stării LCP în funcție de timpi. Imagine © web.dev

Ce timp consideră Google optim?

După cum putem vedea în grafic, Google consideră că timpul maxim pentru a încărca LCP-ul și a oferi o bună experiență a utilizatorului este sub 2,5 secunde. Este important de menționat că, în timpul încărcării, elementul LCP se poate schimba.

Cum pot afla LCP-ul unui URL?

Chiar în browserul Chrome, prin rularea unui audit Lighthouse, avem opțiunea de a afla ce consideră Google a fi cel mai mare conținut de încărcat. Iată cum:

Ce factori pot influența încărcarea LCP?

Mai multe acțiuni influențează ca timpul de încărcare LCP să fie mai mare decât se aștepta. Aceste elemente sau acțiuni sunt:

• ›

  Răspunsul serverului

• ›

  Interogările bazei de date

• ›

  Răspunsurile API care necesită timp pentru a fi rezolvate

• ›

  CSS sau JS care blochează randarea

• ›

  Lentoarea în încărcarea altor resurse

• ›

  Imagini neoptimizate

• ›

  Etc.

First Input Delay sau FID

FID sau First Input Delay este o metrică care indică cât timp îi ia paginii să reacționeze atunci când utilizatorul interacționează cu oricare dintre elemente.

Metrici preluate din Pagespeed

În instrumentul Pagespeed, pe care Google l-a pus la dispoziția tuturor cu ceva timp în urmă, putem vedea referința la această metrică. Valorile considerate bune ar trebui să fie sub 100 ms.

Clasificarea stării First Input Delay (FID) în funcție de timpi. Imagine © web.dev

Principalele cauze ale problemelor cu această metrică (FID) provin din execuția JavaScript, așa că ar trebui să identificăm ce parte a codului face ca pagina să necesite timp pentru a reacționa la interacțiune. Am experimentat personal această problemă cu încărcările de JS publicitar.

Cumulative Layout Shift sau CLS

Cumulative Layout Shift este o metrică care stabilește limite pentru încărcarea elementelor care modifică afișajul pe măsură ce se încarcă. Vorbim despre a oferi stabilitate elementelor de pe ecran, astfel încât vizualizarea să nu se deplaseze pe măsură ce se încarcă alte resurse.

Google consideră (ei bine, Google și fiecare utilizator) că este foarte enervant ca, atunci când am început să interacționăm cu o pagină (fie citind, derulând etc.), un element care se încarcă mai târziu să deplaseze poziția utilizatorului față de conținut, obligându-l să corecteze prin derulare.

Acest exemplu ne ajută să explicăm mai bine cum funcționează această metrică. La început vedem conținutul încărcat în partea stângă. Când Google vorbește despre stabilitate, se referă la faptul că încărcarea unui al treilea element nu deplasează pe cele încărcate anterior. După cum vedem în imaginea din dreapta, încărcarea videoclipului YouTube a deplasat cele două blocuri care fuseseră încărcate inițial.

De ce sunt importante Core Web Vitals?

De când coexistăm cu motoarele de căutare și, mai exact, cu Google, acesta a tot încorporat obligații pentru oricine are un site și vrea ca acesta să fie una dintre opțiunile din rezultatele căutării.

Îmbunătățirea accesibilității de pe toate dispozitivele, favorizarea navigării securizate sub un protocol de securitate sau penalizarea site-urilor care foloseau publicitate invazivă (interstițiale) au fost câteva dintre bătăliile giganților tehnologiei.

Aceste metrici sunt indicatori pe care Google ni-i oferă pentru a evidenția care părți ale site-ului pot fi o problemă pentru utilizator, dar... Înseamnă asta că sunt importante?

Fie că înțelegem site-urile dintr-o perspectivă a „roboților”, fie dintr-o perspectivă a „utilizatorilor”, aceste metrici sunt indicatori că site-urile noastre nu funcționează atât de bine pe cât ar trebui. Am văzut deja în mai multe studii cât de influent este timpul de încărcare asupra conversiei și asupra răbdării utilizatorului. În prezent nu influențează rankingurile, dar oare vom ignora aceste metrici?

În ceea ce ne privește, cu siguranță le vom lua în considerare.

Afectează Core Web Vitals rankingurile?

Până astăzi, tot ce știm este că metricile pentru îmbunătățirea experienței utilizatorului devin din ce în ce mai importante, iar unele dintre ele sunt deja luate în considerare în rezultatele căutării. În articolul din 28 mai de pe blogul Google, s-a anunțat că în 2021 se așteaptă să lanseze un nou Update pentru a încorpora mai multe metrici legate de experiența utilizatorului.

Trebuie doar să ne amintim cum a gestionat Mobile First Index și anunțurile prealabile. În acest caz, referindu-ne din nou la articolul din mai, avertizează că va exista o notificare prealabilă de cel puțin 6 luni, așa că... Va exista o actualizare până la sfârșitul anului viitor?

Instrumente pentru optimizarea Core Web Vitals

Acum că am vorbit despre ce sunt Core Web Vitals și importanța pe care o vor avea în lunile următoare, este momentul să începem să lucrăm la optimizarea acestor metrici. Prin diferite instrumente vom putea aborda problemele care sunt detectate și obține o îmbunătățire a performanței.

Lighthouse

Lighthouse este un instrument open-source puternic pe care îl găsim în Chrome. Prin Lighthouse, ne putem audita site-ul, rulând diferite teste pentru a obține rezultate privind deficiențele sau părțile paginii care necesită optimizare. Printre aceste părți se numără metricile Core Web Vitals.

Imagine preluată din rezultatele unui audit Lighthouse

Page Speed Insights

Page Speed Insights este o altă opțiune pe care Google ne-o oferă pentru a obține datele de performanță ale site-ului nostru. Acest instrument ne arată chiar grafice ale celor mai importante metrici și starea lor. Page Speed Insights se bazează pe un raport de experiență a utilizatorului al cărui obiectiv este obținerea de date în comparație cu alte site-uri.

Metrici oferite de Page Speed Insights

Chrome UX

Chrome User Experience Report este un set de date pe care Google le oferă privind comportamentul utilizatorilor din întreaga lume prin Chrome. Pentru a accesa aceste date trebuie să folosești Big Query, precum și să ai un cont Google Cloud.

Prin Google Data Studio, au făcut accesul mai ușor și au totul semi-pregătit pentru noi în acest Dashboard

Chrome Dev Tools

Putem analiza metricile Core Web Vitals nu doar cu Lighthouse; dacă ne adâncim în instrumentele pentru dezvoltatori din Chrome, putem ajunge la aceleași concluzii. De exemplu, în fila „Performance”, dacă facem o înregistrare sau o încărcare nouă, putem obține informații valoroase despre cum se comportă URL-ul nostru.

Captură de ecran realizată în opțiunea Performance din Chrome Dev Tools

Web.Dev

Există întotdeauna un mod mai ușor de a face lucrurile, cel puțin când vine vorba de a ne cunoaște Core Web Vitals. Pe site-ul oficial, avem o pagină care detaliază fiecare metrică și ne oferă o explicație a ceea ce este și practici pentru a o îmbunătăți.

În plus, în Chrome Store avem o extensie care ne oferă aceste informații la accesarea fiecărui URL:

Cu o indicație roșie sau verde putem vedea starea URL-ului nostru în raport cu aceste metrici:

Captură de ecran a rezultatelor oferite de extensia Web Vitals

Search Console

Search Console este un instrument indispensabil pentru orice administrator de site. A fost adăugată o funcție care ne ajută să vedem ce URL-uri au probleme cu aceste 3 metrici (LCP, FID și CLS). În meniul din stânga, avem opțiunea „Core Web Vitals”. Când alegem această opțiune, vor apărea două grafice care arată rezultatele URL-urilor pe dispozitiv. Dacă alegem dispozitivul (desktop sau mobil), vom vedea în detaliu ce URL-uri au probleme.

Nu te alarma dacă vezi un număr mare de URL-uri în dreapta; acest lucru este relativ normal, întrucât problemele apar de obicei pe tipuri de pagini (de exemplu postările de blog), iar lucrul la una dintre ele ne va aduce îmbunătățirea pe toate.

Concluzii

Acest tur prin Core Web Vitals își propune să ne introducă în metrici care vor câștiga tot mai multă proeminență și cu care noi, fie că suntem SEO sau administratori de site, vom conviețui. De la SEO Alive, vrem să îți recomandăm să folosești toate aceste instrumente pe care ți le-am oferit, care fără îndoială te vor ajuta să îmbunătățești performanța WPO a site-ului tău.

*Accepți provocarea de a îmbunătăți viteza site-ului tău? Rulează un test cu oricare dintre instrumentele pe care le-am menționat și trimite-ne un mesaj cu o captură de ecran. Îți vom da un sfat pentru a-l îmbunătăți complet gratuit! *