Core Web Vitals: i segnali essenziali di Google

I Core Web Vitals sono un insieme di fattori specifici che Google considera importanti per l'esperienza utente complessiva su una pagina web.

Sono costituiti da tre parametri specifici relativi alla velocità della pagina e all'interazione con l'utente: il tempo di rendering dell'elemento più grande della pagina, il ritardo del primo input e la stabilità dei contenuti durante il caricamento.

In breve, i Core Web Vitals sono un sottoinsieme di fattori che fanno parte del punteggio "esperienza della pagina" di Google (in pratica, il modo in cui Google valuta la UX complessiva della tua pagina).

Puoi trovare i dati relativi ai Core Web Vitals (Segnali web essenziali) del tuo sito nella sezione "Esperienza" del tuo account Google Search Console.

Perché i Core Web Vitals sono importanti?

Nel 2020 Google dichiarò che l'esperienza sulla pagina sarebbe diventata un fattore di ranking ufficiale del suo algoritmo e che i Core Web Vitals avrebbero rappresentato una parte importante del punteggio di un sito ai fini del ranking.

Nei successivi 2 anni l'aggiornamento è stato implementato gradualmente per tutti gli utenti a livello globale, ed è oggi del tutto operativo.

La nuova esperienza in pagina di Google consiste, quindi, in un mix di fattori che Google considera importanti per l'esperienza dell'utente:

• HTTPS.
• Compatibilità con i dispositivi mobili.
• Assenza di pop-up interstiziali.
• "Navigazione sicura" (in pratica, assenza di malware nella pagina).

E i Core Web Vitals.

È importante sottolineare che un ottimo punteggio di esperienza in pagina non ti porterà magicamente al primo posto su Google. Infatti, Google si è affrettato a precisare che l'esperienza di pagina è uno dei tanti (circa 200) fattori che utilizza per classificare i siti nella ricerca.

Come migliorare il punteggio dei Core Web Vitals

Vuoi incrementare il tuo punteggio per i Core Web Vitals? Sei nel posto giusto.

In questa guida ti mostrerò cosa puoi fare per migliorare ciascuno dei tre Segnali web essenziali misurati da Google.

Largest Contentful Paint (LCP)

LCP è il tempo di caricamento di una pagina dal punto di vista di un utente reale.

In altre parole: è il tempo che intercorre tra il clic su un link e la visualizzazione della maggior parte del contenuto della pagina sullo schermo.

LCP è diverso dalle altre misurazioni della velocità delle pagine. Infatti, molte altre metriche di velocità della pagina (come TTFB e First Contextual Paint) non rappresentano necessariamente quello che significa per un utente aprire una pagina web.

Invece, LCP si concentra su ciò che conta davvero quando si parla di velocità della pagina: la possibilità di visualizzare la pagina e interagire con essa.

Puoi verificare il tuo punteggio LCP utilizzando PageSpeed Insights di Google.

Il che è utile, soprattutto quando si tratta di individuare le aree da migliorare.

L'aspetto positivo dell'utilizzo di Google Pagespeed Insights è che puoi vedere come si è comportata la tua pagina nel mondo reale (sulla base dei dati del browser Chrome).

Detto questo, ti consiglio di guardare i dati relativi al tuo LCP nella tua Search Console.

Perché?

Come Google PageSpeed Insights, i dati di Search Console provengono dal Report sull'esperienza utente di Chrome.

Ma a differenza di PageSpeed Insights, puoi vedere i dati LCP su tutto il tuo sito. Così, invece di analizzare pagine casuali una per una, otterrai una lista di URL che sono buoni, scarsi.. o che si trovano in una via di mezzo.

A questo proposito, Google ha delle linee guida specifiche per LCP. La velocità di LCP viene suddivisa in tre categorie: Buono, Richiede miglioramenti e Scarso.

In poche parole, devi fare in modo che ogni pagina del tuo sito ottenga un punteggio LCP di 2,5 secondi o meno.

Questa può essere una vera sfida per le pagine web di grandi dimensioni o per quelle con molte funzioni.

Ad esempio, questa pagina del mio sito contiene decine di immagini ad alta risoluzione.

Ecco perché il valore LCP in quella pagina ha un tempo di 5,1 secondi (che è considerato "scarso").

Non è una scusa ma dimostra che migliorare LCP non è così semplice come installare una CDN. In questo caso potremmo dover rimuovere alcune immagini dalla pagina e ripulire il codice.

Un lavoro duro? Sicuramente. Ne vale la pena? Senza alcun dubbio.

Ecco alcune cose che puoi fare per migliorare LCP sul tuo sito:

• Rimuovi tutti gli script di terze parti che non sono necessari: un nostro studio sulla velocità delle pagine ha rilevato che ogni script di terze parti rallenta una pagina di 34 ms.
• Aggiorna il tuo host web: un hosting migliore significa tempi di caricamento più rapidi in generale (includendo LCP).
• Imposta il lazy loading: il lazy loading fa sì che le immagini vengano caricate solo quando si scorre la pagina. Questo significa che puoi ottenere un LCP significativamente più veloce.
• Rimuovi gli elementi di grandi dimensioni della pagina: Google PageSpeed Insights ti dirà se la tua pagina ha un elemento che rallenta il valore LCP della pagina.

• Minimizza il tuo CSS: un CSS ingombrante può ritardare notevolmente i tempi di LCP.

First Input Delay (FID)

Diamo quindi un'occhiata al secondo Core Web Vital di Google: First Input Delay.

A questo punto la tua pagina ha raggiunto FCP. Ma la domanda è: gli utenti possono interagire con la tua pagina?

Ebbene, è proprio questo che misura FID: il tempo necessario a un utente per interagire con la tua pagina.

Esempi di interazioni sono:

• Scegliere un'opzione da un menu.
• Cliccare su un link mentre si naviga nel sito.
• Inserire l'e-mail in un modulo.
• Aprire un "testo a fisarmonica" sui dispositivi mobili.

Google considera FID importante perché tiene conto di come gli utenti reali interagiscono con i siti web.

E, come per FCP, ha criteri specifici per definire un FID accettabile.

FID tecnicamente misura quanto ci mette ad accadere qualcosa in una pagina.

In questo senso, è un punteggio di velocità della pagina, ma va un passo oltre e misura il tempo che gli utenti impiegano per fare effettivamente qualcosa sulla tua pagina.

Per una pagina che è composta al 100% da contenuti (come un post di un blog o un articolo di notizie), FID probabilmente non è un grosso problema. L'unica vera "interazione" che realizza l'utente è scorrere la pagina o pizzicarla per ingrandirla o rimpicciolirla.

In effetti, la mia Search Console non riporta nemmeno il valore FID per il mio sito.

Credo sia dovuto al fatto che non ho pagine di login o altre pagine in cui qualcuno deve inserire subito qualcosa.

Ma per una pagina di login, una pagina di iscrizione o altre pagine in cui gli utenti devono cliccare rapidamente su qualcosa, il FID è importantissimo.

Ad esempio, pensa all'esperienza di caricamento di una pagina come questa:

In una pagina di login come questa, il tempo di caricamento dei contenuti non è così importante: ciò che conta è la velocità con cui puoi iniziare a digitare i tuoi dati di accesso.

Ecco alcune cose che puoi fare per migliorare il punteggio FID del tuo sito.

• Riduci al minimo (o posticipa) JavaScript: è quasi impossibile per gli utenti interagire con una pagina mentre il browser sta caricando JS. Quindi ridurre al minimo o posporre l'uso di JavaScript sulla tua pagina è fondamentale per il FID.
• Rimuovi gli script di terze parti non fondamentali: proprio come nel caso di FCP, gli script di terze parti (come Google Analytics, heatmap ecc.) possono avere un impatto negativo sul punteggio di FID.
• Usa la cache del browser: aiuta a caricare più velocemente i contenuti della tua pagina. In questo modo, il browser dell'utente può caricare JS ancora più velocemente.

Cumulative Layout Shift (CLS)

Il Cumulative Layout Shift (CLS) indica quanto è stabile una pagina durante il caricamento (la cosiddetta "stabilità visiva").

In altre parole, se gli elementi della tua pagina si spostano durante il caricamento, allora hai un CLS elevato. Il che è negativo.

Devi, invece, fare in modo che gli elementi della tua pagina siano abbastanza stabili durante il caricamento. In questo modo, gli utenti non dovranno cercare di nuovo i link, le immagini e i campi da compilare quando la pagina si sarà caricata completamente (e non rischieranno di cliccare per errore su un elemento che prima si trovava in un altro punto della pagina).

Ecco i criteri specifici di Google per CLS:

Come puoi vedere, è un aspetto su cui devo lavorare. Soprattutto su mobile.

Ecco alcuni semplici accorgimenti che puoi adottare per ridurre al minimo il tuo CLS.

• Utilizza le dimensioni dell'attributo set size per tutti i media (video, immagini, GIF, infografiche, ecc.): in questo modo, il browser dell'utente saprà esattamente quanto spazio occupa un determinato elemento nella pagina e non lo cambierà al volo durante il caricamento completo della pagina.
• Assicurati che gli elementi pubblicitari abbiano uno spazio riservato: in caso contrario, possono apparire all'improvviso sulla pagina, spingendo il contenuto in basso, in alto o di lato.
• Aggiungi i nuovi elementi dell'interfaccia utente below the fold: in questo modo non spingono in basso i contenuti che l'utente si aspetta di vedere in un determinato punto della pagina.

Continua ad imparare

Nozioni di base sulla UX: I Core Web Vitals (e in generale la metrica "esperienza in pagina" di Google) cercano di dare una valutazione quantitativa all'esperienza dell'utente. Quindi, migliore è la tua UX in generale, migliore sarà il punteggio relativo all'esperienza sulle tue pagine. La guida di Google è un ottimo punto di partenza.

Come migliorare il tuo punteggio su Google PageSpeed ​​Insights: Scopri come utilizzare PageSpeed Insights, lo strumento gratuito di Google che misura la velocità del tuo sito, per migliorare l'esperienza dell'utente e la tua SEO.

Panoramica di Chrome Lighthouse: Un utile strumento integrato in Google Chrome che spiega perché una pagina carica (o non carica) rapidamente.

Questo post è stato pubblicato originariamente su backlinko.com.

Condividi