Un sito lento perde clienti: come si misura la velocità e come si rimedia

La velocità di un sito si misura con PageSpeed Insights, lo strumento gratuito di Google. I tre numeri che contano: il tempo del primo contenuto grande, il ritardo alla prima interazione, lo spostamento degli elementi durante il caricamento. Sotto 2,5 secondi, 200 millisecondi e 0,1 il sito è a posto.

Il voto da 0 a 100 non è la velocità

La prima cosa da sapere su PageSpeed Insights è che il numero grande e colorato in cima non è il tempo di caricamento del sito. È un punteggio composto, calcolato su una simulazione: Google carica la pagina su un telefono di fascia media con una connessione rallentata di proposito, misura sei cose e le pesa insieme.

Per questo due misurazioni fatte a dieci minuti di distanza danno numeri diversi, a sito identico. Non è un difetto dello strumento: è una prova di laboratorio, e nelle prove di laboratorio c'è rumore. Un punteggio che passa da 62 a 68 non significa niente. Uno che passa da 35 a 80 significa qualcosa.

Nella stessa pagina del referto, più in alto, c'è però una seconda sezione, e quella conta molto di più: i dati dei visitatori veri. Sono le misurazioni raccolte dal browser Chrome sulle persone che hanno davvero aperto il tuo sito negli ultimi ventotto giorni, con i loro telefoni e le loro connessioni. Compaiono solo se il sito ha abbastanza traffico. Quando ci sono, si guardano quelli e si ignora il punteggio: la frase «il sito è lento» o «il sito va bene» la decidono i visitatori, non la simulazione.

È anche la differenza che spiega una discussione ricorrente fra chi gestisce un sito e chi lo ha fatto: il primo mostra un punteggio rosso, il secondo risponde che a lui il sito si apre subito. Hanno ragione entrambi, perché stanno guardando due misure diverse.

Da fare oggi: apri pagespeed.web.dev, incolla l'indirizzo della pagina più visitata del tuo sito — non la home, se le visite arrivano altrove — e guarda solo la sezione in cima, quella dei visitatori veri. Se c'è, fai una fotografia dello schermo e salvala con la data nel nome del file: è il tuo punto di partenza, e senza un punto di partenza qualunque intervento «ha funzionato». Se la sezione non c'è, il sito ha troppe poche visite perché Google abbia raccolto dati: in quel caso si usa il punteggio simulato, sapendo che oscilla, e si confrontano misurazioni fatte alla stessa ora del giorno.

I tre numeri che contano

Google ha scelto tre misure e le ha rese pubbliche. Hanno nomi tecnici in inglese, ma descrivono tre cose che chiunque ha provato su un sito. La metafora di un negozio le rende immediate.

Il terzo è quello che i proprietari dei siti sottovalutano sempre e che irrita più di tutti chi legge: si tocca un pulsante, in quel momento carica la pubblicità o il banner dei cookie, tutto scende di tre centimetri e il dito atterra su un'altra cosa. Non è un problema di secondi: è un problema di fiducia, e si misura.

Il secondo numero, il ritardo alla prima interazione, dipende quasi sempre da una sola causa: troppi programmi che girano nella pagina nello stesso momento. Mentre il browser li esegue non può rispondere al dito, e la pagina sembra bloccata anche se è già tutta visibile.

Quale dei tre sistemare per primo si decide in trenta secondi: quello che è fuori soglia con la percentuale di visite peggiore. Nei referti che leggiamo è quasi sempre il primo — il tempo del contenuto più grande — e la causa è quasi sempre un'immagine troppo pesante nella prima schermata. Il terzo, lo spostamento degli elementi, è il più economico da sistemare: si risolve dicendo al browser quanto spazio occuperanno immagini e banner prima che arrivino, ed è mezz'ora di lavoro di chi ha accesso al codice.

Perché il telefono conta più del computer

PageSpeed Insights dà due referti, uno per il telefono e uno per il computer, e quasi sempre il secondo è molto più bello. È una consolazione inutile: sui siti aziendali che seguiamo la maggior parte delle visite arriva da telefono, spesso con la connessione dei dati e non con il wi-fi.

C'è un secondo motivo, meno noto. Google valuta i siti usando la versione per telefono delle pagine: è quella che legge e quella su cui decide le posizioni. Il referto da computer, per il posizionamento, non viene nemmeno considerato.

La prova onesta la fa chiunque, in un minuto: prendi il tuo telefono, spegni il wi-fi, apri il sito. Quello che vedi è ciò che vede un cliente. Il proprietario di un sito lo prova sempre dall'ufficio, con la fibra e con la pagina già in memoria, e per questo gli sembra veloce.

Come si legge il referto senza essere tecnici

Il referto è lungo e in gran parte illeggibile per chi non scrive codice. Tre righe bastano.

• La sezione in cima, quella dei visitatori veri. Se c'è, è l'unica che descrive la realtà. Tre barre: verde, giallo, rosso, con la percentuale di visite in ciascuna fascia. Se il verde è sopra il 75% su tutti e tre i numeri, il sito è a posto e si può passare ad altro.
• La voce «Riduci i tempi di risposta del server», se compare con un numero alto. Vuol dire che il problema è dove il sito è ospitato, non come è fatto: è il caso in cui cambiare hosting risolve più di qualsiasi altro intervento.
• L'elenco «Evita risorse che bloccano la visualizzazione» e il peso totale della pagina. Se la pagina pesa più di tre megabyte, il problema sono le immagini, e le immagini sono l'intervento più facile di tutti.

Tutto il resto del referto — le righe sulla cache, sui file da accorpare, sul codice non usato — è lavoro per chi mette le mani nel sito. Non serve capirlo: serve passarlo a chi lo esegue, in ordine di effetto. Una cosa però va saputa: il referto elenca i problemi in ordine di secondi risparmiati in teoria, non in ordine di convenienza. Le prime due voci costano a volte giornate di lavoro, e la quinta mezz'ora.

Da fare oggi, prima di chiamare qualcuno: prendi il referto e copia tre informazioni in una mail. Il tempo di risposta del server, il peso totale della pagina e le prime tre voci dell'elenco dei suggerimenti. Con quelle tre righe un tecnico ti dice in dieci minuti se il problema è l'hosting, le immagini o il tema, e le tre risposte portano a tre interventi di costo molto diverso. Chi chiede «il sito è lento, quanto costa sistemarlo?» senza quelle tre righe riceve un preventivo gonfiato per prudenza, e ha ragione chi lo gonfia.

I sei interventi che spostano l'ago

In ordine di convenienza vera: quanto costano a chi li paga, rispetto a quanto spostano i numeri.

Le durate indicate sono il nostro ordine di grandezza su un sito aziendale di medie dimensioni, non un listino: su un catalogo con migliaia di pagine lo stesso intervento richiede di più. I canoni, invece, sono le cifre che indichiamo noi per l'hosting dei siti che gestiamo.

I primi quattro si fanno su qualunque sito e in genere bastano. Il quinto si valuta leggendo il tempo di risposta del server nel referto. Il sesto si affronta solo quando il sito va rifatto anche per altri motivi: in quel caso la velocità si progetta dall'inizio, ed è il modo meno costoso di ottenerla. È il lavoro che descriviamo nella pagina del restyling del sito, dove la parte più delicata non è la grafica nuova ma non perdere le posizioni già guadagnate.

Gli interventi dal primo al quarto vanno anche mantenuti nel tempo, e questa è la parte che tutti dimenticano. Un sito veloce alla consegna, nei casi che riprendiamo in mano dopo un anno o due, è tornato lento: si aggiungono immagini caricate dal pannello senza ridimensionarle, si installa un componente in più, si aggiunge un pixel per una campagna e non lo si toglie più. È esattamente il contenuto della manutenzione del sito: aggiornamenti, backup e un controllo periodico dei numeri, prima che li noti un cliente.

Sulle immagini conviene essere precisi, perché è l'intervento che chiunque può controllare. La regola è: un'immagine va caricata larga al massimo il doppio dello spazio in cui si vede. Una foto che sul sito è larga 800 pixel va caricata a 1.600, non a 4.000, e va salvata in un formato moderno come WebP, che a parità di qualità pesa meno di un JPEG. Le immagini che stanno sotto la prima schermata vanno caricate solo quando la persona scorre: è una singola istruzione nel codice e su una pagina con venti foto cambia tutto.

Chi aggiorna il sito dal pannello va istruito su questo, e con una frase: prima di caricare una foto, controlla che non superi i 300 kilobyte. È l'unica regola che serve, ed evita quasi tutti i peggioramenti che vediamo tornare sei mesi dopo la consegna.

Il caso degli script di misurazione: perché li carichiamo dopo

Su un sito aziendale di solito girano quattro o cinque programmi che servono a misurare e non a far funzionare niente: il contenitore dei tag, le statistiche, il pixel di una campagna, il banner del consenso. Nessuno di loro mostra qualcosa a chi legge, e tutti consumano il tempo del browser nel momento peggiore, cioè mentre la pagina si sta aprendo.

Sul nostro sito li carichiamo dopo che la pagina è pronta, non durante. Ci siamo arrivati provando il contrario: avviando il contenitore dei tag appena il browser ha letto la struttura della pagina, il tempo in cui il sito non risponde al dito è peggiorato in modo evidente. Spostandolo a caricamento completato, la misurazione resta corretta e il numero torna a posto.

Due regole che da questo derivano. La prima: il banner del consenso è l'unico che deve caricare presto, perché gli altri dipendono dalla risposta che dà il visitatore. La seconda: ogni strumento di misurazione va giustificato da qualcuno che guarda davvero quei dati. Un pixel installato per una campagna finita due anni fa sta ancora rallentando il sito oggi.

WordPress lento: le quattro cause che troviamo quasi sempre

WordPress non è lento. Sono lenti i siti costruiti su WordPress aggiungendo componenti senza mai togliere niente. Quando ne apriamo uno che non va, la causa è una di queste quattro.

• Il tema universale. Un tema comprato che promette di fare qualunque cosa carica il codice di tutte le cose che potrebbe fare, anche quelle che non usi. A questo si aggiunge spesso un costruttore visuale di pagine, che produce dieci riquadri annidati per mostrare tre colonne.
• Trenta o quaranta componenti installati. Ognuno carica i propri file su tutte le pagine, anche dove non serve: il modulo di contatto carica i suoi file anche sul blog, la galleria anche nella pagina contatti. Il conto si fa aprendo l'elenco e chiedendosi, per ognuno, chi lo usa.
• Le immagini caricate come arrivano dal fotografo. Una foto da 4 megabyte messa in una pagina dove si vede larga ottocento pixel. Lo fa chiunque aggiorni il sito dal pannello senza che nessuno gli abbia spiegato come si ridimensiona un'immagine: è un problema di formazione, non di tecnologia.
• L'hosting condiviso al minimo prezzo e una versione vecchia di PHP. I piani più economici mettono molti siti sulla stessa macchina: quanti, lo sa il fornitore, e vale la pena chiederglielo per iscritto. E PHP, il linguaggio con cui WordPress è scritto, nelle versioni recenti è molto più rapido: aggiornarlo è gratis e spesso nessuno lo ha mai fatto.

La verifica richiede mezz'ora: si guarda il tema, si conta i componenti, si pesa la pagina più visitata, si controlla la versione di PHP nel pannello dell'hosting. Nella pagina dei siti WordPress spieghiamo perché partiamo da un tema costruito su misura invece che da uno comprato: non è una preferenza estetica, è questo elenco.

Da fare oggi, su WordPress: apri l'elenco dei componenti installati e segna accanto a ognuno il nome della persona che lo usa. Quelli senza nome si disattivano, uno per volta e non tutti insieme, controllando il sito dopo ciascuno. Poi entra nel pannello dell'hosting e guarda la versione di PHP: se comincia con 7, chiedi l'aggiornamento a una versione 8, dopo aver fatto una copia di sicurezza. Sono due operazioni gratuite che su un sito trascurato spostano i numeri più di qualunque intervento a pagamento.

Quanto vale, in soldi, un secondo in meno

Il conto si può fare sul proprio sito, con i propri numeri, e viene sempre più alto di quanto si pensi.

Facciamo un esempio con numeri di comodo, da rifare con i tuoi. Prendi un sito con 2.000 visite al mese, di cui l'80% da telefono. Se la pagina principale si apre in cinque secondi, una parte di quelle persone esce prima di vedere qualcosa: quanti siano esattamente lo dice il tuo Analytics, confrontando il tasso di abbandono delle visite da telefono con quelle da computer. Se la differenza è di dieci punti, su 1.600 visite da telefono sono 160 persone al mese che il sito perde prima di aver detto una parola.

Adesso applica il tuo tasso di conversione. Se il sito trasforma in richiesta il 2% delle visite, quelle 160 persone erano tre richieste al mese, trentasei all'anno. Il valore di un cliente lo conosci: moltiplica per quello e per la percentuale di richieste che chiudi. Sul conto che viene fuori, mezza giornata di lavoro sulle immagini si paga in genere al primo mese.

È il motivo per cui la velocità non è una questione tecnica. È il primo intervento che conviene a un sito che riceve visite e non produce richieste, perché agisce su tutte le pagine insieme e si paga una volta.

Chiedi al tuo fornitore due misurazioni: una prima dell'intervento e una dopo, con la data visibile. Se dice che non si può misurare, il problema non è il sito.

Come si verifica che un lavoro sulla velocità è stato fatto

Se preferisci un elenco già in ordine, ti mandiamo il referto del tuo sito con i sei interventi ordinati per convenienza, dicendo per ognuno quanto costa e quanto sposta i numeri. [Dati di confronto prima/dopo di un nostro progetto: da chiedere al cliente l'autorizzazione a pubblicare le due schermate con le date.]

Scopri di più