La soglia di attenzione media di un essere umano oggi è di 8 secondi: uno in meno rispetto ai pesci rossi. Se il tuo sito impiega lo stesso tempo per caricare, come speri di trattenere i tuoi utenti? Il discorso però non riguarda solo il danno all’esperienza utente: oggi SEO ed efficienza sono due argomenti legati strettamente tra loro.
Table of Contents
Un po’ di contesto
Dall’avvento dei dispositivi mobile i motori di ricerca hanno dato sempre più importanza all’ottimizzazione. Negli anni siamo passati da una prima fase in cui si parlava di Siti Responsive a parlare invece di Mobile First. Il modo stesso di lavorare dei web developer è dovuto cambiare, modificando la vecchia prassi del “faccio il sito e poi vediamo come adattarlo sul mobile”, a un lavoro fatto dando priorità al layout per i telefoni e solo dopo alla versione desktop.
Non è difficile capire che in questo contesto l’efficienza del sito web è diventata e sta diventando sempre più un aspetto imprescindibile per un lavoro di SEO fatto per bene.
Approfondimento: Chrome introduce il nuovo Speed Badge. Cosa cambierà?
Cosa significa avere un sito efficiente?
Per capire cosa significa avere un sito efficiente bisogna necessariamente fare un po’ di glossario.
Time to First Byte: è il tempo impiegato per ricevere il primo byte di risposta dal momento della richiesta da parte del browser [cioè da quando cliccate su un link o digitate un URL];
First Meaningful Paint: a volte anche Contentful Paint, è il tempo necessario per avere una prima risposta “sensata” e cioè quando immagini e testi sono visibili, almeno above the fold.
Onload Time: a questo punto tutta la pagina è carica, compresi i fogli di stile css, gli script e tutte le immagini.
Ora sappiamo di che si tratta, ma come utilizziamo queste informazioni?
Se avete un sito o ne state progettando uno, la prima cosa da fare sicuramente è eseguire un’analisi dell’efficienza: strumenti come Google PageSpeed o YSlow possono aiutarvi nel processo o, in alternativa, potete adoperare GTmetrix che aggrega entrambi i servizi in un unico strumento di analisi.
Un sito ideale ha uno scoring che supera il 90% sia in YSlow che in PageSpeed.
Il mio sito è disastrosamente sotto quel 90%. Che posso fare?
Se ti trovi in questa situazione non farti prendere dal panico. C’è molto che puoi fare per trasformare il tuo in un sito efficiente e buona parte dei consigli sulle azioni da intraprendere li troverai direttamente nei risultati dell’analisi che hai appena eseguito.
In ogni caso, anche se ogni sito è un mondo diverso, ci sono alcune regole d’oro che vanno bene per tutti i casi. Di seguito faccio un rapido elenco di azioni che possono aiutarvi a cercare di arrivare a quel 90% [o più!], non approfondirò ogni singolo argomento, ma per quello esiste Google ;)
Certificati SSL: ormai è imprescindibile avere un Certificato SSL e il sito raggiungibile tramite protocollo https, non solo per non essere marchiati come sito non sicuro, ma anche perché migliora la velocità complessiva del Time to First Byte.
Immagini ottimizzate: prima di caricare le immagini, assicuratevi che abbiano dimensioni coerenti con il loro utilizzo. È inutile avere una foto di 4000px se la massima risoluzione a cui la visualizzeremo sarà di 1920px.
Minimizzare i file HTML, CSS e JS: un file minimizzato [o minificato] è un file di testo a cui sono stati rimossi tutti gli spazi e le interlinee, e quindi è più leggero e rapido da caricare. Se non si vuole eseguire la minimizzazione direttamente sui file, qualunque sia il CMS che utilizzate, esiste un plugin che compia questa azione in modo dinamico.
Async e Defer agli script: l’aggiunta di uno di questi due attributi a tutti gli script che non sono necessari al First Meaningful Paint può portare un miglioramento impressionante all’efficienza di un sito.
Imparare a usare il file .htaccess: se vi appoggiate a un buon hosting avrete sicuramente la possibilità di aggiungere e modificare un file .htaccess nella directory principale del vostro sito. Questo piccolo file di testo vi permetterà, dopo esservi impratichiti un po’, di stabilire la durata della browser cache in base al tipo di file, di abilitare mod_gzip e DEFLATE per comprimere i file, mod_pagespeed per un efficientamento a 360 gradi, e varie altre chicche non solo per l’efficienza ma anche per la sicurezza del vostro sito.
Appoggiarsi a un hosting efficiente: Parliamoci chiaro, possiamo fare tutte le ottimizzazioni che vogliamo ma gran parte del Time to First Byte è dovuto al server che ci ospita. Personalmente la migliore esperienza che abbia avuto finora, dopo averne provati di italiani ed esteri, l’ho avuta con Keliweb, motivo per cui ho pensato di proporre questo articolo proprio in questo blog.
Conclusioni
Nonostante la spinta all’efficienza voluta da Google, ancora oggi si vede pochissimo lavoro sull’efficientamento dei siti web.
In questo articolo ho provato a dare un’infarinatura generale per chi ha già un livello tecnico medio, e una presa di consapevolezza per chi invece si avvicina per la prima volta a questi argomenti.
Il futuro di internet sarà sempre più puntato verso siti rapidi ed efficienti: il tuo è già pronto ad essere fra questi?
