Il tuo sito impiega più di 3 secondi a caricarsi? Stai perdendo più della metà dei tuoi visitatori potenziali prima che vedano qualcosa. La velocità di un sito web non è una questione tecnica astratta — è direttamente collegata al traffico che ricevi da Google, al tasso di conversione dei visitatori, e alla percezione di professionalità del tuo brand. Questa guida ti mostra come misurare, diagnosticare e risolvere i problemi di performance nel modo più efficiente.
Come misurare la velocità del sito: gli strumenti giusti
Prima di ottimizzare qualcosa, devi misurarlo. Esistono diversi strumenti per analizzare la velocità di un sito — ognuno con prospettive diverse. Usarli insieme dà un quadro completo.
PageSpeed Insights: il punto di partenza
PageSpeed Insights è lo strumento gratuito di Google che analizza le performance di qualsiasi URL e fornisce un punteggio da 0 a 100 separato per mobile e desktop, insieme a indicazioni specifiche su cosa ottimizzare. La sezione "Opportunità" mostra i miglioramenti con il maggior impatto stimato. La sezione "Diagnostica" dettaglia i problemi tecnici. I dati "Field Data" (quando disponibili) mostrano le performance reali misurate dagli utenti Chrome — più affidabili dei test di laboratorio per capire l'esperienza reale.
Core Web Vitals: le metriche che contano per Google
Google misura la user experience tramite tre metriche chiamate Core Web Vitals: LCP (Largest Contentful Paint) — tempo di caricamento dell'elemento principale della pagina, dovrebbe essere sotto i 2,5 secondi; CLS (Cumulative Layout Shift) — misura quanto gli elementi si spostano durante il caricamento, dovrebbe essere sotto 0,1; INP (Interaction to Next Paint) — reattività agli input dell'utente, dovrebbe essere sotto 200ms. Questi tre valori sono fattori di ranking diretto su Google dal 2021.
GTmetrix e WebPageTest per analisi più profonde
GTmetrix offre waterfall chart dettagliate che mostrano l'ordine e la durata del caricamento di ogni risorsa — utile per identificare risorse bloccanti specifiche. WebPageTest permette di testare da server locati in diverse parti del mondo e con connessioni diverse (3G, 4G, fibra), dando una visione più realistica dell'esperienza degli utenti con connessioni diverse dalla tua.
Ottimizzazione immagini: il guadagno più veloce
Nella maggior parte dei siti web, le immagini non ottimizzate sono responsabili del 50-80% del peso totale della pagina. Ottimizzare le immagini è quasi sempre l'intervento con il miglior rapporto effort/impatto.
Formato WebP: perché e come passarci
Il formato WebP produce immagini di qualità paragonabile a JPEG e PNG ma con dimensioni del file ridotte del 25-35%. È supportato da tutti i browser moderni (Chrome, Firefox, Safari, Edge). Per convertire le immagini esistenti: Squoosh (online, gratuito), ImageOptim (Mac, gratuito), o plugin WordPress come ShortPixel o Imagify che convertono automaticamente durante l'upload. Sui CMS moderni, il tag HTML
Dimensioni corrette: non caricare immagini più grandi del necessario
Un errore frequente è caricare immagini da 3000×2000 pixel per mostrarle in uno slot da 800×500px. Il browser scarica l'immagine intera e poi la ridimensiona via CSS — spreco puro. Le immagini devono essere ridimensionate alle dimensioni massime in cui vengono mostrate, moltiplicato per 2 (per gli schermi retina). Una hero image che occupa tutta la larghezza dello schermo su desktop può andare a 1440×810px — non 4000×2666px.
Lazy loading: caricare solo quello che serve
Il lazy loading ritarda il caricamento delle immagini che sono al di fuori del viewport iniziale dell'utente. Si implementa aggiungendo loading="lazy" al tag
Cache: servire i file più velocemente
La cache è un meccanismo che salva copie di risorse già scaricate per non doverle riscaricare ad ogni visita. Implementata correttamente, riduce drasticamente i tempi di caricamento per i visitatori di ritorno e alleggerisce il carico sul server.
Browser cache: HTTP headers
Il browser cache si configura tramite HTTP headers che dicono al browser per quanto tempo conservare una copia locale di ogni tipo di file. File statici come immagini, font e CSS cambiano raramente — possono avere un TTL (Time To Live) di 30-365 giorni. File HTML cambiano più spesso — un TTL di pochi minuti o nessuna cache è più appropriato. Su server Apache, si configura nel file .htaccess; su Nginx, nella configurazione del server.
Plugin di cache per WordPress
Per WordPress, i plugin di cache più efficaci sono: WP Rocket (a pagamento, ~50€/anno, il più completo), W3 Total Cache (gratuito, potente ma complesso da configurare), LiteSpeed Cache (gratuito, ottimo se il hosting usa LiteSpeed come web server). Un plugin di cache ben configurato può ridurre i tempi di caricamento del 40-60% senza toccare una riga di codice.
CDN: avvicinare i file ai tuoi utenti
Un CDN (Content Delivery Network) distribuisce copie dei file statici del sito su server localizzati in tutto il mondo. Quando un utente visita il sito, riceve i file dal server CDN geograficamente più vicino a lui — riducendo la latenza. Cloudflare offre un CDN gratuito che si attiva modificando i nameserver del dominio e migliora le performance anche senza toccare il codice del sito. Per siti con traffico significativo o audience internazionale, un CDN non è opzionale.
CSS e JavaScript: ridurre il blocco del rendering
CSS e JavaScript non ottimizzati possono bloccare il rendering della pagina — l'utente vede una pagina bianca o parziale mentre il browser aspetta di scaricare e processare questi file. Questo è uno dei problemi più comuni che abbassano il punteggio LCP.
Minificazione e concatenazione
La minificazione rimuove spazi, commenti e ritorni a capo dai file CSS e JavaScript senza cambiarne il comportamento, riducendo le dimensioni del 20-40%. La concatenazione unisce più file in uno solo, riducendo il numero di richieste HTTP. Entrambe le tecniche sono automatizzate da plugin WordPress (WP Rocket, Autoptimize) o da tool di build come Webpack, Vite, o Gulp.
Caricamento asincrono e defer del JavaScript
Per default, quando il browser incontra un tag
