Velocità del Sito

Perché la velocità è un fattore SEO

La velocità di caricamento conta per il posizionamento da molto tempo: Google l'ha confermata come fattore nel 2010 per il desktop e nel 2018 per il mobile con lo «Speed Update». Con l'arrivo dei Core Web Vitals nel 2021 la faccenda è diventata più precisa, perché adesso si misura l'esperienza reale delle persone e non un punteggio di laboratorio.

Le ricerche di Google parlano di più della metà delle persone che lascia una pagina se da telefono ci vuole più di tre secondi, e di conversioni che scendono a ogni secondo in più. Il punto che uso in aula per farlo capire è un altro: la velocità è l'unico intervento che migliora contemporaneamente SEO, conversioni e reputazione, e non chiede di riscrivere niente.

• Esperienza utente: un sito veloce riduce il bounce rate e aumenta il tempo di permanenza
• Crawl budget: pagine più veloci consentono a Googlebot di scansionare più URL nello stesso tempo
• Ranking diretto: la velocità è un segnale di ranking, specialmente sui dispositivi mobili

"La velocità del sito è la prima impressione che l'utente ha del tuo brand. Un sito lento comunica trascuratezza, un sito veloce comunica professionalità."

PageSpeed Insights e strumenti di analisi

Google PageSpeed Insights (PSI) è lo strumento di riferimento per analizzare la velocità di un sito. Combina dati di laboratorio (simulati con Lighthouse) e dati di campo (raccolti dal Chrome User Experience Report) per fornire un quadro completo delle performance.

PageSpeed Insights dà un punteggio da 0 a 100 per mobile e desktop, in tre fasce:

È importante distinguere tra dati di laboratorio e dati di campo. I dati di laboratorio sono simulazioni eseguite in un ambiente controllato e servono per il debug durante lo sviluppo. I dati di campo (field data) provengono invece dagli utenti reali e sono quelli che Google considera ai fini del ranking: per questo conviene ottimizzare guardando soprattutto i dati di campo dei dispositivi più diffusi tra i tuoi visitatori.

Altri strumenti utili per l'analisi delle performance includono GTmetrix, WebPageTest, Lighthouse (integrato in Chrome DevTools) e il report Core Web Vitals di Google Search Console. L'ideale è utilizzare più strumenti in combinazione per avere una visione completa.

Nella pratica, il consiglio è di non inseguire ossessivamente il punteggio 100: un punteggio elevato è utile, ma l'obiettivo concreto è far rientrare le metriche dei Core Web Vitals entro le soglie "buone" misurate sugli utenti reali. Stabilisci una baseline, applica un intervento alla volta e rimisura: così capisci quale ottimizzazione ha prodotto il miglioramento e puoi replicarla sul resto del sito.

Compressione e ottimizzazione immagini

Le immagini pesano in media più della metà di una pagina, quindi è da lì che si comincia: è il singolo intervento con il rapporto migliore fra fatica e secondi guadagnati.

Cosa si fa alle immagini:

• Formati moderni: utilizza WebP o AVIF al posto di JPEG e PNG. WebP offre una compressione superiore del 25-35% a parità di qualità visiva
• Compressione: strumenti come TinyPNG, Squoosh o ImageOptim riducono il peso senza perdita percepibile di qualità
• Dimensioni responsive: usa l'attributo srcset per servire immagini di dimensioni appropriate al dispositivo dell'utente
• Dimensioni esplicite: specifica sempre width e height nel tag <img> per evitare layout shift (CLS)

Minificazione e caching

La minificazione consiste nella rimozione di spazi, commenti e caratteri non necessari dai file CSS, JavaScript e HTML. Riduce il peso dei file del 10-30% senza alterarne il funzionamento.

La cache lavora su livelli diversi, e vanno sistemati tutti:

• Browser caching: tramite gli header HTTP Cache-Control e Expires, indica al browser di memorizzare localmente le risorse statiche (CSS, JS, immagini, font) evitando di riscaricarle a ogni visita
• Server-side caching: memorizza le pagine HTML generate dal server, evitando di rieseguire query al database e processi di rendering a ogni richiesta
• Object caching: strumenti come Redis o Memcached memorizzano in RAM i risultati delle query al database più frequenti

Una corretta configurazione del caching può ridurre i tempi di caricamento del 50-80% per gli utenti di ritorno. Per la configurazione degli header di caching, lavora a stretto contatto con le direttive del file .htaccess o della configurazione server.

CDN e lazy loading

Un CDN (Content Delivery Network) è una rete di server distribuiti geograficamente che servono i contenuti statici del sito dal server più vicino all'utente. Questo riduce la latenza e migliora significativamente i tempi di caricamento per utenti distanti dal server di origine.

Cosa ti dà una CDN:

• Riduzione della latenza grazie alla prossimità geografica
• Distribuzione del carico tra più server
• Protezione da attacchi DDoS
• Compressione automatica (Brotli/Gzip)

Il lazy loading rimanda il caricamento di quello che non si vede ancora (immagini, iframe, video) fino a quando la persona ci arriva scorrendo. Oggi basta l'attributo loading="lazy", supportato da tutti i browser: è la cosa più semplice della lista e quasi nessuno la mette.

Sia la CDN sia il lazy loading lavorano sul Largest Contentful Paint, una delle tre misure dei Core Web Vitals. Su un sito con molte foto o su un negozio online sono le due cose che si notano subito, anche a occhio.

Hosting e tempo di risposta del server (TTFB)

Prima ancora che il browser inizi a scaricare CSS, JavaScript e immagini, deve attendere la risposta del server: questo intervallo si chiama Time To First Byte (TTFB). Un TTFB elevato penalizza tutte le metriche a valle, perché ogni millisecondo di attesa iniziale si somma ai tempi di rendering. Un valore di riferimento sano è inferiore a 600 ms, idealmente sotto i 200 ms.

Le leve principali per ridurre il TTFB sono concrete e spesso sottovalutate: scegliere un hosting di qualità con risorse adeguate al traffico (evitando piani condivisi sovraffollati), attivare il caching server-side per non rigenerare l'HTML a ogni richiesta, adottare un'infrastruttura geograficamente vicina al pubblico e mantenere aggiornati linguaggio server e database. Per chi lavora con WordPress o e-commerce, passare da un hosting economico a uno ottimizzato per le performance è spesso l'intervento che, a parità di sforzo, produce il miglioramento più visibile. Questo aspetto è strettamente connesso alla SEO tecnica e va verificato periodicamente insieme agli altri controlli infrastrutturali.

Risorse render blocking

Le risorse «render blocking» sono i file CSS e JavaScript che tengono la pagina bianca finché non hanno finito di scaricarsi. Sono la causa della sensazione di lentezza anche quando i numeri non sono male: la pagina c'è già, e nessuno la vede.

Come si gestiscono:

1. Critical CSS inline: inserisci il CSS necessario per il rendering above-the-fold direttamente nel tag <style> dell'HTML, caricando il CSS rimanente in modo asincrono
2. Defer e async per JavaScript: l'attributo defer posticipa l'esecuzione dello script dopo il parsing HTML; async scarica lo script in parallelo e lo esegue appena disponibile
3. Rimozione del CSS inutilizzato: strumenti come PurgeCSS identificano le regole CSS non utilizzate nella pagina, riducendo drasticamente il peso del foglio di stile
4. Code splitting: suddividi il JavaScript in bundle più piccoli, caricando solo il codice necessario per la pagina corrente
5. Preload e preconnect: usa <link rel="preload"> per risorse critiche e <link rel="preconnect"> per stabilire connessioni anticipate verso domini esterni (font, CDN, API)

La velocità si perde da sola: basta un plugin nuovo, un aggiornamento del tema, uno script di terze parti aggiunto per una campagna. Per questo il controllo va messo nella routine di SEO tecnica e guardato in Search Console, che riporta i dati veri degli utenti, soprattutto da mobile. Misura prima di intervenire e dopo: senza il prima non sai se hai migliorato.