Google li ha annunciati molti anni fa sul proprio blog, a maggio 2020, ma è solo dal 2021 che i Core Web Vitals (in italiano Segnali Web Essenziali) sono diventati un vero e proprio fattore di ranking. Queste metriche hanno lo scopo di valutare la qualità dell’esperienza dell’utente, ed oggi sono un punto cruciale per la SEO.
Oggi per molti questi aspetti sono ancora oscuri, e non hanno ben chiaro in mente cosa siano, a cosa servano e perché siano così importanti i Core Web Vitals, motivo per cui non sempre si agisce nel modo più giusto nell’ottimizzazione di questo determinato aspetto.
Indice dei contenuti
Cosa sono i Core Web Vitals
Google richiede di semplificare il percorso ai siti, introducendo costantemente aggiornamenti e nuovi parametri per ottimizzare l’esperienza utente nel web. Un recente attore che si è fatto strada in questa sfera è rappresentato proprio dai Core Web Vitals.
I Segnali Web Essenziali sono un set di specifiche metriche che Google considera fondamentali per valutare la qualità complessiva dell’esperienza utente su una pagina web. Essi forniscono un quadro chiaro delle prestazioni di un URL, categorizzate in tre stati: Scadente, Da Migliorare, Buono. Quest’analisi è basata sui dati di performance reali, raccolti dagli utenti che effettivamente visitano il sito.
Questo trio di metriche consiste nel “Largest Contentful Paint” (LCP), “First Input Delay” (FID) e “Cumulative Layout Shift” (CLS), misure che fungono da termometro per la velocità e le performance interattive della pagina.
In sostanza, Google ha incorporato i Core Web Vitals come componente chiave del suo punteggio di “page experience” (esperienza della pagina), un indice che cerca di quantificare globalmente l’usabilità e la qualità dell’esperienza offerta al visitatore. Per monitorare le prestazioni in base a questi parametri, è possibile consultare la sezione “miglioramenti” del proprio account Google Search Console.
Perché i Core Web Vitals sono importanti
In un ecosistema digitale sempre più dinamico e competitivo, avere un sito web ottimizzato dal punto di vista dell’esperienza utente non è più un optional, ma un imperativo.
L’integrità dell’esperienza utente di una pagina viene misurata attraverso vari parametri, tra cui:
- Connessione HTTPS sicura;
- Compatibilità con dispositivi mobili;
- Assenza di pop-up interstiziali invasivi;
- Safe-browsing (assicurando che la tua pagina non contenga malware);
- I Core Web Vitals.
Tra questi, i Core Web Vitals sono di importanza cruciale, poiché forniscono un quadro dettagliato delle prestazioni reali di una pagina web in termini di velocità di caricamento, reattività e stabilità visiva. In altre parole, migliorare i punteggi di LCP, FID e CLS può contribuire a migliorare il posizionamento del tuo sito nei risultati di ricerca di Google.
Tuttavia, è importante ricordare che, nonostante la loro importanza, i Segnali Web Essenziali rappresentano solo una frazione dei numerosi (circa 200) criteri che Google utilizza per determinare l’ordine dei risultati di ricerca. Quindi, mentre l’ottimizzazione dei Core Web Vitals è essenziale, non deve mai trascurare gli altri importanti aspetti del SEO.
Largest Contentful Paint (LCP): cosa sono
Il Largest Contentful Paint (LCP) è uno dei tre componenti chiave dei Core Web Vitals, ed è focalizzato sulla velocità di caricamento. Per essere precisi, misura il tempo necessario per visualizzare il più grande contenuto visibile (da qui il termine “largest contentful“) dal punto di vista dell’utente reale.
Questo elemento più grande potrebbe essere un blocco di testo, un’immagine o un video; è quello che in un certo senso conta di più e che cattura maggiormente l’attenzione dell’utente durante il caricamento della pagina. LCP, quindi, misura il tempo dall’inizio del caricamento della pagina fino a quando questo elemento chiave è completamente disegnato sullo schermo.
Contrariamente ad altre metriche sulla velocità delle pagine, come il Time to First Byte (TTFB) o il First Contextual Paint, che si concentrano sulla velocità del server o sugli aspetti del rendering della pagina, l’LCP misura un’esperienza utente più tangibile: la velocità di visualizzazione dei contenuti principali della tua pagina.
In termini pratici, Google suggerisce di puntare a un LCP inferiore a 2,5 secondi per offrire un’esperienza utente ottimale. Un LCP più lungo rischia di far perdere pazienza all’utente, aumentando così la probabilità di abbandono della pagina.
Come ottimizzare il valore di LCP
Esistono diversi modi per migliorare il valore di LCP. Prima di tutto, è necessario utilizzare Google PageSpeed Insights o altri strumenti simili per scoprire i problemi che influenzano i tempi di caricamento delle tue pagine. Il report fornito da questi strumenti può darti un’idea di quali elementi della pagina stanno causando un alto LCP.
Uno dei modi comuni per migliorare l’LCP è rimuovere o ridurre i terzi script di blocco che possono rallentare il caricamento del tuo sito. Ad esempio, molti widget di social media e script di analisi possono occupare una notevole larghezza di banda.
Migliorare l’hosting web può anche fare una grande differenza: un hosting più affidabile e veloce può rendere i tuoi tempi di caricamento molto più rapidi.
Un altro suggerimento è di utilizzare il caricamento asincrono (lazy loading) per le immagini. Ciò significa che le immagini vengono caricate solo quando un utente scorre fino ad esse, risparmiando tempo nel caricamento delle parti superiori della pagina.
Ridurre gli elementi di grandi dimensioni e ottimizzare i file CSS può anche contribuire a una migliore velocità. Ricorda che ogni millisecondo conta quando si tratta di velocità di caricamento e LCP.
First Input Delay (FID): cos’è
Il First Input Delay (FID) è il secondo componente dei Core Web Vitals di Google, e si riferisce alla reattività di una pagina. In sostanza, misura il tempo che intercorre dall’istante in cui un utente interagisce con la tua pagina (ad esempio, cliccando un link o un pulsante) all’istante in cui il browser è in grado di rispondere a tale interazione.
È importante capire che FID non si concentra sul tempo di visualizzazione dei contenuti (quello è il campo di LCP), ma sulla qualità dell’esperienza utente durante l’interazione con la pagina. Alcuni esempi di interazioni includono l’apertura di un menu a discesa, il click su un link di navigazione, l’inserimento di una email in un campo, o l’apertura di un blocco di testo “a fisarmonica” sui dispositivi mobile.
Google considera FID importante perché misura l’esperienza pratica degli utenti reali. Anche se una pagina può sembrare visivamente pronta, se l’utente non può interagire con essa in modo rapido e fluido, l’esperienza complessiva ne risentirà.
Gli standard di Google indicano che un buon punteggio di FID dovrebbe essere inferiore a 100 millisecondi. Valori superiori potrebbero indicare un’esperienza utente insoddisfacente.
Come Migliorare il FID
Anche per migliorare il FID sono disponibili diverse strategie per ottimizzare il tempo di interazione. Innanzitutto, minimizzare o posticipare JavaScript può essere cruciale per ottenere risultati più soddisfacenti. Durante il caricamento di JavaScript, infatti, gli utenti sono spesso impossibilitati ad interagire con la pagina; ridurre il blocco del thread principale dovuto a JavaScript può quindi portare a un netto miglioramento del punteggio FID.
In secondo luogo, si può limitare l’uso di script di terze parti non essenziali: molti script, come quelli per le mappe interattive, i widget di social media o le analisi, possono occupare un notevole quantitativo della larghezza di banda e bloccare significativamente l’interazione dell’utente.
Inoltre, utilizzare una cache di browser può aiutare a velocizzare i tempi di caricamento dei contenuti, consentendo al browser di elaborare i compiti di JavaScript più velocemente. Questo porta a un minor ritardo prima che la pagina risponda all’input dell’utente e, di conseguenza, a un FID più basso.
È essenziale ricordare, però, che l’ottimizzazione del FID dovrebbe sempre essere centrata sull’esperienza dell’utente finale: Non si tratta solo di ottenere punteggi migliori, ma di garantire ai visitatori di un sito possano interagire facilmente e rapidamente con una pagina.
Cumulative Layout Shift (CLS): cos’è
Il Cumulative Layout Shift (CLS) completa il trio dei Core Web Vitals, concentrandosi sulla stabilità visiva di una pagina web. Mentre il LCP riguarda il tempo necessario per il caricamento dei contenuti più importanti e il FID si preoccupa di quanto tempo ci impiega un sito a reagire alle interazioni degli utenti, il CLS si concentra su quanto un pagina “salti” o “si sposti” durante il caricamento.
Può capitare, ad esempio, che mentre si sta leggendo un articolo online, si decida di cliccare su un link; se mentre si sta effettuando questa operazione, la pagina si sposta, si può cliccare accidentalmente su un pulsante o su un elemento indesiderato. Questo genere di disavventura è il tipo di esperienza che il CLS cerca di quantificare e, in definitiva, di ridurre.
Il CLS misura la somma totale di tutte le modifiche individuali di layout che non sono causate da interazioni dell’utente. Le pagine con un punteggio basso di CLS sono generalmente più confortevoli per l’utente, dato che gli elementi visivi restano dove dovrebbero e non causano interazioni errate.
Per garantire un’esperienza utente ottimale, Google raccomanda di puntare a un punteggio CLS inferiore a 0,1. Un punteggio superiore potrebbe indicare un’esperienza utente frustrante e contribuire a un tasso di rimbalzo più alto.
Come ottimizzare il CLS
La riduzione del Cumulative Layout Shift richiede un’attenzione particolare alle best practices di design e sviluppo del sito web. Assegnare dimensioni fisse ai contenuti multimediali può essere un primo passo verso un punteggio CLS più basso.
Definire altezza e larghezza per immagini, video, GIF, infografiche e altri elementi multimediali consente al browser di sapere quanto spazio questi occupano, evitando improvvise modifiche del layout durante il caricamento della pagina.
Lo stesso principio si applica agli annunci pubblicitari. Riservare uno spazio specifico per gli annunci o per gli iframe previene modifiche improvvise del layout quando questi ultimi si caricano.
Infine, inserire nuovi elementi dell’interfaccia utente sotto l’area corrente di visualizzazione può contribuire a minimizzare le modifiche del layout. Questo approccio riduce la probabilità che l’aggiunta di nuovi elementi sposti contenuti esistenti.
L’obiettivo principale di queste strategie è di creare un’esperienza utente fluida e prevedibile, in cui gli elementi della pagina arrivano al loro posto designato e vi rimangono, favorendo una navigazione intuitiva e senza interruzioni.
Nuovi valori: Interaction to Next Paint (INP)
Per completare il discorso, parliamo del futuro dei Core Web Vital di Google: l’Interaction to Next Paint (INP) è una metrica in attesa di essere implementata che sostituirà il First Input Delay nel 2024. INP valuta la reattività utilizzando dati dall’Event Timing API e si concentra sulla durata che intercorre fra un’interazione dell’utente e l’attimo in cui la pagina risponde con un feedback visivo.
Se, a seguito di un’interazione, una pagina diventa non risponde immediatamente, ciò comporta una cattiva esperienza per l’utente. INP osserva la latenza di tutte le interazioni effettuate dall’utente con la pagina, e ne riporta un valore unico che rappresenta il limite di tempo entro cui sono avvenute tutte (o quasi tutte) le interazioni. Un INP basso indica che la pagina è stata in grado di rispondere rapidamente alla stragrande maggioranza delle interazioni utente.
Il valore aggiunto dell’INP risiede nella sua capacità di registrare la reattività durante tutto il ciclo di vita della pagina. Infatti, i dati di utilizzo di Chrome mostrano che il 90% del tempo trascorso da un utente su una pagina si verifica dopo il caricamento. Pertanto, misurare accuratamente la reattività durante questo periodo è di estrema importanza — ed è esattamente ciò che l’INP si prefigge di fare.
Google suggerisce che un buon punteggio INP dovrebbe essere uguale o inferiore a 200 millisecondi. Tale valore indica che il sito risponde in modo efficiente e tempestivo alla maggior parte delle interazioni dell’utente, fornendo un’esperienza utente positiva e reattiva.
Come ottimizzare INP
Le tecniche per migliorare l‘Interaction to Next Paint sono simili a quelle per ottimizzare il First Input Delay, dal momento che entrambe le metriche riguardano la reattività della pagina web.
Innanzitutto, è importante minimizzare o differire l’esecuzione del JavaScript non essenziale. Durante il caricamento di JavaScript, il browser non può rispondere alle interazioni degli utenti, causando potenziali ritardi. Quindi, riducendo il JavaScript che blocca il thread principale, è possibile migliorare il punteggio dell’INP.
In secondo luogo, l’uso di web workers per eseguire compiti JavaScript intensivi in termini di CPU può migliorare la reattività. I web workers consentono di eseguire JavaScript su thread di background, liberando il thread principale e consentendo al browser di rispondere più rapidamente alle interazioni dell’utente.
Inoltre, l’adozione di un sistema di caricamento ottimizzato delle risorse può fare la differenza. Questo potrebbe includere l’anticipazione del caricamento delle risorse critiche utilizzando il preloading o il prefetching, o ritardare il caricamento delle risorse non essenziali fino a quando non sono necessarie utilizzando tecniche come il lazy loading.
In ogni caso, la chiave per un buon INP è garantire che la pagina sia in grado di rispondere rapidamente a tutte le interazioni dell’utente, indipendentemente dalla loro complessità.
Come monitorare i Core Web Vitals
Il monitoraggio dei Core Web Vitals è un aspetto essenziale nella gestione dell’esperienza utente di un sito web. Google mette a disposizione una serie di strumenti per facilitare questo processo.
Google Search Console, un servizio gratuito fornito da Google, offre una sezione dedicata ai Core Web Vitals. Quest’ultima fornisce un riassunto dello stato dei Core Web Vitals, basato sui dati di esperienza utente raccolti nel Chrome User Experience Report.
PageSpeed Insights è un altro strumento fornito da Google che non solo mostra i punteggi dei Core Web Vitals per un URL specificato, ma suggerisce anche potenziali azioni di ottimizzazione per migliorare le prestazioni di una pagina.
Per un’analisi più dettagliata, può essere utile utilizzare Lighthouse, un’estensione open source di Google, che consente di individuare problemi specifici che potrebbero influire sulle prestazioni del sito.
Anche Chrome DevTools può essere uno strumento prezioso, poiché offre una sezione specifica dedicata ai Core Web Vitals che fornisce un’analisi approfondita delle prestazioni del sito in tempo reale.
Il monitoraggio dei Core Web Vitals dovrebbe essere un elemento fondamentale all’interno di una strategia SEO, in quanto riveste un ruolo determinante nell’esperienza complessiva degli utenti.
