Sito web veloce: oggi conta più che mai
In alcuni dei nostri articoli vi abbiamo parlato dell’importanza del posizionamento di un sito internet, come di fatto lo è anche possedere una grafica impattante e ciò per attrarre traffico sulla nostra pagina web. Oltre a curare questi aspetti così importanti, deve essere nostra premura far sì che l’utente una volta arrivato si senta coinvolto e motivato a proseguire la navigazione. Per questo motivo la velocità del nostro sito ha un ruolo fondamentale: un sito web veloce oggi conta più che mai.
Cosa intendiamo PER “avere un sito web veloce”
La velocità di caricamento di un sito è il tempo che impiega la nostra pagina ad essere visibile all’utente; questo tempo inizia dal momento in cui vengono scaricati gli elementi principali del sito medesimo.
Google, come pure altri motori di ricerca, ha dato sempre priorità alla velocità di caricamento di una pagina web e l’ha sempre considerata un fattore determinante. Tuttavia, da novembre dello scorso anno ha iniziato a dare molto più peso a questa variabile e ciò perché considera fondamentale quella che viene definita, la “user experience”, ovvero l’esperienza che l’utente vive al momento della navigazione internet. Se questa esperienza risulta negativa, l’utente interrompe ed esce prima di compiere qualsiasi azione sul sito. La velocità di caricamento di un sito è quindi decisiva per l’utente. Al giorno d’oggi il tempo è prezioso e generalmente coloro che intraprendono la navigazione internet non sono disposti a ricevere risposte in lassi di tempo dilatati. Stiamo parlando di frazioni di secondo!
I web core vitals
Google da tempo ha introdotto dei KPI o delle metriche ben precise per determinare i tempi di caricamento di una pagina web, così’ come i tempi minimi durante i quali una pagina deve essere pronta per “essere navigata” dall’utente. Arrivare agli standard che Google in un certo senso ci impone non è per nulla semplice, tuttavia possiamo cercare di avvicinarci il più possibile a quei parametri.
Le metriche attualmente in grado di fornire informazioni sulla velocità di caricamento sono:
LCP (Largest contenful paint):
Questo parametro misura il tempo necessario per scaricare l’elemento più grande presente sullo schermo. Gli elementi possono essere immagini, video, elementi di blocco, contenuti nel testo. Oltre a questi elementi, ne esistono altri quali, la velocità del server, Il CSS, Java script prima del tag head, e tempo di caricamento di altre risorse (above the fold).
I parametri per il LCP sono:
- Meno di 2.5 sec = BUONO
- Entro 2.5 – 4.5 s = MEDIO
- Sopra 4.5 s = BASSO
FID (First input delay)
Questo parametro invece misura il tempo di risposta della pagina all’input inviato dall’utente. In parole povere misura il tempo trascorso da quando l’utente fa un click e il tempo di risposta all’azione proposta. In questo caso i parametri sono i seguenti:
I parametri per il FID sono:
- Meno di 100 ms = BUONO
- Entro 100 – 300 ms = MEDIO
- Sopra 300 ms = BASSO
CLS (Cumulative Layout Shift):
Misura la stabilità visuale degli elementi visibili in una pagina web, ovvero la somma di percentuali di spostamento dopo che sono mostrati la prima volta. Maggiore è il tempo di spostamento tra un frame l’ altro e maggiore è il CLS.
I parametri per il CLS sono:
- Meno di 0.1 s = BUONO
- Entro 0.1 – 0.25 s = MEDIO
- Sopra 0.26 s = BASSO
Come abbiamo avuto modo di osservare, i parametri sono molto severi, e l’avvicinarsi il più possibile, aiuta ad ottimizzare il nostro sito.
Regole per migliorare la velocità del nostro sito web ed ottimizzarlo.
- Evitare di caricare risorse inutili di qualsiasi tipo.
- Precaricare le risorse critiche.
- Restituire il codice HTML il più velocemente possibile (ovvero comprimere alcuni file sia manualmente o attraverso plugin)
- Mantenere sempre aggiornate le ultime versioni di Php, WordPress, plugin vari ecc.
- Passare da http a https installando i dovuti protocolli
- Assicurarsi che il nostro hosting ottimizzi il trasferimento delle informazioni tra server e browser con l’http/2.
- Ridurre le immagini con nuovi formati tipo Webp. Se il vostro sito è carico di foto in formato jpg o png ci sono plugin che velocizzano quest’azione in modo sicuro.
Altre azioni che aiutano a ridurre tempi di caricamento
A volte ci si concentra su fattori super tecnici per cercare di diminuire i tempi di caricamento del nostro sito senza tenere conto che le font, elemento così semplice, possono essere un elemento di blocco importante. Quindi anche se la grafica di un sito è importante dobbiamo assicurarci che il font che utilizziamo non influisce negativamente. Troppi font possono rallentare il sito e rendono difficoltosa la lettura per gli utenti.
Anche le immagini e i video devono essere caricati in modo adeguato. Non carichiamo foto troppo pesanti e usiamo sempre un elemento per incorporare i nostri video sulla nostra pagina YouTube o Vimeo: caricare i video direttamente sul sito può essere molto penalizzante.
Per ultimo e non meno importante anche il tema che scegliamo per creare il nostro sito può avere un impatto importante se di velocità di caricamento si parla. Cercare sempre di ottimizzare tutte queste risorse al meglio.
Come monitorare la velocità di caricamento della nostra pagina web
In rete esistono diversi strumenti che ci forniscono informazioni sulla velocità della nostra pagina web. Uno di questi è proprio la nostra “Google search console”, ma ci sono anche altri tools come: Google page insights tanto per citarne un’altra dove, inserendo il nostro dominio, potremo avere dati più precisi sui nostri web core vitals.
Anche Lighthouse può essere uno strumento da sfruttare: possiamo scaricarlo direttamente come estensione di Google. Anche GT Metrix ci può fornire in modo rapido queste variabili.
Sicuramente avrete trovato diversi tecnicismi in questo articolo. Di fatto la velocità nel caricamento delle pagine web e un aspetto complesso e ampiamente discusso anche da parte di grandi sviluppatori. La cosa importante da non sottovalutare, è che quella di essere coscienti dell’importanza dell’impostazione iniziale a partire dall’utilizzo delle font ecc.
Non lasciate il vostro sito in mani di persone inesperte: la differenza si fa dall’inizio!