La velocità di un sito web è diventata un elemento fondamentale per il successo di qualsiasi progetto digitale o di un’azienda con un business online. Sia si tratti di un sito corporate, di un blog, un eCommerce o di un sito vetrina.
I tempi di caricamento influenzano direttamente l’esperienza utente, il posizionamento sui motori di ricerca e le conversioni che derivano da una maggiore visibilità, notorietà e autorevolezza nel proprio settore.
I visitatori di oggi, abituati a una navigazione sempre più rapida e fluida, sono poco pazienti nei confronti di siti lenti e possono abbandonare una pagina se il tempo di caricamento è troppo lungo.
Pertanto, ottimizzare la velocità del tuo sito è importante per assicurarti che le persone rimangano e interagiscano con i tuoi contenuti. Anche perché Google valuta gli abbandoni (Frequenza di rimbalzo o bounce rate), come un’esperienza negativa, e ne tiene conto nel classificare i siti nelle varie SERP (Search Engine Results Page).
Ecco perché conviene fare un controllo delle performance del sito web e, nel caso, implementare alcune tecniche di ottimizzazione, come la compressione delle immagini, la riduzione del codice superfluo, l’implementazione della cache del browser e l’ottimizzazione del codice sorgente. Queste pratiche possono contribuire ulteriormente a migliorare la velocità di caricamento e l’esperienza complessiva degli utenti sul tuo sito.
Con l’utilizzo dei suggerimenti e delle indicazioni di alcuni strumenti di test della velocità, è possibile identificare i punti critici per adottare misure correttive e migliorare i risultati complessivi.
In questo articolo potrai scoprire come ottimizzare la velocità di un sito, sia su desktop sia su dispositivo mobile, cosa lo rallenta, come controllare le performance per migliorare l’esperienza degli utenti, il posizionamento sui motori di ricerca e i risultati di conversione.
Test di velocità del sito web: strumenti consigliati
Un modo per valutare le prestazioni del tuo sito web è sottoporlo a dei test di velocità. Uno strumento consigliato per questo scopo è PageSpeed Insights di Google. Per saperne di più leggi l’articolo che abbiamo scritto su come interpretare i dati dati di PageSpeed.
Questo strumento analizza il tuo sito e fornisce una valutazione delle sue prestazioni, identificando potenziali problemi e suggerendo soluzioni per migliorare la velocità di caricamento.
Da specificare, a onor del vero, che i risultati del test non sono sempre il massimo dell’attendibilità, nel senso che come sempre bisogna valutare ogni aspetto alla luce della consapevolezza. Il tool esprime il suo punteggio (0-100) sulla base di analisi non sempre corrispondenti al vero.
Dunque, è bene fare test con altri software di analisi.
Oltre a Pagespeed Insights esistono altri tool che consentono di testare la velocità del sito, tra questi, GTmetrix, Pingdom Tools e WebPageTest.
Alcuni permettono di scegliere il paese da dove eseguire il test, e questo contribuisce ad avere dati più veritieri.
Tutti valutano fattori che Google ritiene fondamentali, come il tempo di caricamento, la dimensione delle risorse, l’ottimizzazione del codice HTML, i segnali essenziali.
Errori comuni e soluzioni per velocizzare il sito web
Elimina i Redirect superflui per ridurre i reindirizzamenti
I reindirizzamenti possono influire negativamente sulla velocità di caricamento del sito. Si implementano per evitare che i visitatori possano atterrare su una pagina 404, inesistenti, ma è pur vero che un eccesso di reindirizzamenti rallenta i tempi di caricamento e la velocità del sito.
La soluzione è quella di ridurre al minimo il numero di redirect e assicurarsi che siano necessari e ben configurati.
Verifica la presenza di reindirizzamenti non necessari e sostituiscili con collegamenti diretti alla pagina di destinazione. Inoltre, considera l’utilizzo di reindirizzamenti 301 invece dei 302, poiché i primi sono permanenti e possono essere memorizzati nella cache del browser, riducendo così i tempi di caricamento.
Abilita e sfrutta la cache del browser per migliorare la velocità del tuo sito
Utilizza l’header HTTP “Cache-Control” per specificare come le risorse del tuo sito web dovrebbero essere memorizzate nella cache del browser degli utenti.
La cache del browser è la memoria che in ogni browser archivia i file che non cambiano, che rimangono statici sul sito web, tra questi il logo, le immagini dei prodotti, i file CSS, ecc.).
Facendo memorizzare i file sul computer o dispositivo dell’utente, migliorerai la velocità di caricamento del tuo sito, in quanto i file non dovranno essere scaricati ogni volta, a ogni nuova visita.
Utilizza un plugin di cache per migliorare le prestazioni di un sito WordPress
Se stai utilizzando WordPress come piattaforma per il tuo sito web, puoi sfruttare i plugin di caching per migliorare la velocità del tuo sito.
Alcuni plugin, come WP Super Cache, W3 Total Cache e WP Rocket, consentono di memorizzare in cache le risorse generate, riducendo il tempo necessario per generare dinamicamente il contenuto ad ogni richiesta. Ciò significa che i visitatori riceveranno i contenuti in modo più rapido.
Scegli un buon hosting
Scegliere un piano di hosting adatto è un altro fattore importante per migliorare la velocità di caricamento del tuo sito web.
Un host a basso prezzo può darti l’idea della convenienza, ma alla lunga ti accorgerai che i problemi, a fronte di un risparmio iniziale, sono tanti. E ne va del tuo sito. Perché seppure ottimizzi tutto, un server lento penalizza comunque la velocità.
Seleziona un provider affidabile, che offra prestazioni elevate e risorse adeguate per gestire il carico di traffico intenso. Ecco come trasferire il tuo dominio su un nuovo hosting.
Utilizza un Content Delivery Network (CDN)
Se il tuo sito divulga contenuti che raggiungono diverse regioni del mondo, quindi se i tuoi servizi e prodotti viaggiano anche all’estero, e le tue pagine sono fruibili da utenti di altre nazioni, considera un CDN.
In pratica, quando il server riceve una richiesta, viene utilizzato quello più vicino all’utente a beneficio della riduzione dei tempi di latenza e della velocità di caricamento.
Un Content Delivery Network è una rete distribuita in tutto il mondo che memorizza una copia delle risorse del tuo sito web, come immagini, script e file CSS.
Ottimizzazione delle risorse del sito
Riduci il peso delle immagini e comprimerle
Per il loro peso, le immagini possono rappresentare un causa di rallentamento di una pagina. Dunque, è importante ottimizzarle per ridurre le dimensioni del file, senza compromettere la qualità visiva.
A questo proposito, utilizza formati di immagine più attuali e adatti per il web, come JPEG o WebP, SVG, e comprimi le immagini utilizzando software come Photoshop, Gimp o TinyPNG (sia per PNG che per JPG), una piattaforma online.
Rimanda le risorse che bloccano la visualizzazione
Le risorse di blocco della visualizzazione, come JavaScript e CSS, possono ritardare il caricamento delle pagine. È consigliabile rimandare il caricamento di queste risorse non critiche o utilizzare tecniche come l’inlining dei CSS per ridurre i tempi iniziali di rendering e consentire una visualizzazione più rapida del contenuto principale della pagina.
Scegli un tema leggero e ottimizzato
La scelta di un template leggero e ottimizzato può contribuire notevolmente all’ottimizzazione della velocità del sito.
Evita temi pesanti e complessi che richiedono molte risorse per caricarsi. Opta, invece, per temi ottimizzati, con codice pulito e leggero, che consentano una rapida visualizzazione del contenuto.
Tra i temi gratuiti ottimizzati per WordPress, puoi considerare
- Astra
- GeneratePress
- OceanWP
- Schema
- Neve
Tutti e cinque hanno versioni gratuite disponibili sul repository ufficiale di WordPress. Tuttavia, alcuni di essi offrono anche versioni a pagamento con funzionalità aggiuntive e supporto avanzato.
Tra i Page Builder, invece, i più quotati a oggi sono:
- Avada
- Beaver Builder
- Elementor
- Divi Builder
- Thrive Architect
- WPBakery Page Builder (ex Visual Composer).
Riduci il tempo di esecuzione di JavaScript e CSS
Il tempo di esecuzione di JavaScript e CSS può incidere sulla velocità del sito. Una soluzione è quella di combinare i file JavaScript e CSS e ridurre minimo il codice non utilizzato.
Altra buona prassi è quella di posizionare i file JavaScript nella parte inferiore del documento HTML e i file CSS nella parte superiore, per garantire un caricamento progressivo e ottimizzare le prestazioni.
Minificare CSS, JavaScript e HTML
La minificazione consiste nel rimuovere spazi vuoti, commenti e caratteri non necessari dai file CSS, JavaScript e HTML. Tutto questo codice sorgente, inutile, viene letto dagli spider di Google, uno spreco di tempo.
Per ottimizzare la velocità, puoi ridurre la dimensione dei file HTML, CSS e JavaScript eliminando spazi vuoti, commenti e codice non utilizzato. Questo processo riduce le dimensioni dei file, consentendo un caricamento più rapido delle pagine. Puoi utilizzare strumenti online o plugin appositi per ridurre le dimensioni dei file senza alterarne il funzionamento in modo automatico e semplificato, come UglifyJS per JavaScript o CSSNano per CSS.
Implementazione della compressione GZIP
La compressione GZIP riduce la dimensione dei file inviati al browser dell’utente. Comprimendo i file HTML, CSS e JavaScript tramite GZIP, è possibile ridurre notevolmente i tempi di caricamento delle pagine senza perdita di qualità. Verifica con il tuo hosting la configurazione della compressione GZIP.
Tutte queste soluzioni sono la risposta ad alcune metriche che Google ha introdotto nel tempo per valutare le performance di un sito web. Vediamole.
Migliora i Core Web Vitals (Segnali Essenziali)
I Segnali essenziali rappresentano un insieme di metriche definite da Google per valutare l’esperienza e l’interazione delle pagine web nella loro globalità, e non solo per quanto riguarda la velocità del sito. Queste metriche sono diventate un altro fattore chiave per posizionarsi sul motore di ricerca.
Leggi la guida ai Core Web Vitals per entrare nel dettaglio di ciascuna metrica e di come è possibile risolvere eventuali criticità correlate.
Content Layout Shift (CLS)
Il Content Layout Shift (CLS) è una metrica che misura la stabilità visiva di una pagina web durante il caricamento. Indica quanto contenuto visibile cambia di posizione nel rendering della pagina, quindi della frequenza di spostamenti imprevisti dei contenuti della pagina.
Tra gli elementi che incidono maggiormente, il caricamento dei web font, come quelli di Google, degli iFrame (es: video di YouTube) e delle immagini
Un valore inferiore a 0,1 è considerato buono. Un alto valore di CLS può causare un’esperienza frustrante per gli utenti, specialmente se i clic o le azioni vengono eseguite accidentalmente a causa dei movimenti inaspettati del contenuto.
Per ridurre il CLS, è consigliabile specificare le dimensioni dei contenuti, evitare l’inserimento di annunci o elementi che si caricano in modo asincrono e gestire in modo adeguato il layout della pagina durante il caricamento.
Largest Content Paint (LCP)
Il Largest Content Paint (LCP) rappresenta il tempo necessario affinché si carichi il contenuto più grande visibile nella parte superiore, in genere, della pagina. Questo elemento può essere un’immagine, un blocco di testo o un video.
Un valore basso di LCP indica che il contenuto principale viene visualizzato rapidamente all’utente.
Per migliorare questo parametro, è possibile ottimizzare le immagini, dei testi e dei video, ridurre il tempo di risposta del server, utilizzare un hosting performante e ridurre il peso dei file CSS e JavaScript.
First Input Delay (FID)
Il FID misura il tempo di risposta interattivo del sito web, ossia il tempo che intercorre tra l’interazione dell’utente con l’interfaccia e la risposta del browser (es: click, scrolling, digitare in un campo di input) che lascia visualizzare il primo contenuto sullo schermo.
Un FID ideale è inferiore a 100 millisecondi, poiché questo tempo di ritardo risulta generalmente impercettibile per l’utente.
Per risolvere l’eventuale problema legato a questa metrica, si dovrà intervenire riducendo il tempo di esecuzione dei Javascript, il rendering della pagina web, l’influenza del codice di terze parti.
In sintesi:
- minimizzare il codice
- rimuovere o ridurre il codice non utilizzato
- ottimizzare la cache.
INP (Interaction to Next Paint)
Questa metrica misura la velocità di risposta di una pagina web ad un input dell’utente (clic del mouse, touch). si riferisce al tempo di risposta di una pagina dopo l’input dell’utente. Ma diventerà effettiva solo nel marzo 2024.
TTFB: Time to First Byte
Il Time to First Byte non fa parte del pacchetto dei Segnali Essenziali ma comunque è un altro indicatore importante per valutare le prestazioni e la velocità di un sito web, perché un TTFB più breve rappresenta un tempo di risposta più rapido del server alle richieste dell’utente.
Infatti, il TTFB misura il tempo impiegato dal server per iniziare a rispondere alla richiesta del browser. In sostanza, è il tempo che intercorre tra il momento in cui l’utente richiede l’apertura di una pagina e il momento in cui il browser inizia a ricevere i dati.
Il TTFB dipende da diversi fattori, tra cui la latenza di rete, il carico del server, la velocità del server e l’efficienza del codice del sito web.
Per ridurre il TTFB, è possibile adottare diverse misure, come l’ottimizzazione del codice del server, l’utilizzo di cache per ridurre il tempo di accesso ai dati, l’implementazione di una rete CDN per distribuire il contenuto più vicino agli utenti e, sicuramente, la scelta di un hosting web performante.
Nel dettaglio, puoi ottimizzare con questi interventi che riporto anche qui, sebbene alcuni siano stati citati nei paragrafi precedenti. Ma trattandosi di interventi legati nello specifico a questa metrica, per chiarezza di informazioni li ribadisco in questo contesto:
- Installa il certificato SSL sul tuo server web. Il processo varia a seconda del server web che utilizzi (Apache, Nginx, IIS, ecc.).
- Ottimizza l’hosting e il server web – assicurati che il tuo hosting abbia risorse sufficienti come CPU, RAM e banda. Aggiorna il software del server web all’ultima versione per ridurre l’overhead.
- Ottimizza il codice del sito, riduci il numero di elementi (immagini, CSS, JS, font) richiesti per ogni pagina rimuovendo codice non necessario, comprimendo le risorse, utilizzando caricamento asincrono per JS/CSS, etc.
- Unisci i file CSS e JS in un unico file per ridurre il numero di richieste HTTP. La minificazione rimuove gli spazi vuoti riducendo la dimensione dei file e aumentando la velocità di download.
- Abilita la compressione GZIP per i file CSS, JS e HTML (può ridurre le dimensioni dei file fino al 70%)
- Implementa la memorizzazione nella cache.
- Ottimizza le immagini
- Ottimizza le query SQL – le query SQL inefficienti possono rallentare l’elaborazione delle pagine e aumentare il TTFB.
- Utilizza un CDN per indirizzare gli utenti al server CDN più vicino, migliorando così la velocità.
- Redirigi il tuo sito dal protocollo HTTP al protocollo HTTPS. Dopo l’abilitazione di HTTPS, alcune risorse del sito (immagini, CSS, JS, ecc.) potrebbero non caricarsi più correttamente. Correggi questi collegamenti farli puntare a HTTPS.
- Attiva il protocollo HTTP/2, più efficiente di HTTP/1.1.
- Attiva un protocollo TLS aggiornato.
- Utilizza DNS ottimizzati. Servizi come Cloudflare offrono DNS ottimizzati che possono instradare gli utenti al server CDN più veloce, migliorando il TTFB.
Nota bene: HTTP/2 e TLS 1.3 non migliorano necessariamente il TTFB, ma rendono la connessione più efficiente.
Migliorare le prestazioni complessive del sito web richiede una combinazione di ottimizzazioni tecniche e strategie di marketing, agendo su diversi fronti.
L’ottimizzazione poggia anche su una solida strategia di Content Marketing, sui contenuti di qualità che il motore di ricerca valuta con sempre maggiore attenzione, quindi con un buon lavoro di copywriting, tenendo in considerazione le ricerche (e gli intenti annessi) delle persone che stanno cercando delle risposte coerenti, basate su esperienze e conoscenza del mondo in cui stanno entrando.
