I Web Vitals. La nuova iniziativa di Google per valutare la User Experience di un sito web.

I Web Vitals sono nuove metriche introdotte nell’algoritmo di valutazione di Google che spostano l’attenzione non più sui contenuti di un sito, bensì sull’esperienza di navigazione dell’utente. Non conterà più solo la qualità del risultato che Google può offrire ma l’accessibilità e la credibilità del sito che lo ospita. 

Tre nuovi fattori costringeranno noi programmatori a fare ancora più attenzione all’user experience. I Web Vitals riscriveranno letteralmente la serp di Google, modificando le gerarchie dei risultati (ad esclusione degli annunci a pagamento) e migliorando lo score di quei siti che mettono l’utente e la sua esperienza al centro delle loro scelte. 

I fattori principali, definiti Core Web Vitals, con cui si potranno valutare le pagine web sono LCP (Largest Contentful Paint), FID (First Input Delay) e CLS (Cumlative Layout Shift); vediamoli nel dettaglio cercando di evitare tecnicismi.

Il Largest Contentful Paint è il tempo di rendering dell’elemento più pesante all’interno della finestra di visualizzazione.

La pesantezza di immagini e video all’interno di una pagina web è sempre stata una delle cause principali delle cattive performance di un sito; con questo nuovo parametro non viene valutato il tempo complessivo di caricamento di una pagina (che continua comunque a rivestire un ruolo importante nella valutazione), ma solo il tempo che impiega a caricarsi l’elemento più pesante (molto probabilmente un’immagine o un video) tra quelli immediatamente visibili sullo schermo.

Il tempo di caricamento ideale è al di sotto dei 2.5 secondi.

Il First Input Delay è un parametro che non si calcola immediatamente al caricamento di una pagina, ma dal momento in cui l’utente compie la prima azione sul sito (ad esempio il click su un pulsante o l’attivazione di uno script); dall’input dell’utente viene poi calcolato il tempo di elaborazione del server.

Se prendiamo ad esempio un menù a tendina che si espande al click dell’utente, il FID è il tempo che intercorre tra il click dell’utente sulla voce del menù e il completamento dell’apertura del sottomenù.

Il FID scoraggia quindi l’esecuzione di script eccessivamente pesanti, favorendo una navigazione fluida ed immediata.

Per valutarlo positivamente, il First Input Delay deve mantenersi al di sotto dei 100 millisecondi.

Il Cumlative Layout Shift infine valuta la stabilità di una pagina web.

Se un elemento della pagina è molto pesante, o si carica in maniera asincrona, o si aggiunge dinamicamente tramite uno script in seguito al corretto caricamento della pagina, capita che la pagina possa “muoversi” o subire variazioni durante la navigazione a causa dell’introduzione dell’elemento in questione.

Questo fa sì che l’esperienza dell’utente ne risenta: immaginiamo di voler cliccare sul pulsante “annulla ordine” di un e-commerce, ma a causa del caricamento asincrono di un elemento il pulsante si sposta qualche centimetro più in basso nel momento in cui facciamo click, e finiamo per selezionare “conferma ordine”.

Il CLS si calcola quindi in base al numero di modifiche inattese che accadono in seguito al corretto caricamento della pagina, e idealmente dovrebbe essere pari a 0, ma viene fornita – generosamente – da Google una tolleranza di 0,1.

Se vuoi verificare che il tuo sito sia in linea con i nuovi parametri di Google, Chrome mette a disposizione un’estensione apposita a questo link

Una volta installata clicca sull’icona in alto a destra nel browser (il quadrato colorato rosso o verde) e otterrai un punteggio per ognuno dei tre parametri rispetto alla pagina attualmente visualizzata.

Altri articoli che potrebbero interessarti:

“Sito Web per il tuo ristorante: ecco come progettarlo“: leggi qui

Ciao sono Marco, mi definiscono un programmatore ed io mi fido.
Mi piace isolarmi ed immergermi nella scrittura del codice, cimentandomi in sfide sempre nuove… il tutto con un bel pezzo di pizza in mano.

Datemi del cibo ed un computer e non avrò bisogno d’altro.