Martedì
11
Luglio 2023
Come aumentare la velocità del tuo sito web in modo veramente efficace? Devi sapere che è un lavoro lungo e richiede conoscenze tecniche e anche di linguaggi di programmazione.
In questa guida inizieremo dalle basi per poi addentrarci in operazioni più complesse da realizzare, ovvero tutte le ottimizzazioni più efficaci per il tuo sito web.
Ultima precisazione, siccome circa il 40% dei siti web è realizzato con WordPress, questa guida si basa principalmente su questo CMS. Puoi comunque applicare molti di questi consigli anche ad altri CMS o siti web realizzati in codice.
Prima di iniziare dovrai testare la velocità del tuo sito, per vedere quali sono i principali errori da risolvere.
Ci sono tantissimi speed test, uno migliore dell’altro. Dovrai scegliere il più affidabile anche in base alle tue capacità di sviluppo web e alla complessità del progetto che vuoi realizzare.
l primo passo per veder decollare le prestazioni è cambiare hosting, cioè lo spazio web in cui sono presenti tutti i file che compongono il tuo sito.
Ci sono diversi fornitori più o meno performanti e con tantissimi prezzi diversi. Nella maggior parte dei casi, più è alto il prezzo per l’hosting, maggiori saranno le performance generali.
Prima di comprarne uno, ricorda di confrontare le caratteristiche per scegliere il più adatto al tuo progetto.
Questa è forse il fattore che influenza maggiormente sulle prestazioni del tuo sito web in quanto dal tuo hosting dipende il tempo di caricamento di ogni risorsa del tuo sito: file CSS, Javascript, immagini e codice HTML.
L’ho provato io stesso! Cambiando hosting ho raddoppiato il numero di click in pochi mesi!
Questa è una pratica molto comune e consiste nel ridurre il peso delle immagini, cioè diminuire i kb delle foto mantenendo però la qualità originaria.
Ci sono diversi strumenti online che consentono questo, io ti consiglio TinyJPG perché è il migliore tra quelli che ho provato.
Ottimizzare le immagini aumenterà anche le prestazioni e il posizionamento in SERP del tuo sito web, infatti dovrai:
Ora è giunto il momento di pensare al server e ridurre il lavoro che deve fare per mostrare il tuo sito web.
Immagina ogni immagine, file CSS e Javascript come una risorsa che il browser deve “richiedere” al server su cui è ospitato il tuo sito per mostrarle sullo schermo dell’utente.
È automatico pensare che meno risorse deve richiedere e meno tempo impiegherà il tuo sito per caricarsi completamente.
Per ridurre le richieste del server dovrai:
Per migliorare questo aspetto è necessario talvolta conoscere i linguaggi di programmazione con cui è realizzato il tuo sito, non solo HTML, CSS e Javascript.
CSS e Javascript sono in assoluto i file che incidono maggiormente sulle prestazioni generali di un sito. Agli sviluppatori di tutto il mondo piace molto inserire elementi grafici elaborati, animazioni, preloader e tantissimi altri elementi molto invasivi.
Le linee guida fondamentali su questi file sono:
Se usi WordPress ti interesserà recuperare l’elenco Handle (ovvero gli ID) dei file css e javascript installati sul tuo sito, per poi verificare se rimuoverli o no.
In caso contrario, ci sono molti plugin che fanno questo lavoro, ad esempio WP Rocket.
Ora che hai snellito i file del tuo sito è necessario occuparsi della cache. Sicuramente ne hai già sentito parlare, sì è proprio quella “cosa” che rallenta il tuo PC.
In realtà non è solo questo, vediamo esattamente cosa significa.
La cache è un’unità di memoria temporanea in cui vengono salvate copie dei file dei siti web (immagini, CSS e Javascript) per poterle caricare più velocemente la prossima volta che visiti lo stesso sito.
Abbiamo parlato delle richieste al server nel paragrafo precedente. Ebbene sì, invece di effettuare una richiesta, il browser recupera la copia del file che hai salvato sul PC nella cache, velocizzando il caricamento.
Di contro, con troppi file memorizzati nella cache, il tuo PC sarà rallentato, ma questa non è colpa del sito!
Per abilitare la cache nei siti web puoi utilizzare un plugin di caching come WP Rocket o Autoptimize.
Nel file wp-config.php di WordPress dovrai anche aggiungere questa riga di codice:
define('WP_CACHE', true);
Una delle principali cause del rallentamento del tuo sito è l’eccesso di plugin. Essi infatti aggiungono delle funzionalità a volte indispensabili ma sei sicuro che non ci sia altro modo?
Innanzitutto ti consiglio di fare una selezione molto rigida tenendo solo quelli indispensabili, poi valuta se esistono semplici porzioni di codice per ottenere lo stesso risultato senza plugin.
Puoi ad esempio usare i nostri codici per creare:
Anche il tema è fondamentale per aumentare la velocità del tuo sito web, infatti dovrai:
In qualunque strumento di test del tuo sito web viene evidenziato come problema molto grave la presenza di file (Javascript soprattutto) che bloccano la visualizzazione dei contenuti fino al completo caricamento della pagina.
Questo problema di velocità chiamato TBT si risolve così:
Se usi jQuery applicare questa miglioria potrebbe far comparire l’errore “$ is not a function”, ho scritto per te una guida su come risolverlo.
Questo problema può essere dovuto molto spesso a:
Questa è un’altra metrica spesso evidenziata dagli speed test e indica il lavoro che deve compiere il server per caricare completamente le risorse necessarie alla pagina.
Per risolverlo dovrai:
Il CLS è una metrica fondamentale da tenere sotto controllo, infatti indica la variazione di layout degli elementi della pagina durante il caricamento.
Google chiarisce con un esempio:
Immagina di voler cliccare sul tasto “cancella ordine” di un e-commerce e questo viene prontamente rimpiazzato durante il tuo click dal tasto “conferma ordine”. Potresti involontariamente completare l’acquisto!
Forse questo è un caso molto raro ma comunque spiacevole. Nell’uso comune del web capita spesso (o capitava) di vedere elementi della pagina in continuo movimento durante il caricamento, questo potrebbe creare problemi.
Per ridurre il CLS devi analizzare ogni elemento della pagina:
Le pagine con un alto CLS vengono penalizzate anche nelle posizioni della SERP.
CDN è l’acronimo di Content Delivery Network, tradotto una rete di distribuzione contenuti.
Quando un utente visita il tuo sito (effettuando richieste al server) verrà gestito dal nodo CDN più vicino geograficamente alla sua posizione, senza accollare tutto il lavoro al server principale.
I CDN in sostanza tolgono parte del lavoro al server su cui è ospitato il sito e funzionano molto bene con molti utenti online contemporaneamente sul tuo sito.
I reindirizzamenti (o redirect) allungano i tempi di caricamento per ovvi motivi: il browser impiega tempo per caricare una pagina che poi deve essere sostituita da un’altra.
Spesso però i redirect sono necessari e, a volte, fondamentali per non perdere utenti. Se proprio devi creare redirect non usare un plugin che appesantisca il sito. Ho scritto per te una guida su come fare i redirect in WordPress senza plugin.
Scrivi un commento