SEO

Come ottimizzare i Core Web Vitals del tuo sito web

Alessandro Aru Lug 27 2022

Cosa sono i Core Web Vitals? Come ottimizzare i Core Web Vitals di un sito?

Se non hai mai sentito parlare di Core Web Vitals e sei incuriosito da questi parametri, ti trovi nel posto giusto. Nella nostra guida SEO, ti spiegheremo nel dettaglio cosa sono i Core Web Vitals e quali sono le tecniche per ottimizzarli.

Ma partiamo dal principio.

Di Core Web Vitals si parla molto già dal 2020, quando Google ha annunciato che dall’anno successivo queste metriche sarebbero diventate importanti ai fini della ricerca, soprattutto per la parte mobile.

Fino ad ora, tuttavia, solo gli esperti del settore hanno avuto modo di approfondire e lavorare su parametri come velocità, interattività o stabilità visiva.

Chi ha un sito internet, però non può affatto ignorare metriche dalle funzioni fondamentali: se da un lato, infatti, i Core Vitals permettono di valutare l’esperienza dell’utente, dall’altro gli esperti sono concordi nel ritenerli fattori di ranking indispensabili ai fini del posizionamento sui motori di ricerca.

Partiamo con il nostro approfondimento sui Core Web Vitals.

Cosa sono i Core Web Vitals (Segnali web essenziali)

Già da tempo l’esperienza utente è diventata una dei fattori di ranking di maggior impatto agli occhi di Google. Il motore di ricerca, infatti, vuole offrire alle persone un’esperienza online di valore, senza interruzioni, ritardi o fastidi di nessun tipo.

Per poter monitorare la user experience, Google ha individuato dei fattori che influiscono sull’esperienza di navigazione dell’utente:

  • caricamento;
  • interattività;
  • stabilità visiva.

Ad essi sono state associate delle metriche che permettono di misurare sul campo le prestazioni e l’efficienza del sito:

  • Largest Contentful Paint (LCP);
  • First Input Delay (FID);
  • Cumulative Layout Shift (CLS).

Il Largest contentful paint è il parametro che misura la velocità di caricamento della pagina. In particolare, si riferisce alla visibilità dell’elemento più pesante all’interno della pagina, che può essere costituito da un’immagine o da un video.

La qualità dell’esperienza utente viene considerata ottimale quando il caricamento avviene entro 2,5 secondi.

Il First Input Delay serve per valutare le modalità di interazione della pagina, ovvero in quanto tempo il sito riesce a rispondere alle richieste degli utenti. Secondo Google, il tempo di interazione (FID) non dovrebbe superare i 100 millisecondi.

Lo spostamento del layout è un aspetto spesso sottovalutato ma che influisce pesantemente sull’esperienza utente, lasciandolo a cliccare nel vuoto o facendolo interagire con pulsanti a cui non era assolutamente interessato. Il Cumulative Layout Shift è la metrica che misura la stabilità visiva e non dovrebbe superare lo 0,1 in nessun caso.

Core Web Vitals per Mobile e per Desktop

Sebbene i Core Vitals siano fondamentali sia per chi si connette dai dispositivi mobili che da desktop, non è detto che essi siano buoni in entrambi i casi. Google, infatti, ha iniziato a valutare i segnali web essenziali su tutti i browser (mobile e desktop) nel 2022 ma i risultati sono molto diversi.

Tra i dispositivi mobili, al momento, ci sono una moltitudine di siti dalle performance scadenti, ossia che non rispettano i limiti indicati per i tre Core vitals.

Il parametro sul quale è possibile riscontrare una certa uniformità è il Largest Contentful Paint mentre, per quanto riguarda CLS e FID, l’esperienza su mobile risulta più scadente rispetto al desktop.

Ma quali sono i motivi di questa difformità?

Ottimizzare i Core Web Vitals è certamente più difficile sui dispositivi mobili ma i parametri scadenti possono dipendere da vari fattori.

Il tempo di caricamento può essere rallentato da un tempo di risposta del server lento, da rendering bloccato da CSS e JavaScript, dal rendering lato client, da tempistiche lunghe per il caricamento dei file.

L’interattività viene inficiata da pagine non ottimizzate, lunghe attese dovute all’esecuzione dei file JavaScript, JavaScript troppo pesanti, Script di terze parti.

La stabilità della pagina, invece, dipende da annunci che non hanno un layout fisso e dimensioni stabilite, comparsa del cookie banner, presenza di contenuti dinamici, utilizzo di font personalizzati, che possono provocare la comparsa di caratteri vuoti (fenomeno detto FOIT) oppure aumentare troppo la velocità di caricamento del contenuto (FOUT).

Queste problematiche sono decisive per l’esperienza utente sia da mobile che da desktop.

Ma come si possono controllare i dati sui Core Web Vitals?

Dove si trovano i dati sui Core Web Vitals

Per capire come ottimizzare i Core Web Vitals si deve puntare all’utilizzo di strumenti di analisi specifici ed estensioni, che eseguano test e rilascino report dettagliati da prendere come riferimento.

Uno tra i più funzionali è il Search Console di Google, che permette di valutare l’esperienza utente attraverso i Core Web Vitals che abbiamo descritto (LCP, FID, CLS), inserendo gli URL del sito. Quello che ne viene fuori è un Report esperienza sulle pagine molto dettagliato che, inizialmente, era riservato solo all’analisi dei siti mobili ma ora può essere utilizzato anche per i siti da desktop.

Gli strumenti di Google non si limitano solo a Search Console, ma includono anche altri tool, come:

  • Chrome DevTools.
  • Chrome UX Report.
  • Lighthouse.
  • PageSpeed Insights.

Nella nostra agenzia SEO utilizziamo anche altri tool professionali, come Screaming Frog, che offrono lo stesso tipo di funzionalità ma richiedono maggiori competenze.

Come si controllano i Core Web Vitals di un sito web

Come avrai capito, ci sono moltissimi tool per misurare le performance di un sito ma è fondamentale saper leggere i dati al meglio e utilizzarli per ottimizzare il sito.

Screaming Frog, ad esempio, è un tool a pagamento che necessita di una chiave API da PageSpeed Insights per poter eseguire l’analisi.

Per eseguire la scansione bisogna conoscere il nome del dominio e configurare la chiave API nella sezione Configurazione del tool.

Dopodiché vanno scelti i parametri da analizzare in un gruppo proposto proprio dal tool, che comprende panoramica, metriche CrUX, metriche Lighthouse, opportunità e diagnostica. È possibile anche ottenere risultati su tutte le metriche disponibili.

L’accesso alle statistiche avviene inserendo il dominio del sito web, e dal menù è possibile controllare i valori di ogni pagina.

Durante la lettura dei risultati, annotiamo su un foglio excel tutti gli errori da correggere che sono collegati ai Core Web Vitals.

La fase di controllo va portata avanti con molta attenzione e non è possibile trascurare nessun piccolo sbaglio per poter risolvere i problemi relativi ad ogni pagina del sito web.

Una volta finita la correzione degli errori emersi, ripetiamo la scansione per ottenere un risultato di qualità.

Ma come si ottimizzano i Core Web Vitals?

Come si ottimizzano i Core Web Vitals di un sito

Ricordi quando ti abbiamo parlato dei fattori che incidono sull’esperienza utente?

Un server che risponde lentamente, il rendering bloccato, la presenza del layout fisso, il cookie banner, i caratteri personalizzati sono alcuni dei motivi per cui un sito ha performance scarse.

Per fornire un’esperienza utente di qualità è necessario individuare le problematiche e lavorare in modo certosino su ognuna di esse.

Vediamo come si correggono gli sbagli e come ottimizzare i Core Web Vitals del sito.

Ridurre il tempo di risposta del server

Come migliorare il tempo di risposta del server? Come velocizzare il caricamento delle pagine?

Queste sono tra le domande che ci vengono poste più spesso durante una consulenza SEO perché è proprio dalla velocità di caricamento che dipende la permanenza sul sito.

Forse non sai che i primi 5 secondi sul sito incidono più degli altri sul tasso di conversione. I tassi di conversione migliori sono quelli ottenuti dalle pagine che hanno una velocità di caricamento tra lo 0 e i 2 secondi. Mentre, per ogni secondo aggiuntivo, le opportunità diminuiscono del 4,42%.

Per migliorare i tempi di risposta del server, però, non esiste una risposta univoca, perché sono molteplici i fattori che vanno ad incidere sulle tempistiche.

Noi di Nextre Digital per prima cosa eseguiamo un upgrade del server, per poi eliminare le risorse contenute nella cache che non sono più necessarie.

Inoltre, ci muoviamo sui codici di terze parti, stabilendo una gerarchia delle connessioni. In ultimo, inviamo i visitatori verso una rete CDN, che permette di erogare i contenuti attraverso una rete per alleggerire il sito e velocizzare il caricamento delle pagine.

Eliminare i CSS e JS che bloccano il rendering delle pagine

I CSS e i file JavaScript possono influenzare negativamente la SEO del sito poiché riescono a bloccare il rendering delle pagine, rallentando il caricamento del sito. Per questo motivo è sempre meglio intervenire su entrambi i tipi di file e correggerli.

Per quanto riguarda i CSS, i nostri esperti SEO preferiscono usare query multimediali dinamiche, che riescono a creare stili adatti ad ogni tipo di finestra, e minimizzare il CSS attraverso un plugin apposito.

Dopodiché lavoriamo su CSS critico e CSS non critico, favorendo l’acquisizione del primo nella stringa <head> ed eliminando gli stili inutilizzati.

E i file JS come si correggono?

Per minimizzare i file Javascript dobbiamo intervenire sul codice, dove si cancellano le parti non necessarie. In questa fase si possono togliere definitivamente anche i codici scaricabili polyfill inutilizzati, che servono per le interfacce non implementate.

Correggere gli script di terze parti che bloccano il rendering

Gli script di terze parti possono avere un ruolo determinante nel blocco del rendering e nelle performance del sito stesso.

Con gli script di terze parti si può agire in due modi:

  • In primis, è necessario aggiornare la versione per evitare blocchi e tenere sotto controllo le prestazioni del sito.
  • Inoltre, bisogna valutare l’importanza dello script. Qualora non sia strettamente necessario è molto meglio eliminarlo. In alternativa, si deve accettare che ci siano prestazioni di qualità inferiore.

Migliorare il Rendering lato client

Per ottimizzare i Core Web Vitals, bisogna sempre tener conto degli ultimi aggiornamenti effettuati sul sito poiché potrebbero dar vita a problemi di rendering dal lato client.

Il campanello d’allarme relativo a questa problematica è costituito da un calo nel traffico del sito dopo un update.

Come si fa ad ottimizzare il rendering lato client?

In questo caso bisogna soffermarsi sull’origine della pagina web e confrontarla con l’HTML disponibile, che può contenere elementi in grado di influenzare il rendering lato client.

Per ottimizzare la pagina lato client, noi operiamo sul rendering lato server tramite il quale si eseguono i file JavaScript. Inoltre suddividiamo il codice, riducendo il JavaScript critico e utilizziamo la funzionalità di pre-rendering, che prepara il sito al prossimo click dell’utente, portando un miglioramento nei risultati sui motori di ricerca.

Ottimizzare i file sulla pagina

Tra le problematiche che riscontriamo più di frequente c’è la presenza di file non ottimizzati, che rallentano il caricamento della pagina.

Sebbene sia un procedimento semplice e basilare, ottimizzare i file nelle pagine migliora nettamente la velocità di caricamento e, di conseguenza, il punteggio dei Core Web Vitals.

L’ottimizzazione delle immagini e dei testi è uno dei punti cardine della SEO, che implica la compressione dei file e la loro codifica.

Considerando il customer journey, si comunica al browser di pre-caricare le risorse, in modo che il sito possa anticipare le operazioni da effettuare e rispondere immediatamente alle richieste degli utenti.

Un aspetto da controllare sempre sono le risorse contenute all’interno della cache, che possono essere selezionate come memorizzabili o meno.

Un ultimo step per migliorare la user experience è l’ottimizzazione del sito a seconda della connessione di cui dispone l’utente.

Migliorare l’interattività

Il First Input Delay (FID) è la metrica dei Core Web Vitals che descrive l’interattività del sito. Come abbiamo anticipato, misura quanto tempo passa tra l’input dell’utente e la risposta offerta dal browser.

Al di sotto dei 100 millisecondi, il FID è ottimale, mentre, viene considerato scarso, quando oltrepassa questa soglia.

Come si fa ad ottimizzare il FID?

Per migliorare il FID il primo step è comprendere quali siano le cause di un punteggio scarso.

La pagina non è ottimizzata? Allora è necessario ottimizzare la pagine, prestando particolare attenzione alla parte visibile, ovvero quella superiore.

Se i file o i pacchetti JavaScript sono troppo pesanti, vanno scomposti, creando blocchi più piccoli e leggeri.

Infine, si monitora il valore degli script di terze parti, che possono compromettere le performance del sito.

Ottimizzare i Core Web Vitals e migliorare la stabilità visiva del sito web

Ti è capitato di notare uno spostamento delle immagini durante il caricamento del sito?

Si tratta di un fenomeno che accade spesso quando si visualizza il cookie banner o nelle aree riservate agli annunci. Ed è molto fastidioso per gli utenti che si ritrovano a cliccare su aree a cui non erano affatto interessati.

Il Cumulative Layout Shift (CLS) è un Core Web Vitals decisivo perché misura la stabilità visiva del sito.

Per ottimizzare il CLS, in agenzia ci preoccupiamo di riservare delle aree specifiche agli annunci, in modo che non debbano essere compressi e non risultino privi di dimensioni.

Il discorso dimensioni incide anche sulle immagini, che vanno inserite specificando l’altezza (height) e la larghezza (width).

Gli aggiornamenti e i contenuti nuovi non devono sovrapporsi a quelli già esistenti per non creare l’effetto slittamento delle immagini.

Per non provocare disagio all’utente nella fruizione dei contenuti, i caratteri personalizzati vanno precaricati, in modo che non si creino spazi vuoti o che il sito scorra a velocità eccessiva.

Affidati a Nextre Digital per ottimizzare i Core Web Vitals del tuo sito

I Core Web Vitals costituiscono delle metriche indispensabili per misurare la velocità di caricamento, l’interattività e la stabilità visiva di un sito. Elementi indispensabili per trattenere gli utenti sul sito e migliorare la loro esperienza di navigazione.

Da qualche tempo, inoltre, dal comportamento di Google si evince che essi si configurano anche come fattori di ranking.

Insomma, l’analisi di queste metriche è indispensabile per valutare le performance di un sito web e capire su quali fronti bisogna intervenire in caso di uno scarso punteggio. Tuttavia, questo richiede competenze specifiche, una perfetta padronanza degli strumenti a disposizione e la capacità di saper leggere i dati.

Nextre Digital è una web agency specializzata nella SEO, con un team altamente profilato nell’ottimizzazione dei Core Web Vitals di ogni tipo di sito web. Da oltre 15 anni ci occupiamo della SEO, curando ogni aspetto in grado di influire sul posizionamento nei motori di ricerca.

Se vuoi assicurare un’esperienza di qualità ai tuoi visitatori, con un sito veloce, interattivo e stabile sul piano visivo, chiedi un supporto ai nostri professionisti.

Compila il form che trovi in questa pagina e valuteremo insieme come ottimizzare i Core Web Vitals del tuo sito e assicurarti performance ottimali.

Richiedi informazioni

Il nostro blog