Come aumentare la velocità di un sito web: quando la tecnica e il contenuto non sono tutto…
Abbiamo già parlato nella scorsa lezione di quanto sia importante decidere subito la tematica da affrontare, non spaziare molto e allontanarsi da essa e sopratutto avere ben chiare le parole chiave da utilizzare in ottica di seo, on-page, indicizzazione.
Ma la velocità di un sito web, di cui parleremo oggi, è molto importante e non va assolutamente presa sotto gamba.
Abbiamo visto di come la tecnica dell’ottimizzazione on page sia importante, definendo titoli, descrizioni, immagini etc… ma è pur vero che oltre questo esiste il fattore umano.
Voi direte “cosa centra l’uomo in tutto ciò?“. Semplicissimo: dall’altra parte dello schermo c’è il nostro utente a cui noi dovremo dare il giusto risultato alle sue ricerche. Il nostro sito dovrà rispondere alle sue esigenze, dunque facendolo rimanere molto tempo sul sito evitando il bounce-rate.
Ma, c’è sempre un ma, in questo mondo così veloce e pazzo la gente ha bisogno di risposte rapide e veloci: ecco perchè aumenta anno dopo anno la velocità di connessione (negli ultimi anni abbiamo visto atterrare nelle nostre case e sui nostri telefonini il 5g, la fibra, la superfibra).
Lo stesso vale per un sito web: secondo alcuni esperti, sembra che Google dia un punteggio alla velocità di caricamento e apertura di un sito web.
Come ben sappiamo, ovviamente, un sito web per essere veloce deve essere leggero e quindi le pagine web, gli script, e le immagini devono essere di pochi kb. Ma non è tutto.
L’importanza di un sito veloce e leggero
Parametro importante è la velocità di un sito web nella sua apertura (quindi download e decompressione) e visualizzazione sui dispositivi.
Uno strumento utile per controllare la velocità del proprio sito web e dei suoi componenti e oggetti è il test che ci mette a disposizione Google disponibile a questo link Google speed insight.
Grazie a questo test potremo controllare lo score, il punteggio, che Google attribuirà al nostro sito (possiamo inserire la homepage o una pagina specifica). Ci dirà il peso della pagina, i secondi di caricamento, il punteggio basato su varie voci tipo javascript, css e così via.
Saremo dunque in grado di capire cosa ottimizzare oppure no. Lo stesso test ci darà il risultato anche per i dispositivi mobili!
Ad ogni modifica effettuata potremo rieffettuare il test per capire se ci sono migliorie oppure no.
Un altro test è il famoso ed eccellente Gtmetrix. Molto simile allo strumento di Google ci darà uno schema approfondito di valori su cui andare a metter mani.
Infine, ultimo ma non per importanza, bisogna pensare adll’utilizzo del sistema CDN ossia un sistema di distribuzione dei contenuti su più server in modo che ogni utente raggiunga il server più vicino geograficamente a lui e possa diminuire i tempi di attesa di scaricamento del sito web.
Alcuni servizi di hosting si fanno pagare questo servizio, altri no, altri offrono servizi simili ma farlocchi. E’ bene scegliere quello giusto.
Modificare il file .htaccess per velocizzare il server
Premettiamo che non tutti gli hosting condivisi permettono la modifica di questo file, ma qualora fosse possibile vi consigliamo caldamente di chiedere al vostro provider di farlo per voi o di fare voi le modifiche utili a velocizzare il server!
Compressione Gzip
Come abbiamo spiegato, la velocità di caricamento delle pagine web è diventata importante in ottica indicizzazione ed è diventata una pratica seo basilare.
Guardiamo l’immagine qui postata e capiremo come funziona il sistema Gzip: l’utente chiede una pagina web specifica, il server la trova e crea un file zippato quindi compresso.
Lo stesso server invia il file al browser il quale, grazie anche alla velocità e potenza di calcolo dei nuovissimi computer e smartphone, impiegherà pochissimi istanti a decomprimere sul dispositivo il sito e mostrarlo all’utente.
Prima, invece, cosa succedeva? Semplicemente che il server inviava kb su kb di sito web all’utente il quale doveva attendere lo scaricamento. Ora invece è tutto compresso.
Perchè è utile lo Gzip? Per capirlo bisogna prima studiare come funziona un file compresso: esso permette di non ripetere più volte uno stesso oggetto (un pò come fa un file .mp3) e quindi immaginiamo una pagina html o css quante stringhe ripetute avrà. In questo modo avremo meno stringhe -> meno peso in kb -> sito leggerissimo -> caricamento rapido e aumento di velocità di un sito web!
Esempio di .htaccess opportunamente modificato per il Gzip.
<IfModule mod_deflate.c>
<IfModule mod_setenvif.c>
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
</IfModule>
<IfModule mod_headers.c>
Header append Vary User-Agent env=!dont-vary
</IfModule>
AddOutputFilterByType DEFLATE text/css application/x-javascript text/html text/richtext image/svg+xml text/plain text/xsd text/xsl text/xml image/x-icon
</IfModule>
La cache e la sua gestione tramite file .htaccess
Se il nostro sito non viene cambiato spesso quindi gli oggetti risultano sempre gli stessi, è inutile far scaricare all’utente più volte la stessa pagina. Basterà gestire gli oggetti in cache in modo che quando l’utente tornerà sul sito web potrà scaricare le nuove informazioni del sito mentre le vecchie le prenderà dalla memoria interna del proprio dispositivo.
Una bella mossa, non trovate?
Ecco il codice per l’.htaccess
# durata della memoria cache mensile
<FilesMatch “\.(jpg|jpeg|gif|png|ico|swf|flv)$”>
Header set Cache-Control “max-age=2592000”
</FilesMatch>
# durata della memoria cache settimanale
<FilesMatch “\.(js|css|pdf|txt)$”>
Header set Cache-Control “max-age=604800”
</FilesMatch>
# durata della memoria cache giornaliera
<FilesMatch “\.(html|htm)$”>
Header set Cache-Control “max-age=43200”
</FilesMatch>
Ogni blocco, come potrete notare, riportare il tipo di file da immagazzinare e il suo “tempo di vita”. Scaduto quel tempo verrà scaricato il nuovo file dal sito.
La durata è variabile ed è a pura scelta dello sviluppatore: solo lui sa ogni quanto tempo verrà cambiato un oggetto. Un sito di notizie in tempo reale necessita di una cache limitata, mentre un sito statico può benissimo mantenere in memoria gli oggetti per mesi e mesi.. spesso anche anni!
Ma la velocità effettiva del server, come la impostiamo?
Qui si apre un capito a parte ma in ottica di indicizzazione e seo off page è una parte molto importante su cui ogni sviluppatore deve soffermarsi.
Nella prossima lezione capiremo come scegliere un hosting su cui poggiare il proprio sito web e tutti i servizi utili al suo mantenimento, utili al fine di migliorare la velocità di un sito web.
