Come migliorare il tuo punteggio su Google PageSpeed ​​Insights

La velocità del tuo sito web ha un impatto diretto sulla SEO e sui tassi di conversione. Lo strumento gratuito PageSpeed Insights di Google è una risorsa fantastica per trovare e risolvere i problemi che rallentano il tuo sito e ti impediscono di posizionarti in alto nelle SERP.

Scopri come utilizzare il test di velocità di Google, come funziona e qual è un buon punteggio di PageSpeed Insights. E se dal test risultasse che il tuo sito ha dei problemi, impara a risolverli rapidamente con i consigli che ti vengono dati dallo strumento.

Che cos'è la velocità della pagina?

Google definisce la velocità della pagina in due modi:

• quanto tempo ci vuole per visualizzare i contenuti above the fold;
• quanto tempo impiega un browser per eseguire il rendering completo della pagina.

Quando parliamo di velocità della pagina, alcuni elementi sono fuori dal controllo del proprietario del sito (come la connessione Internet dell'utente, il servizio di hosting web di un dominio e lo svuotamento della cache), ma ci sono molti elementi che il webmaster può ottimizzare, come le immagini, i video, JavaScript e altro.

Perché la velocità del tuo sito conta

Gli utenti si aspettano che il tuo sito web sia veloce. In caso contrario, non ci penseranno nemmeno un secondo a visitare un altro sito. Poiché la velocità della pagina è un tassello così importante per l'esperienza dell'utente, Google tiene in considerazione le prestazioni complessive di una pagina quando determina se promuoverla nelle SERP.

La velocità delle pagine è infatti uno degli oltre 200 fattori di ranking di Google, per questo devi assicurarti che il tuo sito web carichi con sufficiente rapidità. 

Backlinko ha analizzato 1 milione di risultati di ricerca di Google e ha trovato "una forte correlazione tra velocità del sito e ranking di Google".

SEO a parte, la frequenza di rimbalzo di una pagina aumenta man mano che la velocità di un sito rallenta. Uno studio del 2019 condotto dall'agenzia di marketing online Portent ha infatti mostrato che "i tassi di conversione diminuiscono in media del 4,42% con ogni secondo aggiuntivo di tempo di caricamento (tra 0-5 secondi)."

I primi 5 secondi del tempo di caricamento della pagina hanno l'effetto maggiore sui tassi di conversione.

Ottimizzare i tuoi contenuti per la velocità mostra a Google che vuoi creare un'esperienza di alta qualità per i visitatori del tuo sito. Per questo devi prestare attenzione alla velocità come metrica delle prestazioni web, se non lo stai già facendo.

Velocità della pagina: ora Google utilizza solo i Core Web Vitals

Nella storia degli algoritmi di Google per la velocità delle pagine, ci sono stati tre grandi annunci: 

• nel 2010 un update confermava la velocità della pagina come fattore di ranking (per le ricerche desktop);
• nel 2018 uno specifico aggiornamento di PageSpeed ​​affermava l'importanza della velocità di pagina per i dispositivi mobili;
• nel 2020 l'aggiornamento dell'esperienza di pagina introduceva i Core Web Vitals. 

Gli algoritmi di velocità della pagina di Google del 2010 e del 2018 sono stati sostituiti dai Core Web Vitals. John Mueller di Google ha confermato su Twitter che ora Google utilizza solo l'aggiornamento più recente per il ranking della velocità delle pagine, in particolare l'aggiornamento della page experience che misura la velocità delle pagine utilizzando i Core Web Vitals.

Velocità della pagina vs Tempo di caricamento

Ecco il primo falso mito da sfatare: lo strumento Google PageSpeed non misura il tempo di caricamento di un sito, a dispetto di quanto si pensi. Per capire il perché, parliamo innanzitutto della differenza tra velocità della pagina e tempo di caricamento della pagina.

Velocità della pagina

PageSpeed è un punteggio assegnato da Google, su 100, dal suo strumento PageSpeed Insights. PageSpeed Insights (e lo strumento per le prestazioni delle pagine web Lighthouse che lo alimenta) prende le metriche grezze delle prestazioni e le converte in un punteggio compreso tra 1 e 100.

Anche se offre rapporti sulle opportunità e sulla diagnostica come parte del suo report, questi non contribuiscono direttamente al punteggio delle prestazioni. Ciò significa che PageSpeed, da solo, non è un vero indicatore dei tempi di caricamento di un sito.

Tempo di caricamento

Che cos'è, quindi, il tempo di caricamento rispetto a PageSpeed? È il tempo medio di caricamento di una pagina per un utente. Non è un punteggio calcolato, è il tempo effettivo che una pagina impiega a caricarsi, in secondi o millisecondi, tra l'inizio e la fine del caricamento della pagina.

Ma il tempo di caricamento, da solo, non fornisce un'idea di cosa stia causando problemi di velocità o di come risolverli.

Questo cosa implica per te? Google Page Speed Insights può essere utile, ma non puoi utilizzarlo da solo per valutare il rendimento del tuo sito. È necessario utilizzare diversi indicatori per identificare e risolvere i problemi.

Che cos'è Google PageSpeed Insights?

PageSpeed Insights (PSI) è uno strumento di Google che assegna un punteggio all'esperienza di un utente su una pagina per dispositivi mobili e desktop.

È senza dubbio lo strumento di analisi della velocità della pagina più popolare in circolazione e permette di realizzare un test di velocità gratuito sulle pagine di un sito.

Tra le altre cose, PSI:

• misura il tempo di caricamento di un URL;
• calcola il punteggio delle prestazioni di velocità;
• analizza il sito web per individuare problemi e suggerire miglioramenti.

La cosa davvero interessante di PageSpeed Insights è che offre suggerimenti pratici per migliorare la velocità del sito, l'accessibilità e la SEO di una pagina.

Qual è un buon punteggio su PageSpeed Insights e quanto accurato è lo strumento? Sono ottime domande, ma prima cerchiamo di capire cos'è PageSpeed e cosa non è.

Come specificato da John Mueller, PSI non è un fattore di ranking, è solo uno strumento di "laboratorio" per aiutarti a trovare problemi su cui lavorare.

Come funziona PageSpeed Insights?

Lo strumento Google PagesSpeed Insights è alimentato da Lighthouse e fornisce per ogni pagina sia dati di laboratorio che dati sul campo.

Nel corso degli anni, PageSpeed Insights è diventato la fonte unica di dati sul campo e in laboratorio, integrando le informazioni di Chrome UX Report e della diagnostica di Lighthouse. 

I dati di laboratorio vengono raccolti in un ambiente controllato durante la scansione di una pagina e sono un ottimo modo per identificare problemi di debug e trovare soluzioni per risolverli.

I dati sul campo, invece, sono raccolti dai dati sulle prestazioni reali quando gli utenti caricano la tua pagina. Alcuni dei problemi e dei colli di bottiglia apparenti che rendono più difficile la conversione dei tuoi visitatori reali possono essere evidenziati qui. 

I dati reali di PageSpeed Insights di basano sul report CrUX, ma se una pagina non dispone di sufficienti dati (ad esempio perché è stata creata da poco), PSI si baserà sulle esperienze utente di tutte le pagine del sito (granularità). Se nemmeno in questo caso sono disponibili abbastanza dati, lo strumento non potrà mostrare dati sull'esperienza utente reale.

Come usare PageSpeed Insights

1. Vai sulla pagina di PageSpeed Insights tool: 

2. Inserisci l'URL di una pagina web. Non deve essere la home page, ma una pagina specifica. Dopo che lo strumento ha calcolato i punteggi ed elaborato i consigli, vedrai quanto segue: 

3. Nota che come impostazione predefinita ti vengono offerti i punteggi di rendimento per i dispositivi mobile. Puoi passare al desktop cliccando su Desktop sopra il report di PSI: 

PSI di Google genera un report dettagliato che include la valutazione dei Core Web Vitals, dati di laboratorio di Lighthouse, opportunità, diagnostica e l'elenco degli audit superati.

Per capire veramente come usare PageSpeed Insights, devi sapere cosa significa tutto quello che vedi e come interpretarlo.

Segnali web essenziali (dati sul campo)

I dati di Core Web Vitals di PSI provengono dal report Chrome UX e includono diverse metriche, ciascuna delle quali misura un aspetto diverso della velocità e del tempo di caricamento:

First Contentful Paint (FCP)

Questa metrica indica il momento in cui vengono visualizzati i primi contenuti di una pagina (testo o immagini).

First Input Delay (FID)

Corrisponde al tempo impiegato dal browser per rispondere alla prima interazione dell'utente.

Largest Contentful Paint (LCP)

Indica il momento in cui vengono visualizzati il testo o l'immagine di maggiori dimensioni.

Cumulative Layout Shift (CLS)

Calcola lo spostamento degli elementi visibili all'interno dell'area visibile della pagina.

Il punteggio di velocità complessivo di PSI viene calcolato in base ai risultati per ciascuna metrica dei Core Web Vitals:

Il report di PSI mostra una distribuzione delle metriche in modo che il proprietario del sito web o gli sviluppatori possano comprendere che tipo di esperienza utente rileva lo strumento su una specifica pagina o origine.

Page Speed Insights segnala anche le esperienze utente per le metriche sperimentali Interact to Next Paint (INP) e Time to First Byte (TTFB).

I dati sul campo presentati nel report provengono dai 28 giorni precedenti e sono sempre mostrati con barre di distribuzione di accompagnamento perché i dati sul campo sono dati aggregati del report CrUX e la stessa pagina Web non funziona mai allo stesso modo per tutti gli utenti.

Diagnostica e problemi di prestazione

In questa sezione del report, PSI sfrutta Lighthouse per analizzare l'URL sottoposto al test in un ambiente simulato, realizzando i controlli per le categorie Prestazioni, Accessibilità, Best practice e SEO.

In alto si possono consultare i punteggi di ogni categoria. Qual è un buon punteggio su Page Speed Insights?

• un punteggio pari o superiore a 90 è considerato buono;
• un punteggio compreso tra 50 e 89 indica che la pagina richiede miglioramenti;
• un punteggio inferiore a 50 è considerato scarso.

Il punteggio delle prestazioni è una media ponderata dei punteggi delle metriche. Naturalmente, le metriche più ponderate hanno un effetto maggiore sul punteggio complessivo delle prestazioni. I punteggi delle metriche non sono visibili nel report, ma vengono calcolati internamente.

Ogni metrica ottiene un punteggio e una specifica icona ne mostra il risultato:

• un cerchio verde indica un punteggio buono;
• un quadrato ambra indica la presenza di problemi e la necessità di apportare miglioramenti;
• un triangolo rosso indica un punteggio scarso, che avvisa di problemi da risolvere.

Qui Lighthouse misura i Core Web Vitals e tre metriche aggiuntive:

• Speed Index: indica la velocità con cui diventano visibili i contenuti di una pagina.

• Time to Interactive: è il tempo necessario affinché la pagina sia del tutto interattiva.

• Total Blocking Time: questa metrica di PSI è la somma dei tempi tra FCP e Time to Interactive (in millisecondi), quando la durata del task supera i 50 ms.

Che peso hanno queste metriche sul punteggio di PageSpeed Insights?

Le ponderazioni sono cambiate nel tempo perché il team di Lighthouse svolge regolarmente ricerche e raccoglie feedback per capire quale sia l'impatto maggiore sulle prestazioni percepite dagli utenti. Attualmente, con Lighthouse 8, il peso delle singole metriche è il seguente:

Per ottenere maggiori informazioni sulle problematiche riscontrate da Page Speed Insights, clicca su Espandi visualizzazione:

In questo modo otterrai indicazioni più precise sulle metriche utilizzate e dei consigli pratici per migliorare le prestazioni della pagina e, di conseguenza, incrementare il tuo punteggio.

Opportunità 

Nella sezione Opportunità ottieni informazioni sugli elementi su cui dovresti concentrarti per migliorare il tempo di caricamento della pagina e il punteggio PageSpeed, insieme a una stima della riduzione del tempo di caricamento che potresti vedere.

Puoi visualizzare tutti i controlli e le raccomandazioni dello strumento o concentrarti solo sulle questioni relative a FCP, TBT, LCP o CLS.

Diagnostica

La diagnostica, invece, ti mostra raccomandazioni sulle migliori pratiche che dovrebbero essere prese in considerazione anche se non migliorano necessariamente i tempi di caricamento.

Ritroviamo le icone di PageSpeed Insights che segnalano elementi da migliorare: un triangolo rosso per indicare la presenza di problemi in pagina da risolvere e un quadrato arancione per indicare che sono necessari dei miglioramenti. 

Cliccando sulla freccia a destra è possibile ottenere maggiori informazioni e suggerimenti per risolvere il problema.

Controlli superati

I controlli superati sono altre raccomandazioni con indicazioni di possibili risparmi di tempo.

Accessibilità

Con il termine accessibilità si intende che il contenuto di un sito web è disponibile e la sua funzionalità può essere utilizzata da qualunque utente. Questa parte del report di PageSpeed Insights mette in evidenza le opportunità per migliorare l'accessibilità della tua applicazione web.

Ad esempio, puoi trovare evidenziate le opportunità per ottimizzare la semantica dei comandi della tua applicazione, allo scopo di migliorare l'esperienza per gli utenti che utilizzano tecnologie per la disabilità, come uno screen reader.

Il report mostra anche i controlli superati relativi all'accessibilità:

Nota: lo strumento avverte che è possibile rilevare automaticamente soltanto un sottoinsieme di problemi di accessibilità, pertanto sono consigliati anche i test manuali.

Best practice

Il punteggio di PageSpeed Insights di questa sezione racchiude i controlli che evidenziano le opportunità per migliorare l'integrità generale del codice della tua app web.

SEO

In questa parte del report di PSI puoi visualizzare il tuo punteggio relativo all'ottimizzazione SEO. I controlli realizzati assicurano che la tua pagina sia ottimizzata per il posizionamento dei risultati sui motori di ricerca.

Lighthouse tiene in considerazione molti altri fattori che non tratta qui e che potrebbero influire sul tuo ranking di ricerca (incluse le prestazioni relative ai Core Web Vitals).

Un buon punteggio PageSpeed: perché ottenere 100/100 non è così importante

Anche se non raggiungi 100/100, puoi comunque avere un sito a caricamento rapido. Ricorda: PageSpeed, da solo, non è un indicatore diretto del tempo di caricamento.

È probabile che non raggiungerai mai il punteggio pieno, pur apportando miglioramenti determinanti che incidono positivamente sul tempo di caricamento del tuo sito. Focalizza i tuoi sforzi e risorse dove hanno più senso.

Come affermato dalla piattaforma di hosting WordPress Kinsta:

Ottenere un 100/100 in PageSpeed Insights di Google non è in realtà così importante.

È più che altro un mito quello di dover ottenere un punteggio di 100/100 affinché il tuo sito funzioni correttamente.

Ricorda che il vero indicatore delle prestazioni del tuo sito è il tempo di caricamento, non il punteggio di PageSpeed Insights. Google ci dice che un punteggio scarso è compreso tra 0 e 49, uno nella media tra 50 e 89 e un buon punteggio è superiore a 90.

Punta in alto, questo sì, ma non ossessionarti con l’idea di ottenere un punteggio uguale a 100. 

È anche importante comprendere le prestazioni dei siti con cui si compete direttamente nelle SERP. Se hai un tempo di caricamento più veloce e un punteggio PageSpeed migliore, ma ottieni ancora un punteggio, diciamo, 92/100, ci sono buone probabilità che i tuoi sforzi possano essere meglio assegnati altrove.

Come migliorare il tuo punteggio su PageSpeed Insights 

Come indicato nella documentazione di Lighthouse, in generale, solo le metriche contribuiscono al tuo punteggio di prestazioni, non i risultati delle categorie Opportunità o Diagnostica. Detto questo, il miglioramento delle opportunità e della diagnostica probabilmente migliora i valori delle metriche, quindi esiste una relazione indiretta.

Prova le azioni consigliate (o le migliori pratiche) indicate di seguito - risolvono i problemi più comuni e hanno il maggiore impatto a livello di miglioramenti.

1. Ottimizza le immagini

L'ottimizzazione delle immagini è forse uno dei motivi più comuni per cui una pagina Web ha un tempo di caricamento lento e spesso è il posto migliore per iniziare a migliorare, poiché gli aumenti sia del tempo di caricamento che di PageSpeed potrebbero essere significativi.

Soprattutto quando ci sono più persone responsabili del caricamento di contenuti o dell'aggiunta di prodotti, è difficile mantenere standard rigorosi per le immagini e i problemi possono sorgere rapidamente.

Le immagini richiedono molte risorse per il download e spesso non sono adeguatamente ottimizzate. Le aree principali in cui è possibile apportare miglioramenti ottimizzando le immagini sono:

• Le dimensioni di un'immagine.

• Dimensioni visualizzate rispetto alle dimensioni effettive dell'immagine in pixel.

• Rinvio del caricamento dell'immagine fuori schermo.

• Usare una rete di distribuzione dei contenuti (CDN).

• Usare immagini di ultima generazione.

Ottimizzazione delle dimensioni di un’immagine

Il download di un'immagine da 1 MB richiederà più tempo rispetto a un'immagine da 100 KB. Per ovviare a questo problema ed evitare di compromettere la velocità di download, lavora per comprimere le immagini senza perdere la qualità. Puoi utilizzare strumenti come TinyPNG per raggiungere questo obiettivo o dare un'occhiata a ImageMagick, raccomandato da Google.

Dimensioni delle immagini alla loro dimensione di visualizzazione

Un altro problema comune sono le immagini inutilmente più grandi di quanto debbano essere. Immagina che la tua pagina mostri un'immagine di 250 per 250 px. Se l'immagine originale è 1000 per 1000 px e usi CSS per ridurla, puoi accelerare notevolmente il tempo di caricamento. Allo stato attuale, il browser dovrebbe scaricare l'immagine originale (più grande) per visualizzarla a dimensioni inferiori.

Usa un Content Delivery Network (CDN)

Assicurati di caricare immagini con le dimensioni corrette; altrimenti, avrai di sicuro problemi di velocità. WordPress lo gestisce automaticamente creando più versioni di un'immagine quando questa viene caricata, ma se utilizzi un altro CMS, potrebbe essere necessario ridimensionare manualmente le immagini.

L'utilizzo di una rete CDN essenzialmente consente di distribuire il carico del server su più posizioni diverse, utilizzando quella più vicino all'utente per servire le risorse. Più i dati sono vicini, più veloce è il tempo di caricamento. Suona bene, vero? Leggi di più su come migliorare le performance di un sito con Google PageSpeed Module e CDN.

Rimandare le immagini fuori schermo

Potresti anche guardare al rinvio delle immagini fuori schermo, il che significa che le immagini vengono scaricate solo mentre l'utente scrolla. Si rischia che non tutte le immagini siano visibili quando richiesto, tuttavia è spesso un compromesso che vale la pena fare per migliorare i tempi di caricamento. Puoi farlo con diversi plugin di WordPress o seguire i consigli di Google sulle immagini fuori schermo.

Usa i formati immagine di nuova generazione

Infine, considera l'utilizzo di formati di immagine di ultima generazione come WebP. È stato dimostrato che le immagini WebP possono comportare una riduzione dell'85,87% delle dimensioni medie dell'immagine rispetto a JPG e una riduzione del 42,8% rispetto a PNG.

Non sono supportati da tutti i principali browser, ma alcune applicazioni possono gestire WebP.

2. Migliorare i tempi di risposta del server

La realtà è che migliorare i tempi di risposta del server non è qualcosa che la maggior parte ha la capacità di fare, dato che le due aree di impatto reali stanno riducendo il caricamento o migliorando l'hardware. 

I tempi di risposta del server si riducono davvero se il tuo sito è ospitato su un ottimo server. L'editore TechRepublic ha un foglio riassuntivo per scegliere il miglior host web.

Se vedi consigli relativi al tempo di risposta del server o al TTFB (tempo al primo byte), scrivi al tuo provider di hosting o considera le soluzioni di hosting più adatte al tuo sito.

Minificazione

Durante la scrittura del codice molti sviluppatori usano gli spazi per facilitare la lettura. La minificazione rimuove spazi bianchi e commenti per ottimizzare i file CSS e JS e può essere eseguita utilizzando un semplice strumento copia-incolla come Minify.

Memorizzazione nella cache del browser

Se hai WordPress come CMS (come circa il 35% del Web), non potrebbe essere più semplice utilizzare la memorizzazione nella cache del browser con i popolari plug-in gratuiti W3 Total Cache e WP Super Cache.

La memorizzazione nella cache funziona creando e offrendo rapidamente una versione statica del tuo sito agli utenti, al contrario di una pagina generata dinamicamente ogni volta che si accede.

Se non usi WordPress, puoi comunque impostare manualmente la memorizzazione nella cache del browser.

Cancella i reindirizzamenti

Nel tempo, i reindirizzamenti multipli possono rallentare la velocità di caricamento della pagina poiché i browser sono costretti a fare richieste HTTP aggiuntive, aumentando il tempo di caricamento. PageSpeed Insights evidenzierà questi problemi.

Usa Site Audit di Semrush in alternativa a PageSpeed Insights

Site Audit di Semrush è un modo fantastico per testare la velocità del tuo sito Web.

Come PageSpeed Insights, questo tool può consigliarti come migliorare la velocità di caricamento di un sito e risolvere altri problemi di rendimento.

Inoltre, eseguirà la scansione per oltre 140 errori tecnici e SEO, fornendo grafici, istruzioni e indicazioni su tutto, dalla crawlability ai problemi di contenuto.

Avrai un rapporto tematico completo con una panoramica dei problemi del tuo sito e delle opportunità da cogliere per migliorare le performance.

Il rapporto sulle performance ti aiuta ad apportare miglioramenti concreti alle prestazioni e al tempo di caricamento del tuo sito. È un modo rapido per vedere il quadro generale e ottenere un'analisi visiva dei dati e delle metriche, che includono:

• Velocità di caricamento della pagina.

• Velocità di caricamento media della pagina.

• Quantità di file JavaScript e CSS.

• Dimensioni di file JavaScript e CSS.

Inoltre, il rapporto evidenzia errori, avvertimenti e avvisi, indicati per priorità per aiutarti a risolvere prima i problemi più importanti. Troverai informazioni su cosa fare per vedere i miglioramenti nella sezione "Perché e come correggere" nei problemi contrassegnati, tra cui:

• Dimensioni pagina HTML grandi.

• Loop e catene di reindirizzamento.

• Velocità di caricamento pagina lenta.

• Pagine non compresse.

• File Javascript e CSS non compressi.

• File Javascript e CSS privi di specifica cache.

• Dimensione file CSS e JavaScript troppo alta.

• Troppi file JavaScript e CSS.

• File JavaScript e CSS non minimizzati.

• Tempo interattivo medio del documento lento.

Perché non lo provi?

Oltre a PageSpeed Insights di Google, il nostro Site Audit tool può aiutarti a stabilire le priorità e le azioni per portare avanti miglioramenti, ridurre i tempi di caricamento del tuo sito e avere la possibilità di convertire meglio i tuoi visitatori.

Quando inizierai a migliorare la velocità del tuo sito?

Non puoi ignorare l'importanza di avere un sito che carica rapidamente. Ora spero che avrai le idee un po’ più chiare anche su cos’è che lo strumento PageSpeed di Google, cosa non è e come funziona, nonché su come affrontare il miglioramento della velocità di un sito.

Se vuoi saperne di più leggi la Guida tecnica per ottimizzare le prestazioni di un sito web.

Spesso non si sa da dove cominciare, ma se ti prendi il tempo per capire dove puoi avere il maggiore impatto, puoi iniziare a lavorare con i tuoi sviluppatori per mettere in atto un piano d'azione prioritario e cambiare le cose. Che si tratti del punteggio di PageSpeed Insights o di quello di Site Audit, ricorda che la cosa più importante è l'esperienza dell'utente sul tuo sito.

Agire per migliorare il tuo punteggio non influisce solo sulle prestazioni SEO del tuo sito, ma ti aiuta anche a guadagnare la fiducia degli utenti e trasformarli in clienti.