Google Page Experience: da maggio 2021 arriva la UX anche per la SEO
Google Page Experience: Cosa vuol dire? Che da maggio 2021 si parlerà anche di User Experience per la SEO.
Oggi, quando l’utente atterra su una pagina, ha sempre meno tempo e pazienza. Quindi, quando creiamo i nostri siti web, stiamo sempre attenti ai tempi di caricamento e che l’interfaccia si adatti ad ogni dispositivo.
Ecco perché da maggio 2021 big G valuterà 3 nuovi elementi per misurare la UX (User Experience) che, insieme ad altri già noti, diventeranno fattori di ranking SEO per decidere quale sito apparirà prima o dopo sul motore di ricerca.
Scopri tutti i nostri articoli sulla SEO
Ecco i 3 indicatori che il nuovo algoritmo di Google Page Experience terrà in considerazione
- il Largest Contentful Paint (LCP), che consente di misurare le prestazioni di caricamento del contenuto più grande all’interno della pagina.
- il First Input Delay (FID), che misura il tempo che intercorre tra la prima volta in cui un utente interagisce con una pagina e il momento in cui il browser è effettivamente in grado di rispondere;
- il Cumulative Layout Shift (CLS), che misura la stabilità visiva di una pagina.
Largest Contentful Paint (LCP)
Questa metrica valuta, la velocità con cui viene mostrato, sul display dell’utente, l’elemento principale (che sia blocco di testo o immagine); quindi quello più grande e impegnativo della pagina visitata.
Perché è importante questo indice?
Perché le persone giudicano il tempo di caricamento come rapido o lento, in funzione del momento in cui viene loro mostrato il contenuto che considerano utile. In questa prospettiva, viene dato maggior rilievo a quello che percepiscono piuttosto che al sito: si tratta di indicazioni preziose per i webmaster, che possono immedesimarsi negli utenti in un vero e proprio scambio di ruoli.
Google ritiene buono un LCP quando resta inferiore ai 2,5 secondi dall’inizio del caricamento della pagina; da migliorare quando si assesta tra i 2,5 e i 4 secondi; pessimo se supera i 4 secondi.
Come viene misurato il Largest Contentful Paint (LCP)?
L’algoritmo abbiamo detto terrà conto del contenuto più grande. Ma quali sono gli elementi da tenere d’occhio nei nostri siti?
Te li diciamo subito:
- blocchi di testo;
- video;
- immagini;
- immagini di sfondo caricate tramite CSS;
- tag di intestazione;
- liste;
- tabelle.
L’obiettivo è raggiungere un LCP sufficiente sulla maggior parte delle tue pagine: per Google una percentuale apprezzabile è il 75% delle visualizzazioni di pagina.
Come possiamo ottimizzare il Largest Contentful Paint (LCP) nella Google Page Experience?
Tra gli strumenti forniti da Google per misurare l’LCP, ce ne sono alcuni che restituiscono dati reali e altri che forniscono dati previsionali o “di laboratorio”.
Se vuoi conoscere i dati attuali del tuo sito utilizza:
- Search Console;
- Rapporto sull’esperienza utente di Chrome;
- PageSpeed Insights;
- Libreria JavaScript web-vitals.
Se invece vuoi sapere i dati previsionali scegli:
- Lighthouse;
- Chrome DevTools;
- WebPageTest;
- l’estensione Web Vitals per Chrome.
Ti consigliamo di valutare prima i dati reali perché rispecchiano la vera esperienza degli utenti, e quindi ti danno subito un’idea chiara delle eventuali modifiche da apportare al tuo sito.
I dati previsionali, invece, possono essere utili in corso di modifiche sul sito: è possibile, infatti, fare delle implementazioni e testarle subito per avere un’idea di quali risultati si possano ottenere.
Come Migliorare l’LCP subito: le cause più frequenti di rallentamenti del sito
Alcune tecniche per migliorare l’LCP infatti fanno già parte, delle buone pratiche SEO finalizzate a velocizzare il sito e ottenere una buona UX.
Vediamo quali sono queste tecniche:
- ottimizzare le immagini: per molti dei siti, tra cui gli eCommerce, le immagini costituiscono il contenuto principale di maggior parte delle pagine. Potrebbe essere utile comprimerle o convertirle in formati più efficienti.
- utilizzare il CSS critico: sarebbe indicato usarlo per i contenuti “Above the fold”, ovvero nella parte visibile della pagina, prima che l’utente faccia scrolling. In questo modo, si agevola il caricamento dell’elemento principale, ritardando, invece, quello del resto della pagina (non ancora visibile al visitatore);
- adottare tecniche di preload: si tratta di precaricare le risorse principali;
- scegliere un Server Push HTTP/2: è una soluzione utile per guadagnare tempo.
Come vedi, il processo di analisi e ottimizzazione è abbastanza approfondito e prevede una serie di importanti passaggi. Alcuni miglioramenti richiedono elevate competenze tecniche. Se hai bisogno di assistenza in questa fase, compila il nostro form per parlare con un esperto e per valutare insieme come procedere.
First Input Delay (FID) nella Google Page Experience: che cos’è?
Il First Input Delay è il ritardo della prima interazione. Le prime impressioni sono importanti quando si crea un’esperienza sul web.
La FID in altre parole misura in millisecondi, l’esperienza delle persone quando provano a interagire con pagine che non rispondono: se il valore risulta basso, è una garanzia che la pagina sia reattiva
La metrica misura il tempo che intercorre tra il momento in cui un utente interagisce per la prima volta con i contenuti di una pagina e quello che il browser impiega a rispondere a tale input: in altre parole, valuta il “ritardo” che si genera prima di ottenere risposta.
Ecco quali sono esattamente le reazioni che analizza il FID:
- un clic su un bottone, su una foto, su un testo
- un tap su un collegamento, o su un menu a tendina
- la validazione di un form.
Non sono presi, invece, in considerazione lo scorrimento e lo zoom perché si configurano come azioni continuate.
E se un utente non interagisce con il sito?
Semplicemente non produrrà valori FID.
Google ritiene buono un First Input Delay inferiore a 100 millisecondi, da migliorare quando si assesta tra 100 e 300 e pessimo se supera i 300 millisecondi. Suggerisce, inoltre, di raggiungere un buon punteggio, su dispositivi mobili e desktop, almeno nel 75% dei caricamenti di pagina.
Come ottimizzare il FID
Il FID è una metrica da valutare “sul campo” poiché richiede che un utente reale interagisca con la pagina.
Esistono degli strumenti per farlo:
- Rapporto sull’esperienza utente di Chrome;
- PageSpeed Insights (dati di laboratorio e sul campo);
- Lighthouse (per il TBT);
- Search Console (nel rapporto Core Web Vitals);
- Libreria JavaScript web-vitals.
Come Identificare le cause di problemi nel FID e quali sono le strategie di miglioramento
Le cause di cattive prestazioni nel punteggio FID sono perlopiù relative a problemi di velocità. Riuscire a migliorarli rientra nelle buone pratiche SEO.
- Ridurre il tempo di esecuzione di JavaScript: risposte lente alle interazioni sono legate a risorse JavaScript pesanti.
- Ridurre i codici di terze parti: se è vero che sono importanti perché, permettono di inserire nel nostro strumenti di analisi e strumenti stilistici, è altrettanto assodato che causino dei ritardi.
- Minimizzare il lavoro sul thread principale: ogni processo di elaborazione delle risorse si divide in due o più thread. Si rivela fondamentale alleggerire il suo carico di lavoro per migliorare il FID;
- Contenere il numero di richieste e ridurre le dimensioni di trasferimento: un numero elevato di risorse da analizzare e da restituire in display, può davvero rallentare inutilmente il caricamento.
Cos’è il Cumulative Layout Shift nella Google Page Experience?
Il Cumulative Layout Shift (CLS ovvero la variazione cumulativa del layout) misura la stabilità visiva. Rileva, infatti, tutti i movimenti (e le conseguenti modifiche) della struttura grafica di una pagina web.
Per comprendere concretamente di cosa stiamo parlando, basterà pensare a quanto sia fastidioso voler cliccare su un contenuto o un collegamento di una pagina e vedere che si sposta più volte.
Google chiarisce che non tutti i cambiamenti di layout sono da considerarsi negativi: “non sono positivi solo se l’utente non se li aspetta. Quelli che si verificano in risposta alle interazioni dell’utente (clic su un collegamento, pressione di un pulsante, digitazione in una casella di ricerca e simili) vanno generalmente bene, purché lo spostamento avvenga in modo rapido e consequenziale, rendendo chiara la relazione causa-effetto”.
Come si calcola il punteggio del Cumulative Layout Shift
Per fornire una buona esperienza utente, i siti dovrebbero cercare di avere un punteggio CLS inferiore a 0,1
Quindi, mentre per gli altri due indici appena visti (LCP e FID) l’unità di misura di riferimento è il tempo, per il CLS è lo spazio.
Quello stabilito da Google è un punteggio specifico che identifica il livello delle variazioni di layout nel corso del caricamento della pagina, che possono compromettere la user experience.
Per calcolare il punteggio del CLS, Google moltiplica due misure di quel movimento: la frazione di impatto e la frazione di distanza.
Cos’è la frazione di impatto
La frazione di impatto considera l’area della schermata del browser interessata dalle variazioni nel layout.
Faccio un esempio per capirci meglio.
Come si può vedere dall’esempio, un elemento occupa il 50% della finestra in un frame e, in quello seguente, si sposta verso il basso del 25%. La parte tratteggiata in rosso indica l’unione dell’area visibile dell’elemento nei due frame che, in questo caso, occupa il 75% dello spazio totale: la frazione di impatto è 0,75.
La frazione di distanza
La seconda misura importante per il punteggio di CLS rileva la distanza (in verticale o in orizzontale) percorsa dagli elementi instabili rispetto al riquadro di visualizzazione. Si calcola dividendo la distanza maggiore che un elemento instabile, mosso nella finestra, ha percorso per la dimensione maggiore del riquadro (larghezza o altezza).
Anche questa volta facciamo un esempio per capirci meglio.
L’esempio mostra bene che la dimensione più grande della finestra è l’altezza e l’elemento instabile si è spostato del 25%: la frazione di distanza è 0,25.
SEO: che impatto ha il Cumulative Layout Shift?
Un basso punteggio di variazione del layout aiuta a garantire che la UX sia positiva su dispositivi mobili e desktop e che gli utenti non si sentano frustrati dalla tua pagina web.
Una buona esperienza utente ci aiuta a raggiungere tutti gli obiettivi che ci poniamo nella SEO: ranking, traffico, conversioni.
Secondo uno studio di Screaming Frog che esamina il CLS, solo il 46% degli URL per dispositivi mobili e il 47% di quelli per desktop hanno ottenuto punteggi inferiori a 0,1. Il valore medio è stato di 0,29 sui primi e di 0,25 sui secondi.
Come misurare il Cumulative Layout Shift
Il CLS può essere misurato con quattro strumenti:
- Rapporto sull’esperienza utente di Chrome;
- PageSpeed Insights;
- Google Search Console (con il rapporto Core Web Vitals);
- Libreria JavaScript web-vitals.
Come ottimizzare il Cumulative Layout Shift
Le principali cause di variazione cumulativa del layout sono da ricercare nell’uso di:
- immagini o video con dimensioni impostate in modo non corretto o sconosciute;
- annunci, contenuti embedded o iframe senza dimensioni;
- contenuto iniettato dinamicamente;
- web font che nascondono il testo fino a completo download (FOIT) o usano caratteri alternativi che generano slittamenti (FOUT);
- elementi della pagina che attendono risposte di rete prima di apparire.
Risulta, quindi, essenziale mettere in pratica tecniche valide e strategie adatte a ridurre al minimo le difficoltà per l’utente, migliorandone la UX.
Quali sono le tecniche per migliorare il Cumulative Layout Shift?
Le best practice da adottare per avere un basso punteggio di CLS nel tuo sito includono dei principi guida da seguire con attenzione:
- inserire sempre attributi di dimensione nelle immagini, nei video, negli iframe e nei contenuti embedded.
- prediligere la trasformazione delle animazioni in animazioni di proprietà che attivano le modifiche al layout
- non aggiungere mai contenuto sopra quello esistente, tranne in risposta a un’interazione dell’utente.
Il CLS è una metrica tenuta in grande considerazione da Google. Garantire al tuo sito di avere un basso punteggio è fondamentale per una buona user experience e per mantenere un efficace posizionamento.
Conclusioni su Google Page Experience
Le modifiche che verranno apportate a breve da Google sono molto complesse come hai potuto comprendere da questo articolo.
Se hai bisogno di una consulenza per un’analisi gratuita dello “stato di salute” del tuo sito, dal punto di vista SEO e UX, compila il nostro form.
