Fai un test di velocità sul tuo sito e i risultati ti danno un punteggio, un elenco di raccomandazioni e quasi nessuna indicazione su da dove cominciare. Sapere come velocizzare un sito significa capire quali miglioramenti funzionano su quali parti della sequenza di caricamento e quali producono i risultati più grandi in rapporto allo sforzo. Questo articolo spiega le modifiche più efficaci da fare, in che ordine affrontarle e cosa può aspettarsi da ciascun miglioramento un tipico sito di una piccola attività.
La velocità del sito non si migliora con un'unica correzione. È il risultato di più fattori indipendenti che lavorano insieme: quanto è pesante la pagina, quanto in fretta risponde il server, quanto in modo efficiente vengono consegnati gli elementi e quanto lavoro deve fare il browser per mostrare ciò che vede il visitatore. Affrontare per primi i fattori che pesano di più produce i guadagni più rapidi. Per sapere quali metriche di caricamento contano e perché, leggi l'articolo su cos'è il tempo di caricamento della pagina e come si misura.
Quali sono le cause più comuni dei tempi di caricamento lenti?
Prima di fare modifiche, conviene capire dove si perde davvero il tempo. I siti lenti hanno quasi sempre in comune uno o più di questi problemi.
Immagini non ottimizzate
- Le immagini sono i file più grandi nella maggior parte delle pagine e la singola causa più comune dei tempi di caricamento lenti
- Una pagina con cinque fotografie non compresse può pesare da dieci a venti volte più del necessario
- Sistemare le immagini produce di solito il miglioramento di velocità più grande tra tutte le singole modifiche
Nessuna cache attiva
- Senza cache, ogni visita richiede al server di ricostruire la pagina e al browser di scaricare ogni file da zero
- La cache permette ai visitatori di ritorno di caricare le pagine da copie salvate, invece di scaricare di nuovo tutto
File di codice non minificati
- I file CSS e JavaScript contengono spesso spazi, commenti e formattazione che li rendono leggibili per gli sviluppatori ma aggiungono peso inutile per i browser
- La minificazione toglie questo contenuto in eccesso e riduce le dimensioni dei file, a volte del 30-50 percento
Risposta del server lenta
- Tutto aspetta il server. Se il server impiega più di 800 millisecondi a rispondere, ogni altra metrica parte già in ritardo
- Gli ambienti di hosting condiviso e i database non ottimizzati sono le cause più comuni di un Time to First Byte alto
Risorse che bloccano il rendering
- Script e fogli di stile caricati nell'intestazione del documento fermano il browser prima che possa mostrare qualcosa
- Spostare gli script non critici in modo che si carichino dopo il contenuto principale elimina questo collo di bottiglia
Come si ottimizzano le immagini per ridurre il peso della pagina?
L'ottimizzazione delle immagini è la soluzione con più impatto per la maggior parte dei siti, perché riduce direttamente i file più grandi della pagina. Tre modifiche insieme producono la riduzione più significativa delle dimensioni dei file immagine.
Scegli il formato giusto
- WebP produce file più piccoli del JPEG con la stessa qualità visiva e supporta la trasparenza come il PNG
- Passa a WebP per tutte le fotografie e le grafiche generiche. Usa il PNG solo quando serve la trasparenza
Ridimensiona prima di caricare
- Caricare un'immagine larga 4.000 pixel da mostrare a 800 pixel di larghezza costringe ogni visitatore a scaricare quattro volte più dati del necessario
- Ridimensiona le immagini alla loro larghezza massima di visualizzazione prima di caricarle
Comprimi a un livello di qualità adeguato
- Un'impostazione di qualità da 75 a 85 sui formati con perdita produce file più piccoli del 60-80 percento rispetto all'originale, senza differenza di qualità visibile per la maggior parte delle fotografie
- La combinazione di formato corretto, dimensione corretta e compressione adeguata può ridurre il peso delle immagini di una pagina dell'80-90 percento
Per una guida completa su formati dei file, tipi di compressione, caricamento differito e immagini responsive, leggi l'articolo su come ottimizzare le immagini per caricare più in fretta.
Come la cache riduce il tempo di caricamento?
La cache salva copie delle risorse della pagina, così non devono essere scaricate o rigenerate a ogni richiesta. Esistono due tipi che agiscono in punti diversi della catena di consegna.
Cache del browser
- Il browser del visitatore salva CSS, JavaScript, immagini e caratteri dopo la prima visita
- Le visite successive caricano quei file dal dispositivo locale invece di scaricarli di nuovo, riducendo drasticamente il tempo di caricamento per chi ritorna
- La cache del browser è controllata dagli header di cache impostati sul server. La maggior parte delle piattaforme di hosting moderne li imposta in automatico
Cache del server
- Il server salva versioni già generate delle pagine, così non devono essere ricostruite da zero a ogni richiesta
- Questo velocizza il Time to First Byte per tutti i visitatori, compresi quelli alla prima visita
- La cache del server è più efficace sui siti dinamici in cui le pagine sono generate da query al database
Per una spiegazione dettagliata di come funziona la cache del browser e di come configurarla, leggi l'articolo su cos'è la cache del browser e come funziona.
Cosa fa la minificazione per la velocità di caricamento?
I file CSS e JavaScript scritti dagli sviluppatori contengono spaziature, interruzioni di riga e commenti che rendono il codice più facile da leggere e da mantenere. I browser non hanno bisogno di niente di tutto questo. La minificazione lo toglie, producendo file più piccoli che si scaricano più in fretta senza cambiare il loro funzionamento.
- La minificazione del CSS riduce di solito le dimensioni del file del 20-30 percento
- La minificazione del JavaScript può ridurre le dimensioni del file del 30-50 percento, di più per i file grandi con molti commenti e spazi
- La minificazione è una delle vittorie più facili perché non richiede modifiche all'aspetto o al funzionamento del sito e spesso si può attivare tramite un plugin o un'impostazione della piattaforma
Per una spiegazione completa di come funziona la minificazione su CSS, JavaScript e HTML, leggi l'articolo su cos'è la minificazione e come aiuta il tuo sito.
Come una CDN riduce il tempo di caricamento per i visitatori?
Una rete per la distribuzione dei contenuti (CDN) riduce la distanza fisica tra il visitatore e il server che consegna i tuoi file. Senza una CDN, tutti i visitatori si collegano a un solo server in un solo luogo. Con una CDN, ogni visitatore viene servito dal server più vicino a lui.
- Per i visitatori vicini al server di origine, il miglioramento di velocità dato da una CDN è modesto
- Per i visitatori in altri paesi o regioni, una CDN può ridurre il Time to First Byte di centinaia di millisecondi
- Le CDN sono più efficaci sui siti con un pubblico internazionale o con molti contenuti multimediali
- Alcune piattaforme di hosting includono in automatico la consegna tramite CDN. Dove è inclusa, non serve nessuna configurazione aggiuntiva
Per una spiegazione completa di come funzionano le CDN e a chi servono, leggi l'articolo su cos'è una CDN e come aiuta il tuo sito.
Cos'è il caricamento differito (lazy loading) e come riduce il tempo di caricamento iniziale?
Il caricamento differito ritarda il download di immagini e altre risorse che stanno sotto la parte visibile, finché il visitatore non scorre vicino a esse. Riduce la quantità di dati che il browser deve scaricare prima che la pagina diventi utilizzabile.
- In una pagina con venti immagini, il caricamento differito fa sì che il browser scarichi solo le tre o quattro immagini visibili sullo schermo quando la pagina si apre per la prima volta
- Le immagini restanti si caricano mentre il visitatore scorre, distribuendo il download nel tempo invece di concentrarlo all'inizio
- Il caricamento differito migliora direttamente il Time to Interactive e può avere un effetto evidente sul Largest Contentful Paint quando il contenuto nella parte visibile non è ricco di immagini
- Non applicare il caricamento differito alle immagini nella parte visibile. Quelle devono caricarsi subito
Per una guida completa su come funziona il caricamento differito e su come applicarlo, leggi l'articolo su cos'è il lazy loading e come funziona.
Come rallentano una pagina le risorse che bloccano il rendering?
Quando un browser incontra uno script o un foglio di stile nell'intestazione del documento, sospende il rendering finché quel file non ha finito di caricarsi. Intanto il visitatore non vede nulla. Si chiama risorsa che blocca il rendering.
Come ridurre il blocco del rendering
- Sposta il JavaScript non critico in modo che si carichi alla fine del documento oppure usa l'attributo
deferoasync, così gli script non sospendono il rendering - Individua quale CSS serve subito (gli stili della parte visibile) e quale può essere caricato dopo
- Elimina o sostituisci gli script di terze parti non essenziali. Widget di chat, contenuti social incorporati e script di tracciamento aggiungono tutti tempo di blocco
E il tempo di risposta del server?
Ogni altro miglioramento è limitato da quanto in fretta risponde il server fin dall'inizio. Un server lento aggiunge ritardo prima che il browser possa iniziare a caricare qualsiasi risorsa.
Cosa influisce sul tempo di risposta del server
- Qualità dell'hosting: gli ambienti di hosting condiviso dividono CPU e memoria tra molti siti, causando tempi di risposta imprevedibili
- Prestazioni del database: query al database lente o non ottimizzate ritardano la capacità del server di generare una risposta
- Cache lato server: senza cache, ogni richiesta fa ricostruire l'intera pagina dal database
- Distanza geografica dal server: anche prima di coinvolgere una CDN, un server lontano dal visitatore aggiunge latenza
Un buon Time to First Byte è sotto gli 800 millisecondi. Se il tuo TTFB resta sempre sopra quel valore, migliorare l'hosting o attivare la cache lato server darà risultati che nessuna ottimizzazione lato front-end può eguagliare.
Da dove si comincia per velocizzare un sito?
Se lavori ai miglioramenti di velocità per la prima volta, questo ordine produce i guadagni più rapidi con meno fatica su un tipico sito di una piccola attività.
Ordine di priorità per la maggior parte dei siti
- Primo: ottimizza le immagini. Affronta la fonte più grande di peso della pagina ed è spesso responsabile del 60-80 percento del tempo di caricamento evitabile
- Secondo: attiva la cache. La cache del browser e del server riduce il lavoro svolto a ogni visita, soprattutto per chi ritorna
- Terzo: minifica CSS e JavaScript. Meno fatica, miglioramento affidabile nei tempi di trasferimento dei file
- Quarto: aggiungi una CDN se il tuo pubblico è distribuito geograficamente o se la consegna di contenuti multimediali è una parte importante del tuo sito
- Quinto: affronta le risorse che bloccano il rendering e il tempo di risposta del server se i passaggi precedenti sono stati fatti e i punteggi restano scarsi
Dopo ogni gruppo di modifiche, fai un test di velocità per misurare il miglioramento prima di passare all'area successiva. Per una guida su come interpretare con precisione i risultati dei test di velocità, leggi l'articolo su come testare la velocità del tuo sito. Per una spiegazione delle metriche specifiche su cui incidono questi miglioramenti, leggi l'articolo su cosa sono le Core Web Vitals.
Come WEMASY riduce il tempo di caricamento del sito
Il creatore di siti WEMASY gestisce in automatico diversi dei miglioramenti di velocità più comuni. Le immagini vengono compresse e convertite in WebP al caricamento. Gli header di cache del browser sono configurati di default. I file CSS e JavaScript serviti dalla piattaforma sono minificati. La consegna tramite CDN è inclusa in tutti i piani e serve gli elementi statici dalla località più vicina a ogni visitatore.
I punteggi di velocità delle pagine e i dati delle Core Web Vitals sono visibili nella dashboard delle statistiche di WEMASY, con raccomandazioni per ogni pagina che segnalano i problemi rimasti. Così puoi monitorare i miglioramenti dopo qualsiasi modifica ai contenuti o al design senza eseguire a mano test esterni.
Scopri cosa è incluso nel creatore di siti WEMASY, oppure guarda i piani nella pagina dei prezzi.
Domande frequenti
Qual è il modo più rapido per velocizzare un sito?
Ottimizzare le immagini produce il miglioramento di velocità più grande con meno fatica nella maggior parte dei siti. Le immagini non compresse sono il singolo fattore che pesa di più sulla pagina, e passare al formato WebP con una compressione adeguata e le dimensioni corrette può ridurre le dimensioni dei file immagine dell'80-90 percento. Dopo le immagini, attivare la cache del browser e minificare i file CSS e JavaScript sono i miglioramenti successivi con più impatto. Con il creatore di siti di WEMASY puoi impostare tutto questo direttamente sul tuo sito.
La velocità del sito influisce sul posizionamento nei motori di ricerca?
Sì. I motori di ricerca usano come segnali di posizionamento le Core Web Vitals, che misurano metriche specifiche di caricamento, interattività e stabilità visiva. Le pagine con buoni punteggi in Largest Contentful Paint, Interaction to Next Paint e Cumulative Layout Shift hanno un vantaggio di posizionamento rispetto a quelle con punteggi scarsi, in particolare quando le pagine concorrenti hanno una qualità di contenuto simile. I miglioramenti di velocità che alzano i punteggi delle Core Web Vitals possono contribuire a una migliore visibilità nella ricerca.
Qual è un buon tempo di caricamento per un sito?
Per le Core Web Vitals, l'obiettivo principale è un Largest Contentful Paint sotto i 2,5 secondi. In termini pratici, una pagina pienamente interattiva entro tre secondi su una connessione mobile rispetta la soglia che conta di più sia per l'esperienza dei visitatori sia per il posizionamento. Un caricamento completo della pagina sotto i cinque secondi su smartphone è un riferimento ragionevole per la maggior parte dei siti di piccole attività.
Come faccio a sapere cosa rallenta il mio sito?
Fai un test di velocità con uno strumento che mostri i dati sul campo insieme ai dati di laboratorio. Guarda le metriche specifiche segnalate come non superate invece di concentrarti sul punteggio complessivo. Un TTFB sopra gli 800 millisecondi indica problemi del server. Un punteggio LCP scarso indica di solito problemi di immagini o di risorse che bloccano il rendering. Un Total Blocking Time alto indica problemi di esecuzione di JavaScript. Ogni metrica indica un'area diversa da approfondire.
L'hosting influisce sulla velocità del sito?
Sì, in modo significativo. La qualità dell'hosting incide sul Time to First Byte, che determina quanto in fretta il browser può iniziare a caricare qualsiasi risorsa. Gli ambienti di hosting condiviso dividono la potenza di elaborazione tra molti siti, con tempi di risposta incostanti. Un hosting che include cache lato server e consegna tramite CDN riduce il TTFB e migliora la velocità di consegna per tutti i visitatori, indipendentemente dalle altre ottimizzazioni fatte sulla pagina stessa.
Posso velocizzare il mio sito senza uno sviluppatore?
Sì, per la maggior parte dei miglioramenti che fanno più differenza. Ottimizzare le immagini, scegliere i formati di file giusti e aggiungere il testo alternativo si può fare senza toccare il codice. Cache del browser e minificazione sono spesso gestite in automatico dalla piattaforma del sito o si possono attivare dalle impostazioni. Di solito serve uno sviluppatore solo per modifiche avanzate come una configurazione personalizzata del server, l'eliminazione delle risorse che bloccano il rendering nei siti scritti a mano o l'ottimizzazione delle query al database.