Sito WordPress veloce: 7 fattori da non trascurare

Al momento stai visualizzando Sito WordPress veloce: 7 fattori da non trascurare

Se hai già un sito web o hai intenzione di crearne uno, sappi che per ritenerti soddisfattә non devi considerare solo il suo aspetto grafico, ma anche le sue prestazioni. Uno dei principali parametri per valutare la qualità tecnica di un sito web è la velocità e in questo articolo ti parlerò proprio di questo.

Sia gli utenti che i motori di ricerca amano i siti web veloci. Ma cosa si intende esattamente? E fa davvero così tanta differenza?

Risponderò a tutte queste domande e, soprattutto, proverò a spiegarti in modo semplice quali sono gli aspetti da non trascurare per avere un sito WordPress veloce.

Cos’è la velocità di una pagina web?

Per capire di cosa parliamo esattamente quando ci riferiamo alla velocità di un sito web farò riferimento ai parametri indicati da Google. Lo sappiamo, è il motore di ricerca più utilizzato al mondo ed è dunque lì che, con molta probabilità, gli utenti del web possono venire in contatto con il tuo sito.

Comincio col dire che la velocità non è sempre stata intesa allo stesso modo, né tanto meno misurata tramite gli stessi indicatori. Il web si evolve e sono diversi anni che Google lavora per renderlo più user-friendly, mettendo l’utente e la sua esperienza sempre più al centro. Ed è così che è cambiato anche il concetto di velocità.

Come ricorda Philip Walton, ingegnere di Google, le principali metriche usate in passato misurano la velocità di caricamento di una pagina senza considerare ciò che effettivamente viene visualizzato sullo schermo (load e DOMContentLoad), oppure catturano solo l’inizio dell’esperienza di caricamento (First Contentful Paint/FCP), o ancora risultano spesso imprecise e poco significative (First Meaningful Paint/FMP e Speed Index/SI).

Senza addentrarci nei tecnicismi, gli ingegneri di Mountain View hanno presto capito che se un utente clicca sul link di un sito web e questo, aprendosi, mostra una schermata iniziale o un indicatore di caricamento, ciò non può essere di certo considerato un momento rilevante per l’utente.

Ecco allora che è stata introdotta una nuova metrica più incentrata sulle persone che, con il Core Web Vitals Update di Google del 2021, è diventata il punto di riferimento a cui guardare quando parliamo di velocità di un sito web.

Sto parlando del Largest Contentful Paint (LCP), il quale misura il tempo impiegato affinché il contenuto principale di una pagina, ossia quello più grande,venga caricato e reso fruibile all’utente, che si tratti di un’immagine, un video o un blocco di testo visualizzabile senza la necessità di scorrere in basso.

Per capire meglio, riporto qui l’esempio fornito sempre da Philip Walton:

Esempio LCP sito web 1
Fonte: web.dev
Esempio LCP sito web 2

In entrambe le timeline sopra riportate, l’elemento più grande cambia con il caricamento del contenuto.

Spesso i contenuti che si caricano in ritardo sono più grandi di quelli già presenti nella pagina, ma ciò non necessariamente accade. I due esempi seguenti mostrano l’LCP che si verifica prima del caricamento completo della pagina:

Esempio LCP sito web 3
Fonte: web.dev
Esempio LCP sito web 4

Nel primo esempio, il logo di Instagram viene caricato relativamente presto e rimane l’elemento più grande anche quando gli altri contenuti vengono progressivamente mostrati. Nell’esempio della pagina dei risultati di ricerca di Google, l’elemento più grande è un paragrafo di testo che viene visualizzato prima che le immagini o il logo finiscano di essere caricati e poiché tutte le singole immagini sono più piccole di questo paragrafo, esso rimane l’elemento più grande durante tutto il processo di caricamento.

In pratica, ciò che si misura oggi è la velocità di caricamento percepita, perciò quando devi progettare il tuo sito web o misurarne le performance devi assolutamente prendere in considerazione la metrica LCP.

Tra poco ti spiego come fare e quali sono le soglie chiave da tenere presenti, ma prima è bene capire appieno perché la velocità di un sito web è un elemento da non trascurare.

Perché la velocità di un sito è importante?

Anche tu che leggi questo blog sei un utente del web e anche se probabilmente non ci hai mai riflettuto più di tanto, sai benissimo cosa può rendere spiacevole la tua navigazione online. Sicuramente un sito che impiega troppo tempo a caricarsi ti indispettisce parecchio e, se magari sei più impaziente del solito, ti basta un istante per decidere di chiudere la pagina e cercare altrove. Dico bene?

Sappi che è un comportamento molto comune, per cui non serve essere degli esperti sviluppatori per rendersi conto che una pagina web lenta non piace a nessuno. Dunque, trascurare la velocità di un sito web vuol dire innanzi tutto perdere visitatori e, di conseguenza, potenziali clienti.

Proprio Google ci fornisce dei dati utili a capire come ogni secondo conti! Una ricerca ha infatti dimostrato che le probabilità di rimbalzo (bounce), ossia che un visitatore lasci uno spazio web dopo aver visitato un’unica pagina, aumentano del 32% quando il tempo di caricamento della pagina va da uno a tre secondi e addirittura del 90% quando il tempo di caricamento va da uno a cinque secondi.

Infografica sul tasso di rimbalzo in base alla velocità del sito web

Con l’aggiornamento del 2021 a cui accennavo, la velocità percepita è diventato ufficialmente un fattore di ranking di Google, vale a dire un fattore chiave per il buon posizionamento sulla pagina dei risultati di ricerca (SERP), per cui non puoi dire di fare SEO senza ottimizzare in primis la velocità del sito web.

Fonte: thinkwithgoogle.com

Insomma, più il tuo sito è veloce, maggiore è la probabilità di essere trovato quando gli utenti effettuano una ricerca e maggiori sono le probabilità di trattenere i visitatori e fargli compiere le azioni rilevanti per il tuo business.

Contenuto Instagram sulle azioni rilevanti che dovrebbe far compiere un sito web
Mi segui già su Instagram?
Non perdere altri contenuti come questo!

Come testare la velocità di un sito web

Ora che abbiamo visto cosa si intende esattamente per velocità e perché è importante misurarla, vorrai sapere quali strumenti utilizzare per analizzare l’LCP del tuo sito.

Innanzi tutto, quale deve essere il valore dell’LCP per ritenere un sito web veloce?

Sulla base delle osservazioni di Google il contenuto principale di un sito dovrebbe caricarsi entro i 2,5 secondi.

Valore di un LCP buono, da migliorare e scarso
Fonte: web.dev

Per verificare se il tuo sito ha una buona resa oppure è arrivato il momento di fare qualche importante intervento di miglioramento ti suggerisco questi 5 tool facili e pronti all’uso:

Schermata report diagnostico di PageSpeed Insight
Test lawebstrategist.it su PageSpeed Insight
Schermata report diagnostico di GTmetrix
Test lawebstrategist.it su GTmetrix

Si tratta di tool gratuiti online che ti mostrano chiaramente l’LCP e altre metriche relative ad altrettanti importanti indicatori di performance di cui sarà bene parlare nei prossimi articoli. Non solo, offrono anche degli utilissimi report diagnostici che possono aiutarti a fiutare i problemi più gravi.

Le cause di un LCP scarso

Se non hai alcuna dimestichezza con lo sviluppo web e tutto ciò che leggi nei report diagnostici risulta incomprensibile, provo a spiegarti in maniera semplice cos’è che in genere determina un LCP scarso:

  • Tempi di risposta lenti del server
    Problemi relativi allo spazio in cui è fisicamente ospitato il tuo sito.
  • JavaScript e CSS che bloccano il rendering
    Problemi relativi al codice utilizzato per realizzare l’aspetto estetico del tuo sito e tutte quelle caratteristiche che ci fanno dire “wow”.
  • Tempi di caricamento delle risorse
    Caselle di testo, immagini, video e altri documenti di grandi dimensioni che richiedono tempo per essere caricati.
  • Rendering lato client
    Problemi relativi alla tecnologia che converte i dati in pagine web direttamente nel browser dei visitatori (per intenderci Chrome, Edge, Mozilla), anziché nel server.

Vediamo allora quali sono i principali fattori che ci aiutano a tenere a bada queste cause per un sito web con installazione WordPress.

Come velocizzare un sito WordPress?

WordPress è uno dei Content Management System (CMS) più utilizzati al mondo e ha dato a molte persone la possibilità di realizzare un sito web senza essere necessariamente degli sviluppatori. Tuttavia la sua facilità di utilizzo non deve far trascurare gli aspetti legati alle performance.

I principali fattori su cui intervenire per rendere un sito WordPress più veloce sono sostanzialmente 7:

  1. Hosting
  2. Tema
  3. Plugin
  4. JavaScript, CSS e HTML
  5. Database
  6. Cache
  7. Immagini

Niente paura. Sono tutti elementi che, adottando delle buone prassi e utilizzando le giuste funzioni di WordPress, possono essere ottimizzati anche da chi non ha elevatissime competenze di web development. Vediamoli uno a uno più nel dettaglio.

1. L’importanza della scelta dell’hosting

Per evitare tutti i problemi relativi ai tempi di risposta del server la cosa in definitiva più importante da fare è affidarsi ad un buon hosting, servizio indispensabile che consente di “affittare” lo spazio necessario ad ospitare i dati di un sito web.

I servizi hosting sul mercato sono davvero tanti e il rischio è quello di fare la scelta sbagliata, magari guardando solo al portafoglio, o comunque quella meno adatta alle tue esigenze.

Sicuramente cercare le recensioni e le discussioni di utenti e professionisti è un primo passo per orientarti su un servizio strutturato e di qualità. Dopodiché ci sono degli elementi chiave da considerare per fare la scelta migliore per te:

  • Hosting WordPress
    Innanzi tutto, dato che in questo articolo sto parlando di siti WordPress è bene che la scelta ricada su un servizio ottimizzato proprio per ospitare il celebre CMS.
  • Spazio web e traffico
    In secondo luogo è bene considerare lo spazio e il traffico web garantiti. In base alla tua attività e a quello che dovrà fare il tuo sito, dovresti essere in grado di prevedere il suo peso – non solo in termini di numero di pagine ma anche in termini di complessità delle funzioni e dunque di calcolo – e i visitatori che ti aspetti di avere: un sito vetrina o un blog aziendale saranno certamente più semplici di un e-commerce o una piattaforma e-learning.
  • Scalabilità
    Oltre allo spazio e al traffico, sarà molto importante capire se sono previste soluzioni per l’apliamento dello spazio. Già, perché magari all’inizio non avrai particolari esigenze, ma in futuro, man mano che la tua attività cresce, potrai avere la necessità di far crescere anche il tuo sito e vorrai evitare di ricorrere a complicate migrazioni da un hosting all’altro.
  • Hosting condiviso o dedicato?
    Le stesse considerazioni sono utili anche a capire se sia meglio optare per un hosting condiviso, ossia optare per uno spazio condiviso con altri siti web, oppure un hosting dedicato, cioè uno spazio che ospita esclusivamente i tuoi dati.
  • Posizione del server
    Un altro aspetto utile a fare la scelta giusta è considerare la posizione dei server. La distanza infatti incide sui tempi di risposta, per cui se i tuoi visitatori sono solo in Italia è meglio optare per un hosting che mette a disposizione dei server il più vicino possibile e non oltreoceano. Se invece vuoi rivolgerti ad un pubblico internazionale sarà utile optare anche per un Content Delivery Network (CDN), ossia una rete di server localizzati in diverse aree geografiche che velocizza così la distribuzione dei contenuti.
  • Assistenza
    Infine è molto importante la tipologia di assistenza offerta. Nel regno dell’informatica gli errori sono molto frequenti perciò avere dei tempi rapidi per la risoluzione dei problemi è fondamentale.

2. Scegliere un tema leggero

I temi WordPress sono molto utili per ottenere dei buoni risultati senza mettere mano al codice. Generano infatti l’interfaccia e il layout grafico del sito web, pertanto hanno un impatto notevole sui tempi di caricamento delle pagine e dei contenuti principali.

É bene allora scegliere un tema che non sia solo bello, ma che abbia soprattutto un codice pulito e leggero per garantire degli alti livelli di prformance.

Anche in questo caso la comunità del web ti viene in aiuto. Internet è infatti pieno di recensioni, discussioni e articoli di professionisti che valutano le caratteristiche e le prestazioni degli innumerevoli temi in circolazione e non ti servirà molto per capire quali sono i più validi e popolari.

3. Plugin: mai esagerare

I plugin sono la cosa più bella di WordPress. Ce ne sono tantissimi, di tutti i tipi e per qualsiasi scopo, sia per quel che riguarda le funzionalità, che per l’aspetto che vuoi dare al tuo sito. Tuttavia sono un arma a doppio taglio e anche se la tentazione sarebbe quella di installarne a profusione è assolutamente sbagliato farlo.

I plugin non fanno altro che aggiungere righe di codice ai file del tuo sito e richiedere maggiori risorse per la corretta esecuzione delle pagine, causando quindi tempi di risposta del server più lenti e a volte anche problemi al rendering.

Anche in questo caso, dunque, è bene installare solo i plugin strettamente necessari ed eseguire dei test per valutare che impatto abbiano sulle prestazioni del tuo sito.

4. JavaScript, CSS e HTML ottimizzati

Java Script, CSS e HTML costituiscono la maggior parte dei file di cui è composto un sito web.

In estrema sintesi, ti basti sapere che l’HTML definisce la struttura e il contenuto delle pagine, il CSS definisce la loro rappresentazione grafica, mentre il JavaScript definisce le reazioni al verificarsi di determinati eventi.

Per ridurre i tempi di caricamento della pagina ed evitare il blocco della visualizzazione è molto importante gestire due aspetti: da una parte diminuire le dimensioni dei file rimuovendo tutti i caratteri inutilizzati ed eliminando le risorse inutilizzate, dall’altra gestire in modo ottimale il momento di caricamento stesso di queste risorse, optando per ritardarlo quando necessario.

Ok. sono certa che tutto questo avrà poco significato per te. Si tratta infatti di aspetti molto tecnici e intervenire manualmente richiede buone conoscenze di sviluppo web. Tuttavia, se non si ha la minima competenza a riguardo consiglio di installare dei plugin di ottimizzazione. Poco fa dicevo per l’appunto di installare solo i plugin strettamente necessari. Ebbene, in tal caso un plugin per l’ottimizzazione dei file JavaScript, CSS e HTML diventa essenziale.

5. Database pulito

Non solo codice, anche un ambiente ottimizzato è molto importante per restare sotto la soglia dei 2,5 secondi. Ogni volta che revisioni una pagina o un articolo, elimini un utente, dei commenti o altre opzioni, all’interno del database restano dei veri e propri rifiuti che si accumulano fino a sovraccaricarlo.

Inutile dire quanto un database pieno di dati inutili possa rallentare il tuo sito. Perciò, di tanto in tanto, occorre fare pulizia e mettere ordine.

Anche in questo caso, se non si hanno le competenze per farlo manualmente, i plugin di ottimizzazione ti offrono un prezioso aiuto.

6. La cache fa la differenza

La cache è un sistema di archiviazione che può aumentare considerevolmente la velocità del sito web. Si tratta infatti di un sistema tramite il quale è possibile fornire al visitatore una versione precaricata del sito salvata in memoria, senza dover fare quindi troppe richieste al server.

In genere i migliori servizi hosting includono anche un sistema di cache e, in caso contrario, è comunque possibile installare un apposito plugin.

7. Immagini: occhio alle dimensioni e ai formati

Infine, anche se ormai tutti prediligiamo siti web visivamente accattivanti con molte immagini, non puoi pensare di prendere una foto e caricarla sul sito senza le dovute accortezze.

E’ necessario innanzi tutto controllare la grandezza dell’immagine e se è troppo grande, diciamo ben al di sopra di 100 kb, è il caso di comprimerla, ossia ridurne le dimensioni.

Ci sono molti tool online che ti permettono di comprimere le immagini prima di caricarle su WordPress e gli stessi plugin di ottimizzazione possono fare un buon lavoro in tal senso ma anche oltre. I plugin di ottimizzazione possono infatti aiutarti ad impostare 2 funzioni molto utili:

  • il Leazy Loading, ossia il caricamento ritardato delle immagini che non si trovano nella parte superiore della pagina, cioè quella che il visitatore vede per prima, in modo da rendere più efficiente il caricamento della pagina;
  • la conversione delle immagini nei formati più moderni, ossia la possibilità di convertire i formati più comuni come PNG e JPEG in formati più efficienti come il WebP supportato da alcuni browser.

Conclusioni

Se vuoi che il tuo sito sia funzionale ai tuoi obiettivi di business non puoi trascurare questi fattori. Mi rendo conto che può essere complicato gestire questi aspetti e che si può avere il timore di sbagliare e creare ancora più danni.

Effettivamente sono questioni delicate da non prendere alla leggera, per cui se non si ha voglia o tempo di approfondire è meglio non improvvisarsi.

Tuttavia, capire quali sono i fattori cruciali per ottenere un sito WordPress veloce è un primo passo per chiedere aiuto ed interfacciarti con maggiore consapevolezza con un professionista o con il tuo team del reparto IT.

Vuoi realizzare un nuovo sito web per la tua attività?
Scopri cosa posso fare per te!

Sofia Silva Fonseca

Sono una web strategist freelance di base a Roma. Accompagno imprese e professionisti a crescere online in modo razionale! Cioé senza lasciare nulla al caso, né a fantomatiche formule magiche o scorciatoie, ma compiendo i passi giusti e personalizzati, secondo una visione di insieme funzionale a raggiungere i propri obiettivi di business.

Questo articolo ha 2 commenti

  1. Luca Anedda

    Veramente molto interessante e completo. Facile da capire anche per chi ha poca dimestichezza.

Lascia un commento