Il sito è lento: come capirlo in dieci minuti e cosa chiedere a chi ve l'ha fatto
Sei fuori dall'ufficio, prendi il telefono, ti colleghi al tuo sito per trovare un'informazione veloce e capisci che ci mette un attimo di troppo a caricarsi. Oppure durante una riunione o l'incontro con un cliente ti vene detto "en passant" e non sai se abbia torto o meno.
Con questo articolo ti voglio togliere ogni dubbio e darti qualche consiglio da fornire a chi ti ha sviluppato il sito. Sul perché la velocità conti l'ho scritto nell'articolo sui Core Web Vitals: qui si passa direttamente a cosa fare.
Misuriamo, non indoviniamo
Vai su PageSpeed Insights, incolla l'url di una pagina e guarda i risultati. Tre indicazioni per non leggerlo male:
- Prova la pagina giusta. Non la home: la pagina su cui arrivano davvero le persone che parla del tuo servizio o prodotto, oppure, ancora meglio, quella di destinazione delle tue campagne ADS
- Guarda prima i dati sul campo, poi il punteggio. In alto compaiono i dati raccolti da utenti veri negli ultimi ventotto giorni. Sono quelli che contano. Il punteggio colorato più in basso è una simulazione di laboratorio: utile per capire cosa correggere, non per dire come va il sito. Se i dati sul campo non ci sono, significa che il traffico è troppo basso perché Google li raccolga, e allora la velocità non è il tuo primo problema.
- Controlla mobile e desktop separatamente. Sono due mondi. Quasi sempre è il mobile a essere messo peggio, ed è da lì che arrivano i visitatori.
Le tre sigle, senza gergo
- LCP: il tempo che impiega la prima parte della pagina a comparire, di solito immagine o titolo principale. È la risposta alla domanda "quando si vede qualcosa di utile?". Va bene sotto i 2,5 secondi.
- INP: il tempo che impiega la pagina quando tocchi o clicchi qualcosa. È la sensazione di "lentezza" anche quando la pagina è già caricata. Va bene sotto i 200 millisecondi.
- CLS: quanto la pagina si sposta sotto gli occhi mentre carica. È quello che ti fa cliccare il pulsante sbagliato perché nel frattempo tutto è sceso di due centimetri. Va bene sotto 0,1.
Perché proprio queste soglie: non sono simboliche, derivano dalla misura di quando le persone iniziano a percepire un ritardo e ad abbandonare. Sotto quei valori l'attesa non viene notata, sopra sì.
Le cause dei valori non ottimali che trovo spesso
- Le immagini. Sono molto spesso la causa principale. Foto caricate in altissima risoluzione, servite uguali per tutti i dispositivi, in formati vecchi e senza dimensioni dichiarate (motivo per il cui la pagina "salta"). Su molti siti aziendali si dimezza il peso di una pagina agendo solo qui.
- Il CSS che blocca la visualizzazione. Il browser non mostra nulla finché non ha scaricato i fogli di stile. Se sono tanti, grossi, o caricati da un altro server, la pagina resta bianca anche quando il contenuto è già arrivato.
- Gli script di terze parti. Analytics, pixel pubblicitari, chat, banner dei cookie, mappe, widget di recensioni, caroselli. Presi uno a uno sembrano innocui. Sommati sono spesso più pesanti del sito. È anche la voce su cui puoi decidere tu: puoi valutare di rimandarli, precaricarli o addirittura eliminarli se non servono più.
- L'hosting non adatto. Un piano condiviso da pochi euro al mese può reggere un piccolo lato memoria o processore, ma quando il server ci mette mezzo secondo solo a iniziare a rispondere, nessuna ottimizzazione lo recupera. Si vede nel dettaglio dei risultati, alla voce sul tempo di risposta del server.
- I caratteri tipografici. Font presi da un servizio esterno, in troppi pesi, senza indicare al browser cosa mostrare nel frattempo. Il testo resta invisibile per qualche decimo di secondo, oppure cambia aspetto sotto gli occhi di chi legge.
Cosa puoi fare da solo già oggi?
- Fai l'inventario degli script. Chiedi l'elenco di tutto ciò che è installato sul sito e per ognuno la domanda: chi guarda questi dati, e quando li ha guardati l'ultima volta? Quello che non serve si toglie.
- Ricomprimi le immagini oppure chiedi un servizio automatico di compressione. Se sei tu ad aggiornare il sito, è l'abitudine che fa più differenza a costo zero.
- Guarda quanti popup hai. Newsletter, sconti, cookie, chat: ognuno è peso, e messi insieme sono anche un problema di usabilità.
- Prova il sito dal telefono, in 4G, fuori casa. Non dalla rete dell'ufficio o di un posto dove ti trovi spesso. È lì che vive il tuo visitatore.
Cosa chiedere a uno sviluppatore per ottimizzare?
Conversione delle immagini in formati moderni con ridimensionamenti automatici basati sul dispositivo, caricamento differito, estrazione del CSS essenziale, revisione dei font magari inserendli self-hosted, cache lato server e, quando serve, cambio di hosting. Sono interventi di ore, non di settimane, se il sito ha fondamenta sane. Se non le ha, la risposta onesta è che ottimizzarlo costa più che rifarlo e a volte è la soluzione migliore.
Le domande da fare al tuo fornitore
Copiabili così come sono:
- Quali sono oggi LCP, INP e CLS delle nostre tre pagine più visitate, sul mobile?
- Quali di questi valori sono fuori soglia, e qual è la causa principale di ciascuno?
- Le immagini vengono ridimensionate e convertite automaticamente quando le carichiamo, o va fatto a mano?
- Quali script di terze parti sono attivi e chi li ha richiesti?
- Quanto ci mette il server a rispondere, e il piano di hosting attuale è adeguato?
- Quali interventi proponete, in che ordine di priorità, e con quale stima di ore?
Una risposta puntuale a queste sei domande vale più di qualunque punteggio. Se invece la risposta è "il sito è veloce, guarda che il punteggio è verde", chiedi di vedere i dati.
Se vuoi che guardi io
Faccio analisi delle prestazioni: misuro le pagine che contano, elenco le cause in ordine di impatto e stimo le ore per ciascuna. Il documento che ricevi è pensato per poter essere girato a chi gestisce il sito, anche se non sono io.
Articoli correlati.
European Accessibility Act: cosa devono fare davvero gli e-commerce italiani
Chi è obbligato, da quando, cosa chiede davvero la norma e come verificare in dieci minuti come è messo il tuo e-commerce. Senza allarmismi.
Craft CMS: perché lo uso al posto di WordPress per i siti aziendali
Cinque criteri per scegliere tra Craft CMS e WordPress, i costi di licenza reali e i casi in cui WordPress resta la scelta giusta.
Shopify ora invia le pagine in due tempi: il tuo tema è pronto?
Shopify manda la prima parte della pagina prima delle sezioni. Ne approfittano solo i temi scritti in un certo modo: ecco come controllare il tuo.