24/02/2021

SEO e Velocità: Le Cose Indispensabili da Sapere

Si parla sempre più spesso di velocità dei siti internet, ma esattamente come si misura e quale impatto può avere per il mondo della SEO, ovvero del posizionamento organico nei motori di ricerca e, in particolare, Google?

Già nel 2019 nel sito Search Advertising avevo pubblicato un articolo dicendo che avere un sito veloce è fondamentale per SEO e CRO. Vediamo ora di puntualizzare sulla definizione di velocità, su come misurarla e sull’impatto che può avere per quanto riguarda il posizionamento e non solo.

Cosa significa sito veloce

È fondamentale distinguere la velocità in due grandi famiglie:

  • Server
  • Client

Diventa importante tradurre in termini tecnici e metriche il lemma “lento” identificando dove il sito è lento, per poi analizzare quali sono gli elementi da ottimizzare.

Se per quanto riguarda la parte “client” diciamo che un buon front-end developer può trovare in breve tempo le cause della lentezza senza avere alcun accesso al sito o al CMS, per quanto riguarda la velocità server le cose si complicano. Ora ti spiego perché.

Velocità Server

Possiamo chiamare “Velocità Server” il tempo che intercorre da quando un utente (o un bot) richiede una pagina a un server, a quando l’HTML della pagina viene scaricato nel browser dell’utente.

Tale velocità è costituita dal tempo che il browser ci mette a raggiungere il server, dal tempo in cui il server “trova” la pagina e la condivide e dal tempo di download della stessa nel browser.

Dietro a “trova” si nascondono i principali motivi per cui abbiamo pagine molto veloci e pagine molto lente. Se la pagina è statica, ovvero pronta in un file .html per essere condivisa, i tempi del server sono molto molto ridotti: deve solo spedire la pagina per fare partire il download.

Se invece la pagina deve essere creata “on-demand”, ci saranno dei tempi di elaborazione costituiti da tempi legati all’interpretazione ed esecuzione dei linguaggi di programmazione e dai tempi di recupero di eventuali informazioni aggiuntive da fonti di dati.

PrestaShop, ad esempio, è un CMS, ovvero un sistema complesso che permette di gestire contenuti (e-commerce) con facilità. La sua struttura nativa prevede l’esigenza di UNA SOLA PAGINA che elaborando l’URL inizia a chiamare template, moduli, database per comporre la pagina:

Ogni passaggio richiede del tempo, per cui potremmo dire che un sito basato su CMS è potenzialmente molto più lento di un sito statico, con tutte le pagine pronte e salvate in .html nel server.

Ovviamente la potenza di un CMS è quella di:

  • Permettere a N persone di fare aggiornamenti senza scrivere una riga di codice
  • Fare ottimizzazioni grafiche da un pannello di controllo
  • Gestire cataloghi, vendite, disponibilità in tempo reale
  • Aggiornare tutti i link interni quando la struttura cambia

Tutto ciò ha un costo ma un’enormità di benefici: il costo da pagare è la complessità del sistema, oltre al tempo di ogni singola elaborazione e chiamata a database.

Ora che ti ho spaventato passo alle “parole dolci”: se chi ti segue è un’agenzia preparata saprà ottimizzare il tuo sito in modo che l’impatto di una macchina potente come PrestaShop possa essere quanto più leggero per gli utenti!

Ciò si fa con ottimizzazioni sistemistiche ai server, ma anche con sistemi di cache che possono agire su diversi punti dell’architettura, fino a creare versioni “statiche” delle pagine e prevederne aggiornamenti controllati.

Chi vuole addentrarsi nel tecnicismo può dare una occhiata al mio post Server e Client: Tempi di risposta.

Velocità Client

Con Velocità Client intendiamo il tempo necessario da quando la pagina (html) viene scaricata nel browser, alla sua composizione finale chiamata Rendering.

Anche in questo caso, se un sito è composto solo da codice HTML, i tempi di rendering sono velocissimi e le necessità di lavoro del browser sono minime. Se invece la pagina contiene chiamate a fogli di stile (css), chiamate a linguaggi di programmazione (js), immagini e quant’altro, il tutto si complica.

Nell’immagine abbiamo analizzato, con un tool chiamato GTMetrix, come avviene il download completo dell’articolo sui Codici EAN per Vendere Online del nostro Enrico:

Questo grafico, chiamato WaterFall, è solo l’aspetto “fisico” relativo alle performance client. A questo dobbiamo aggiungere l’aspetto “interattivo” in cui il browser deve interpretare HTML+CSS+JS per creare ciò che vediamo a video, chiamato tecnicamente DOM (Document Object Model).

Come misurare la velocità server

La misurazione della velocità del server è un lavoro da sistemisti, da programmatori molto avanzati o da DB admin. Né un utente tramite il suo browser né il più avanzato algoritmo di Google sono in grado di intercettare il motivo per cui le performance server siano lente.

Le uniche cose che si possono vedere sono le metriche legate alla richiesta della pagina stessa, ovvero:

  • Tempo di connessione al server (DNS, Contrattazione, SSL)
  • Tempo di risposta
    • Tempo di “produzione” della pagina, ovvero tempo tra la richiesta e il primo byte ricevuto dal browser (TTFB: Time To First Byte)
    • Tempo di download

Questa è l’unica visione che c’è. Se si vuole andare in profondità è necessario avere le chiavi di casa, ovvero avere accesso agli strumenti di monitoraggio della struttura dei vari server che compongono l’architettura (server web, cache server, reverse proxy server, log server, database server, connettori, …) e misurare gli elementi maggiormente frenanti in base alle chiamate interne che vengono effettuate per la generazione di una pagina.

Da (ex) informatico mi preme sottolineare una delle leggi dell’informatica: la velocità finale sarà data dalla velocità del componente coinvolto più lento… da qui non si scappa.

Come misurare la velocità client

Misurare la velocità client non voglio dire che sia più facile, ma sicuramente è qualcosa di più “disponibile”. Tutto ciò che avviene lato client è - per definizione - pubblico e analizzabile.

Oggi online esiste una quantità davvero enorme di strumenti che permettono di analizzare le performance di una pagina e identificare quali siano i componenti che ritardano maggiormente il processo di rendering.

I tre più famosi sono:

  1. GT Metrix
  2. Web Page Speed
  1. Page Speed by Google

Da qualche mese il mondo dei webmaster e dei SEO è però in fermento, perché il solito Google ha dichiarato che l’esperienza utente è un elemento così importante che non solo stava creando algoritmi per valutarla ma che da Maggio 2021 diventerà un fattore di rank.

In parallelo ha integrato in Google Chrome (e in Edge) uno strumento di analisi chiamato LightHouse e ha condiviso quelle che potrebbero essere le metriche valutative dei siti ai fini del rank:

  • FCP: First Contentful Paint (tempo di caricamento del primo elemento visibile)
  • LCP: Largest Contentful Paint (tempo di caricamento del principale elemento visibile)
  • TTI: Time to Interactive (tempo per la prima interazione dell’utente)
  • CLS: Cumulative Layout Shift (scivolamento della pagina durante il caricamento/rendering)

Lo strumento non si limita solo a dare delle misurazioni, ma propone anche un sistema di diagnostica per individuare quali possono essere gli elementi frenanti: mica male, no? Basta avere un buon front-end developer in grado di tradurli in azioni ;)

Velocità e SEO

Siamo arrivati al dunque, ovvero l’impatto della velocità sulla SEO. Fino a qualche mese fa si poteva dire che la velocità era un fattore che influenzava Google esclusivamente per quanto riguarda le performance server, con conseguenze sul crawling budget (scansione del sito) e sul posizionamento.

Più un sito è veloce, più Google (GoogleBot) lo scansiona. Dopo anni e anni di SEO e report per clienti, penso di avere una galleria di screenshot che mostrano il comportamento di GoogleBot in caso di rallentamenti del server o di accelerazioni del server.

Te ne mostro uno davvero esplicito:

Dopo le ultime dichiarazioni invece entrano (entreranno) anche i fattori di usabilità di Google, che oggi troviamo nei report di LightHouse.

La misurazione di tali fattori, come abbiamo già visto, può avvenire tramite test puntuali e in tempo reale sulle pagine, oppure tramite analisi di un database di Google, residente in BigQuery, chiamato “ChromeUX Report”.

Da mesi ormai teniamo sotto controllo i nostri clienti, accedendo al database di Google e monitorando, tramite DataStudio, le loro performance e quelle dei loro concorrenti:

Sei abbastanza veloce?

Da anni sono un amante della corsa e voglio riportare - a conclusione di questo articolo - un insegnamento che si condivide sempre nella community. La velocità non è un valore assoluto, ma relativo: non è importante quanto sei veloce, ma se sei più veloce della concorrenza.

Buona programmazione e buona SEO!

Ogni 2 settimane, la nostra newsletter di e-commerce

Inviando questo modulo, accetti che i dati inseriti vengano utilizzati da PrestaShop S.A per l’invio di newsletter e offerte promozionali. Puoi annullare l’iscrizione in qualsiasi momento utilizzando il link nelle e-mail che ti sono state inviate. Ulteriori informazioni sulla gestione dei tuoi dati e sui tuoi diritti.