Come migliorare le prestazioni di WordPress (aggiornato Aprile 2017)

da | Apr 28, 2017 | Guide WordPress | 2 commenti

Migliorare le prestazioni di WordPress e una delle cose più importanti che puoi fare per il tuo sito web.

Nel 2016 ho svolto un ruolo importante nella squadra di professionisti che lavorava alla realizzazione di un sito web per un cliente molto importante.

Questo sito è ancora oggi un successo, ma nonostante tutto il nostro lavoro ultimamente è diventato molto lento.

Il database è appesantito da tabelle inutili e ci sono alcune pagine che richiedono fino a 26 secondi per il caricamento a causa del numero di immagini presenti e di altre richieste inviate al server.

Insieme al team abbiamo deciso che era giunto il momento di fare qualcosa a riguardo e recentemente abbiamo ricostruito il sito.

Abbiamo applicato tecniche collaudate che ci hanno permesso di abbassare il tempo di caricamento a circa 2 secondi sulle pagine più complesse e a soli 800 millisecondi sulle pagine più semplici .

Di seguito sono elencate le pratiche che abbiamo usato per quel particolare sito, e che, se seguirai con attenzione, sono in grado di migliorare notevolmente anche il tempo di caricamento del tuo sito web, sia in termini di velocità generale sia per i miglioramenti connessi allo sviluppo.

Questo non è solo un articolo del tipo ” X consigli per migliorare le prestazioni del tuo sito web”.

Questa è la guida definitiva per migliorare le prestazioni del tuo sito web e passo dopo passo andremo a descrivere ognuno dei singoli aspetti che vanno presi in considerazione per ottimizzare e velocizzare un sito web realizzato con WordPress.

[toc]

Perché la velocità di caricamento è importante

Se il tuo sito web è la tua fonte principale di guadagno, saprai di certo che le prestazioni e la velocità di caricamento sono 2 cose che non puoi permetterti di ignorare.

Abbiamo unito una serie di ricerche in una semplice infografica che mostra come aggiungendo 1 secondo in più al tempo di caricamento di un sito web, si provoca una perdita di circa il 7% nelle conversioni, con un 11% in meno di pagine visitate e una diminuzione del 16% in termini di soddisfazione dell’utente/cliente.

Quindi, tenendo conto di queste informazioni, possiamo dire che riducendo la velocità di caricamento del tuo sito web di 1 secondo, potrai ottenere facilmente un aumento del 7% circa nei tuoi profitti.

Una pagina web può essere caricata in 2 secondi da un visitatore di New York, in 2,5 secondi da un tuo amico in Francia e in 4-5 secondi da qualcuno in India.

Continuando a ottimizzare potresti abbassare il tempo di caricamento per per chi si collega dagli Stati Uniti di 0.3 secondi, e nello stesso tempo abbassare anche di 1.8 secondi per chi si collega dall’India, ottenendo un notevole aumento di conversioni.

Non dimenticare che il web è molto vasto e che ogni numero indicato è una media, inoltre ogni numero che vedi nelle tue prove personali è soltanto un singolo campione di un insieme molto diversificato.

Oltre a tutti i benefici diretti, è un fatto molto noto che la velocità di caricamento di una pagina ha un grande impatto sulla SEO del tuo sito web. Google è stato volutamente vago sulle specifiche, ma alcune ricerche fanno luce sulle varie correlazioni.

Una cosa è certa: una migliore velocità di caricamento = valore più alto agli occhi di Google.

Se sei un persona che pensa all’ambiente puoi anche considerare questo come un esercizio per ridurre le emissioni di anidride carbonica.

Un sito web più veloce è di solito il risultato di un minor tempo di elaborazione, un minor numero di richieste e un consumo di dati ridotto.

Il che significa che i computer (server) che gestiscono il tuo sito web, lavorano di meno riducendo la loro produzione di calore che a sua volta significa una minore necessità di raffreddamento.

Ovviamente l’effetto è quasi impossibile da notare su un solo server o sito web e andrebbe misurato su un numero più alto di server.

Come iniziare

Questa guida è stata divisa in 3 parti.

All’inizio parleremo di alcune considerazioni di carattere generale e cercheremo di farti capire i vari problemi che si possono presentare.

Le due sezioni successive si concentrano sui miglioramenti che qualsiasi utente può implementare e sui miglioramenti per gli utenti che sono più pratici con l’utilizzo di linguaggi di programmazione.

Ci sarà una certa sovrapposizione in queste ultime due sezioni, perciò ti invitiamo ad esaminarle entrambe anche se non sei un programmatore.

Molte delle tattiche utilizzate per migliorare le prestazioni e la velocità di caricamento, possono essere implementate seguendo semplici guide, anche se ci sono porzioni di codice da utilizzare.

Alla fine speriamo che, grazie a questa nostra guida, sarai in grado di mettere in pratica almeno un paio di idee e applicarle immediatamente per rendere il web un posto più veloce per tutti noi.

Perché è lento un sito web?

Dare una risposta a questa domanda è la chiave per prendere delle decisioni intelligenti a riguardo.

C’è una grande differenza tra un sito web lento che utilizza un hosting (server) a basso costo, e un sito web lento dove vengono caricate immagini enormi, o ancora peggio, viene utilizzato del codice poco efficiente.

Nota: La seguente lista contiene elementi che non sempre possono essere “corretti”. Faremo quindi un elenco di tutti i fattori che andranno a incidere sulla velocità di caricamento.

Più tardi il nostro lavoro sarà di andare ad ottimizzare questa velocità di caricamento, ma per adesso, limitiamoci a conoscere i vari pezzi del puzzle.

1. La tecnologia di base

Il linguaggio e la tecnologia di base utilizzata per visualizzare il tuo sito web determina la velocità con la quale il server elabora il codice.

Se viene utilizzato soltanto HTML allora si tratta di un problema veramente minore, ma la maggior parte dei siti web utilizzano anche linguaggi di programmazione lato server.

È possibile utilizzare ASP.net, PHP o anche HHVM per eseguire codice PHP.

Non c’è molto su cui intervenire, per un comune mortale, nel tentativo di aumentare la velocità dei linguaggi base.

HHVM ha iniziato superando PHP subito dopo il suo rilascio.

Le due tecnologie hanno iniziato ad alternarsi in una guerra, seppur in forma amichevole.

Ora sembra che la nuova versione PHP 7 sorpasserà in prestazioni HHVM che speriamo migliorerà a sua volta ulteriormente.

Questa battaglia tra le due tecnologie porterà solo vantaggi a noi utenti finali.

La configurazione del server, per esempio, è una delle cose più importanti e può fare veramente la differenza quando si va a lavorare per migliorare la velocità di caricamento.

Per esempio i server possono essere configurati per inviare i dati in formato compresso, utilizzando appunto una tecnica nota come compressione gzip.

La compressione gzip è uno dei metodi di compressione più conosciuti ed efficace, per le applicazioni web. Questo tipo di compressione, riduce la dimensione di risposta di circa il 70%.

Questa è una semplice impostazione che puoi attivare o disattivare, e ovviamente attivando la compressione gzip migliorerà la velocità di caricamento, ma vedremo alcune di queste tecniche più avanti.

2. Sistema per la gestione dei contenuti (CMS)

In generale qualunque piattaforma di gestione dei contenuti, meglio nota con l’acronimo CMS , Content Management System, sarà più lenta di un sito HTML statico realizzato in modo adeguato.

Mentre è vero che avere un sistema di cache può ridurre al minimo le differenze di velocità, queste memorie temporanee per aggiornarsi hanno anche bisogno di essere svuotate.

Detto ciò, un sistema CMS ben realizzato avrà molti più vantaggi che svantaggi.

Sarà più sicuro, sarai in grado di aggiungere contenuti molto più facilmente e avrai a disposizione una tonnellata di funzionalità che si potranno aggiungere in ogni momento.

Tutti i sistemi CMS noti rientrano in questa categoria “ben-fatto”, di cui fanno quindi parte WordPress, Joomla e Drupal, che infatti sono ottimi dal punto di vista della velocità.

I problemi di velocità possono essere più comuni in alcuni sistemi rispetto ad altri.

Questo di solito ha a che fare con il codice aggiuntivo utilizzato, come temi, plugin, estensioni e così via. Daremo uno sguardo a questi elementi più avanti.

La ragione per cui i CMS sono più lenti dei siti web statici realizzati in HTML è che i CMS hanno bisogno di connettersi a un server, dopodiché il server deve elaborare una richiesta, generare il codice HTML e inviarlo al vostro browser.

Durante la lavorazione ci possono essere molte richieste al database, che aumentano a loro volta i tempi di caricamento.

La maggior parte dei sistemi hanno meccanismi per ottimizzare questo processo ed è questo il motivo per cui i siti web tendono a caricarsi in almeno un paio di secondi.

3. Estensioni

Il termine estensioni qui si intende in senso generale, ovvero tutto il codice che viene utilizzato in aggiunta al codice del CMS.

Per WordPress, questo significa temi e plugin, per Joomla e Drupal si tratta di template ed estensioni.

Molto spesso temi e plugin non sono creati dalle stesse persone che hanno realizzato il CMS.

Ciò significa che se gli sviluppatori non sono aggiornati sulle ultime pratiche per le prestazioni e velocità di caricamento, faranno degli errori.

Per esempio, se si pensa ai bisogni da soddisfare riferendosi solo ai dati, si può arrivare a interrogare il database soltanto una volta durante un’ operazione.

Se invece non si riflette e si scrive soltanto il codice per ottenere il risultato desiderato, si può arrivare a interrogare il database ben tre volte.

Infatti, a seconda delle esigenze, tre richieste al database possono essere molto più veloci di una sola, quindi è molto importante scegliere attentamente i metodi da utilizzare.

Con WordPress i punti negativi da risolvere risultano più evidenziati grazie al fatto che la comunità è molto aperta.

Questo è un aspetto meraviglioso di WordPress e non dovrebbe essere mai cambiato, anche se hai i suoi svantaggi.

È veramente facile contribuire con il codice sbagliato e nulla può fermarti dal creare un tema scritto in maniera terribile per poi addirittura venderlo.

4. Server e Hosting

Il tuo server ha un ruolo molto importante nel determinare la velocità di un sito web, in particolare durante i periodi di traffico elevato.

Cerchiamo prima di tutto di separare questi due termini e poi di imparare un po’ di più su come entrambi influenzano la velocità di caricamento di un sito web.

Il server è un computer fisso collocato da qualche parte nel mondo che ha proprietà simili al tuo computer di casa.

Ha memoria, un processore, spazio su disco rigido e altre caratteristiche che determinano il modo in cui funziona.

Il tuo piano di hosting è essenzialmente un pacchetto di servizi legati a un server.

Ciò include cose come backup automatici, la gestione dei server e così via.

Per il nostro scopo il fattore più importante di un piano di hosting è se stai utilizzando un piano ‘shared’ (condiviso), una VPS ( virtual private server) o un server dedicato.

4a. Shared, VPS e server dedicati

Questi tre termini rappresentano diversi tipi di metodologie di hosting. Per spiegarlo in poche parole, essi determinano quante persone utilizzano contemporaneamente lo stesso server per il loro sito web.

  • Su un servizio di hosting condiviso ci sono centinaia di persone come te su un singolo server e ciò significa che centinaia di persone condividono lo stesso spazio su disco, la memoria, la velocità dei processori e la larghezza di banda. Le risorse non sono condivise in modo uniforme: un sito difettoso può utilizzare l’80% delle risorse di un server lasciando agli altri utenti il restante 20%.
  • Un VPS (server privato virtuale) è anche questo condiviso, ma da un numero minore di persone e le risorse sono distribuite in maniera uniforme. Se ci sono 5 utenti sullo stesso server ognuno ottiene il 20% delle risorse. Se il sito di un utente richiede più del 20% delle risorse il suo VPS può fallire e il sito web diventerà non raggiungibile, mentre i siti web degli altri 4 VPS resteranno indenni.
  • Su un server dedicato tu sei l’unico utente e tutte le risorse sono a tua disposizione. Questo eliminerà del tutto l’effetto dei “cattivi vicini”.

5. Parametri del server

Come abbiamo già detto, il server su quale alloggia il tuo sito web, ha alcune proprietà fondamentali che determineranno la sua velocità.

In sostanza, più alte sono le prestazioni del server meglio si comporterà il tuo sito web.

Ovviamente c’è un limite anche per questo.

Se hai un piccolo sito web realizzato con WordPress che riceve intorno a 5000 visite al mese non cambierà tanto se il tuo server ha 1GB di RAM o 8GB di RAM.

Parleremo in seguito delle cose che si possono fare per migliorare la velocità di caricamento del tuo sito web.

Un’altra proprietà del server che può influire sulla velocità di caricamento è la posizione del server. Questo mi sembra abbastanza logico.

Se il tuo server si trova negli Stati Uniti e il tuo sito web ha come target utenti in Italia allora ci metterà molto di più a caricare rispetto a un sito web su un server in Europa o addirittura in Italia.

I dati viaggiano a velocità assurde, raggiungendo quasi la velocità della luce, ma tieni presente che una volta che si avvicinano, rallentano alla velocità del tuo provider; la connessione ha inoltre bisogno di passare firewall, router e altre cose che di solito li rallentano ulteriormente un po’.

La distanza tende ad influenzare la velocità con cui si fanno le richieste al server; scaricare un file di 1GB dagli Stati Uniti richiederebbe quasi lo stesso tempo che serve per scaricarlo dall’Italia, però scaricare 1024 file da 1MB richiede molto più tempo semplicemente perché ci sono 1024 richieste di connessione in contemporanea.

Perché il numero di richieste al server è importante?

Perché quando si carica un sito web, questo può fare un elevato numero di richieste per scaricare fogli di stile, immagini, file javascript e altro. Ridurre al minimo, o semplicemente, minimizzare il numero di richieste può incrementare la velocità di caricamento.

6. Il computer dell’utente

L’età del computer che si sta utilizzando può influenzare notevolmente la velocità di caricamento di un sito web.

“Ho un vecchio laptop Toshiba che ormai ha quasi 8 anni e su questo dispositivo la velocità di caricamento è molto più lenta che sul Sony Vaio che sto utilizzando adesso e che ha nemmeno 1 anno di vita”.

Con il passare del tempo i componenti non lavorano più bene e questo si traduce in tempi di risposta più lenti, utilizzo di memoria meno efficiente e quindi elaborazione dei contenuti più lenta.

Fino a non molto tempo fa questo non era un problema perché la gran parte del lavoro avveniva sui server. Con l’arrivo delle nuove tecnologie i siti internet hanno bisogno di utilizzare il potere di calcolo dei dispositivi su quali vengono visualizzati.

Questo significa, ad esempio, che ci saranno animazioni più scorrevoli, ma allo stesso tempo i dispositivi più vecchi non potranno tenere il passo.

In conclusione la velocità di caricamento di un sito web dipende dai seguenti fattori:

  • La tecnologia utilizzata per realizzare il sito web.
  • Gli contenuti che saranno presenti sul sito.
  • Il CMS utilizzato per la realizzazione.
  • Il hosting ( condiviso, VPS o server dedicato).
  • Il dispositivo sul quale viene visualizzato.

Come diminuire la velocità di caricamento del tuo sito web

All’inizio dell’articolo abbiamo promesso che esamineremo l’argomento da 2 punti di vista diversi: i metodi per gli sviluppatori e i metodi per i non sviluppatori.

Tieni presente, però, che questo non significa che tutti i metodi per i non sviluppatori saranno facili da implementare.

Iniziamo.

Aumento della velocità generale

Per metodi di miglioramento generale intendiamo tutto ciò che si può fare con o senza piccole modifiche al codice del sito web (temi e plugin). Potrebbe essere necessario modificare alcuni file del tuo server e utilizzare comandi nel terminale.

In generale queste modifiche non vengono fatte dal tuo sviluppatore; questo ovviamente se non hai qualcuno che se ne intende di gestione hosting e server in casa.

Se non hai minimamente idea di come fare o semplicemente non hai il tempo da impiegare in queste attività ti ricordo che noi di TuttoWP offriamo servizi di assistenza, manutenzione e gestione di siti web realizzati con WordPress. Oltre a questo offriamo anche interventi singoli che hanno lo scopo di risolvere problemi individuali di ogni tipo e genere.

1.Aggiornare le tecnologie principali

Il 99.9999% di noi non sarà in grado di ottimizzare il PHP, ma possiamo comunque assicuraci che questo sia sempre aggiornato all’ultima versione stabile.

Molti server di fascia bassa aggiorneranno la versione di PHP se gli viene richiesto ma non lo faranno quasi mai in maniera automatica.

Se dai un occhio all’immagine qui sotto potrai capire perché è importante avere sempre l’ultima versione stabile sul tuo server.

php-benchmark

Come puoi vedere, aggiornare la versione di PHP, può avere un impatto enorme sulla velocità di caricamento, sopratutto con l’ultima versione PHP 7 che al momento e PHP 7.1.3.

Fai attenzione con la versione PHP 7 perche non tutti i temi e plugin sono compatibili e potresti riscontrare problemi.

Ogni hosting avrà diversi modi per aggiornare la versione PHP. Generalmente dopo avere eseguito l’accesso al panello di controllo dell’ hosting ci sarà una voce ” Configurazione PHP”.

E’ inoltre possibile trovare già una casella di selezione che ti consente di scegliere fra varie versioni diverse. Se non riesci a trovare sul tuo pannello di controllo l’opzione per aggiornare il PHP, chiedi al tuo hosting, loro sapranno sicuramente darti più informazioni.

Attualmente l’ultima versione stabile è la 5.6.18, per PHP 7 l’ultima versione stabile è la 7.1.3. Potrai trovare più informazioni su questa pagina.

2. Aggiorna il tuo CMS

Questo dovresti farlo in ogni caso, e non dovremmo essere noi a dirtelo, ma lo ripetiamo perché facendo dei lavori, abbiamo trovato siti web che utilizzano ancora la versione 3.5 di WordPress che è ormai vecchia di quasi 4 anni.

Gli aggiornamenti generalmente non aumentano la velocità di caricamento, ma risolvono problemi di sicurezza e quindi avere sempre l’ultima versione ufficiale ti può far risparmiare tantissimi problemi.

I problemi di sicurezza possono portare a iniezioni di codice dannoso, che a sua volta, può rendere il sito web più lento, o addirittura portare nel tempo a un totale arresto del sito web.

Inoltre gli aggiornamenti tendono ad ottimizzare il sistema consentendo la scrittura del codice in maniera più efficace.

Di conseguenza la base di dati sarà meno affollata, le richieste saranno più veloci e tutto ciò si trasformerà in un piccolo aumento della velocità di caricamento.

Puoi approfondire l’argomento leggendo la pagina dedicata agli aggiornamenti sul codex di WordPress.

3. Diminuisci il numero di richieste

Questo è qualcosa che andremo a rivisitare nella sezione degli sviluppatori perchè è molto più facile da risolvere durante la scrittura del codice per un tema o un plugin. Ci sono alcune cose però che puoi fare come utente.

Prima di tutto bisogna capire il numero di richieste che un sito web fa per un completo caricamento.

Ci sono vari strumenti, come per esempio il tool di sviluppo del browser, oppure è possibile utilizzare Pingdom che è uno strumento web che ti può dare una bella panoramica.

L’unica cosa che devi far attenzione e di scegliere il server più vicino al mercato dove vai a operare. Nel nostro caso il nostro mercato e Italia e il server più vicino da dove eseguire il test e Stockholm.

Un’altro strumento che puoi usare e GTmetrix che come Pingdoom ti può dare un idea sulle prestazioni e sui tempi di caricamento di un sito web. Con questo la scelta della posizione da dove eseguire il test e disponibile solo per gli utenti registrati (la registrazione e gratuita).

A differenza di Pingdoom con Gtmetrix possiamo eseguire un test da Londra (locazione più vicina all’Italia).

 

Ci sono anche altri servizi e strumenti (es. https://www.webpagetest.org/) utili per fare un’analisi che ti aiuta a scoprire dove mettere le mani per migliorare la velocità di caricamento del tuo sito web.

Ritorniamo alla diminuzione delle richieste.

Quando aggiungi contenuti al tuo sito web stai incrementando le richieste con l’aggiunta di immagini o altri file multimediali.

In poche parole 1 immagine aggiunge 1 richiesta aggiuntiva. Se aggiungi gallerie alle tue pagine si può facilmente arrivare a ben 50-60 richieste per pagina.

Se sei un fotografo, un artista o semplicemente qualcuno che ama le immagini, aggiungere tutte le tue foto senza dover scegliere quali aggiungere o quali no puo portare a dei tempi di caricamento molto grandi.

Diminuire il numero di articoli per pagina può essere un’ottima cosa per la velocità di caricamento.

Per farlo vai nelle impostazioni di lettura in WordPress ( Impostazioni > Lettura dalla tua area di amministrazione) e cambia il numero nella sezione “Le pagine del blog visualizzano al massimo” dove nel nostro caso al momento il numero e 10.

diminuire-articoli

Considera inoltre la rimozione di plugin inutili e sopratutto quelli che influiscono sul caricamento del front-end del tuo sito web.

Molti plugin aggiungono i loro fogli di stile e script, disabilitandoli risparmi almeno 1-2 richieste se il plugin utilizza codice ottimizzato, e ben 7-8 richieste se il plugin non utilizza codice ottimizzato.

Cambiare il tema può aiutarti a risparmiare sul numero di richieste, ma in molti casi questo non è possibile.

Abbiamo notato che i temi premium –  in particolare quelli che offrono tutte le caratteristiche e funzionalità possibili – tendono a caricare troppi fogli di stile e script inutilmente.

Il lazy loading per le immagini è una tecnica molto potente e può far sembrare il tuo sito molto più veloce di quello che è realmente.

In realtà non diminuisci il numero di richieste però blocchi il caricamento delle immagini che appaiono nella parte bassa della pagina fino a che l’ utente non scorre giù per vederle realmente.

Quindi utilizzare il lazy loading può aiutarti un bel po’ se hai tante immagini sulle tue pagine.

Qui ti lascio 2 dei plugin che io ho usato per attivare il Lazy Loading e che hanno funzionato senza creare ulteriori problemi.

Come sempre fai le tue prove e vedi quello che funziona meglio per te.

Puoi scaricare il plugin Lazy Load da qui.

Il plugin Lazy Load non potrebbe essere piu facile da usare – tutto cio che devi fare e installarlo e attivarlo. Non ci sono impostazioni o configurazioni da modificare. Questo plugin funziona.

Usa jQuery.sonar per caricare un’immagine soltanto quando questa e visibile sullo schermo. Ti potrebbe interessare sapere che questo plugin e il risultato di un lavoro di squadra fra il team di WordPress.com VIP, il team del design di TechCrunch e Jake Goldman da 10up (un’agenzia di consulenze per WordPress).

Puoi scaricare il plugin Bj Lazy Load da qui.

A differenza del plugin Lazy Load che non ha impostazioni, questo ha qualche impostazione semplice che ti permette di configurare il modo in qui lavora.

Siccome questo plugin funziona anche con gli iFrame, può abilitare il lazy loading anche per video di Youtube Vimeo, etc.

Come sempre fai attenzione ai plugin che installi e verifica sempre la loro provenienza.

La concatenazione è uno dei metodi migliori per ridurre le richieste. In pratica funziona cosi:

Invece di caricare 10 file javascript è possibile fare un copia incolla del contenuto dei file in un solo file. Ciò significa che invece di dover fare 10 richieste per scaricare 10 file javascript di 20kb ognuno farà una sola richiesta per scaricare un singolo file della dimensione di 200kb circa.

Questo è molto facile da implementare mentre si realizza il sito web, è molto più difficile se si interviene dopo.

Ci sono alcuni plugin come : Merge + Minfy + Refresh, Dependecy Minification, che aiutano un po’ ad automatizzare il processo ma non funzionano sempre, bisogna fare le prove con ogni sito e intervenire in base ai risultati.

Noi del team odiamo in modo particolare gli articoli che usano la paginazione per aumentare le visualizzazioni, ma in alcuni casi può essere molto utile per dividere un articolo in più pagine.

Per favore non utilizzare questa tecnica per incrementare le visualizzazioni dei tuoi articoli.

Mentre se hai un articolo che elenca i tuoi 500 alberghi preferiti con immagini, potrebbe essere una buona idea dividerlo in sezioni (pagine con 25-50 alberghi per ogni pagina).

4. Rimuovi i plugin non necessari

I plugin non solo aumentano il numero di richieste fatte per il caricamento di una pagina, ma possono anche dare problemi di sicurezza o usare in modo eccessivo memoria RAM sul tuo server.

P3 (Plugin Performance Profiler) è un plugin che ti può aiutare a scoprire i plugin che aumentano la velocità di caricamento del tuo sito web.

Noi personalmente usiamo molto spesso Regenerate Thumbnails, Theme Check e P3, sono plugin molto utili quando vengono utilizzati; mentre quando non li usiamo li disabilitiamo così non avranno nessun impatto sulla velocità di caricamento del nostro sito web.

5. Rimuovere elementi di design inutili

Ci sono veramente tanti elementi di design che sul sito sono bellissimi da vedere, ma che in realtà, non portano ad un vero miglioramento. Ecco 2 esempi:

1°- Parliamo degli elementi che creano frustrazione; supponiamo tu abbia un menu per gli utenti che si apre e si chiude con un’ animazione bellissima quando la freccina del mouse ci va sopra.

Quando un utente lo vede per la prima volta penserà che è una cosa bellissima, ma dopo che lo utilizza 5-10 volte, inizierà a sentirsi frustrato semplicemente perché ogni volta deve aspettare 1 secondo per l’ apertura del menu e 1 secondo per la sua chiusura.

Generalmente questi problemi sono causati da chi realizza e gestisce il sito web, perchè non ha fatto delle prove su come gli utenti utilizzano il sito web.

Assicurati di dare ai tuoi utenti un’ esperienza fluida e facile da utilizzare, e non bellissima da vedere ma che a lungo termine diventa frustrante.

Oltre agli aspetti visuali, avendo meno elementi da animare e meno Javascript da caricare, il tuo sito web si caricherà in maniera molto più veloce.

2°- Parliamo di efficienza e conversioni; il nostro esempio preferito qui sono le sliders. Quasi tutti gli articoli di ricerca arrivano allo stesso risultato: gli sliders sono brutti, utilizzano troppo spazio, non aiutano il SEO e sopratutto aumentano la velocità di caricamento del tuo sito.

Leggi qui perché non è consigliabile utilizzare uno slider su WordPress.

Voglio sottolineare che per un sito web lo scopo non è essere il più bello, ma portare i visitatori ad acquistare, iscriversi, etc.

Ricordati che in alcuni casi la rimozione dello slider è ok, in altri dovrai mettere qualche altro elemento al suo posto.

Rimuovere lo slider può portare a tassi di conversione minori, rimpiazzare lo slider con del testo e dei tasti può aumentare il tasso di conversione molto di più.

Ricorda sempre di fare le tue prove e non dare mai per scontato ciò che senti dire. In questi casi un test A/B può aiutarti tantissimo.

6. Utilizza una CDN

Per noi una CDN è essenziale per 2 motivi, ci permette di tenere i nostri file media nel “cloud” e diminuisce di conseguenza il tempo per il caricamento di questi file.

Ma torniamo alla velocità di caricamento.

L’idea dietro una CDN, Content Deliver Network , è di portare le risorse più vicino a chi le richiede.

Ad  esempio, un nostro sito web è su un server negli Stati Uniti; quando un utente guarda il nostro sito web in Australia, le immagini e tutti i file media vengono caricati dal server della CDN in Australia, riducendo i tempi di caricamento.

Allo stesso modo, un altro utente che accede al nostro sito da Budapest, riceverà le immagini dal server della CDN più vicino a lui, Berlino per esempio.

Ridurre i tempi di trasferimento rende dunque il nostro sito web più veloce.

7. Abilita e configura la cache

Attivare la cache è il metodo più utilizzato e molte volte viene abilitato per primo perché porta miglioramenti significanti per la velocità di caricamento.

Il funzionamento della cache può essere compreso facendo una piccola analogia: ti ricordi quando hai imparato per la prima volta le addizioni a scuola?

Dovevi sommare 5 + 4 e utilizzavi le dita delle mani per contare.

Scommettiamo che oggi ti sei ricordato la risposta senza dover contare di nuovo sulle ditta. In poche parole il tuo cervello si è ricordato che 5 + 4 = 9 e non ha dovuto fare tutto il processo di nuovo. La cache funziona più o meno allo stesso modo.

Con i siti web la cosa è un pochino più complicata, ma non troppo. Ecco perché:

Immagina un sito web che mostri soltanto il nome e l’anno; il contenuto del sito web cambierà una volta all’anno, ma ogni volta che il sito web viene caricato il server fa dei calcoli per determinare che anno mostrare.

Quello che la cache fa è di salvare una copia HTML del tuo sito per un certo periodo, nel nostro esempio qui sopra possiamo impostare che la cache decada una volta al giorno.

Questo significa che una volta al giorno il sito web si carica normalmente: il server riceve la richiesta e la elabora, poi mostra il HTML della pagina e alla fine salva il HTML nella memoria.

La prossima volta che qualcuno carica la pagina, questa viene mostrata dalla memoria, cioè il file HTML che ha precedentemente salvato, e non ce più bisogno di elaborare la richiesta.

Non è molto per un sito web così semplice, ma su un sito web normale la cache può aiutarti a migliorare il tempo di caricamento di qualche secondo.

Quello che abbiamo descritto è la cache per una pagina completa, ma devi sapere che ci sono molti altri tipi di cache. Se utilizzi WordPress, puoi iniziare a sfruttare la cache per il tuo sito web molto velocemente e senza grandi problemi.

I principali plugin per la cache sono W3 Total Cache e WP Super Cache che sono anche gratuiti. Ti suggeriamo di leggere qualche articolo su come impostarli così da non avere problemi con il processo.

Se non sai dove guardare ecco qui una guida su come configurare e usare W3 Total Cache sul blog di Yith:

Velocizzare WordPress con il plugin W3 Total cache parte 1

Velocizzare WordPress con il plugin W3 Total cache parte 2

8. Ottimizza la tua base di dati

Con il passare del tempo la tua base di dati accumulerà del peso morto, dati che non sono più utilizzati.

Questi dati possono arrivare da plugin che hai rimosso, revisioni non rimosse, utenti cancellati, campi personalizzati, commenti spam e non approvati e così via.

Ci sono vari modi per pulire e ottimizzare la base di dati, quello più semplice è utilizzare un plugin tipo WP-Optimize che ti permette di pulire e ottimizzare la tua base di dati senza eseguire lavori all’interno di phpMyAdmin.

9. Ottimizza le tue immagini. 

Abbiamo già parlato di utilizzare meno immagini, ora concentriamoci su quelle che invece devi utilizzare per forza.

Ottimizzando le tue immagini puoi diminuire la loro dimensione del 30%-80% senza grandi perdite di qualità, molte volte le perdite non sono visibili a occhio nudo.

Per ottimizzare le nostre immagini utilizziamo 3 tool.

Il primo, su Windows, è RIOT e ci permette di ottimizzare le nostre immagini in bulk, cioè in massa; il secondo è un plugin per WordPress chiamato EWWW Image Optimizer, gratuito, che ottimizza le immagini quando le carichi sul tuo sito web in automatico. Il terzo e ImageOptim (per Mac) che si assomiglia molto a RIOT perche permette di ottimizzare le immagini in bulk.

Se vuoi approfondire di più questo argomento leggi questo articolo su come ottimizzare le tue immagini in 4 semplici passi.

10. Abilita la compressione Gzip

La compressione Gzip è un altro metodo che aiuta tantissimo a migliorare la velocità di caricamento del tuo sito web.

In pratica comprime quasi tutto ciò che viene inviato dal server al browser dell’ utente. Questo bisogna impostarlo a lato server, ovvero sul computer dell’hosting.

Guarda questo articolo su come abilitare la compresione gzip sul sito di overclokk.net

Il motivo per cui la compressione aiuta tantissimo è che i file CSS e HTML usano un sacco di stringhe che si ripetono. Più le stringe si ripetono, meglio potrà essere compresso.

Ecco un esempio per chiarire: ipotizziamo che nel codice del tuo sito web ci sia scritto 100 volte ” Io sono Giovanni”; potresti rimpiazzare la scritta con “12g” risparmiando così un sacco di spazio.

La compressione fa proprio questo, prende le stringhe che si ripetono e assegna loro una stringa di codice, dove il server sa che quella stringa di codice “12g” è in realtà ” Io sono Giovanni”.

11: Disabilita l’ hotlinking

Questo non porterà grandi miglioramenti per il caricamento del tuo sito web però toglierà del carico inutile al tuo server, sopratutto se il tuo sito web è un po’ conosciuto.

Con il hotlinking infatti un sito web mostra le immagini dal tuo sito senza scaricarle e caricarle sul proprio server.

In pratica usa la tua banda per mostrare le immagini, un pò come usare la rete Wifi di qualcun’altro.

Per fortuna questo può essere evitato con qualche aggiunta al tuo file .htaccess.

Leggi qui come disabilitare il hotlinking.

12. Scegliere un buon servizio di hosting

Non ci dilungheremo molto a parlare della scelta del servizio di hosting, anche perché questo va fatto in base alle necessità, disponibilità finanziaria ed esperienza.

Sappiamo che in molti usano gli hosting condivisi semplicemente perché non costano tanto e offrono comunque un servizio abbastanza buono se si tratta di un sito web che non ha bisogno di tante risorse.

Abbiamo anche sentito parlare molto bene di Siteground anche se noi personalmente non l’abbiamo ancora utilizzato e qui a seguire ti dico anche il motivo.

Se io voglio provare il servizio quindi acquistare solo 1 mese devo pagare un quota di attivazione di 20 Euro cosa che non mi sembra normale anche se hanno delle garanzie soddisfatti o rimborsati.

L’unica cosa che ti dico e di fare attenzione a quando fai le tue ricerche sul web a riguardo del hosting da scegliere.

Nel 90% dei casi troverai persone che fanno da affiliati (guadagnano dei soldi ogni volta che qualcuno si iscrive usando il loro link o codice).

Quindi questi qui (gli affilati) ti diranno sempre che “e la migliore azienda che hanno provato, etc, bla bla, bla bla e ancora bla bla”.

Il loro scopo e di farti iscrivere per prendere la commissione e non di fare una analisi giusta e corretta.

Finiamo qui con la scelta dell’ hosting anche perché noi utilizziamo delle semplici VPS che configuriamo in base alle necessità che abbiamo per ogni sito web.

Per esempio, questo sito web è su una VPS con 4GB di RAM, 4 processori e 100GB di spazio su disco SSD e ci costa circa 6$ al mese.

13. Monitora il tuo sito web

Questo non migliorerà la velocità di caricamento del tuo sito web però ti avviserà ogni volta che c’e qualcosa che non va con il tuo sito così da poter rimediare subito senza prolungare il disservizio ai tuoi utenti.

Ci sono strumenti per il monitoraggio dei domini come Pingdom o Uptime Robot. Noi li utilizziamo entrambi per molti dei nostri siti web.

Consigli per gli sviluppatori

Ecco un paio di consigli che gli sviluppatori possono mettere in pratica per assicurarsi che i progetti su cui lavorano non avranno problemi con la velocità di caricamento.

1. Conosci i tuoi strumenti

Questo sembra un consiglio semplice ma la verità è che sono veramente pochi gli sviluppatori che conoscono veramente il suo significato.

Non è possibile che tu possa conoscere tutto su qualcosa di così grande come WordPress.

Lascia che ti mostriamo il nostro esempio preferito.  Hai mai dovuto fare pull per un grosso numero di campi meta per un post? Molto probabilmente utilizzando get_post_meta() 20 volte uno dietro l’altro?

Penserai che questo sia uno spreco perché sembra che tu stia facendo 20 richieste diverse alla base di dati, pero non e cosi.

Abbiamo anche visto persone che usano la classe WPDB per prendere direttamente tutti i meta del post per poi usare funzioni array per sistemarli ed estrarre i meta di cui hanno bisogno.

Apprezziamo l’intenzione, però non è proprio il caso.

La prima volta che viene usato get_post_meta() questo raccoglie tutti i meta da solo e li salva nella cache. Ogni nuova richiesta per lo stesso post prenderà i dati dalla cache e non dalla base di dati.

Prima di prendere decisioni come quella di utilizzare la classe WPDB assicurati di aver consultato il codex di WordPress e di aver letto tutti i materiali correlati. Non fare il “so tutto io” e informati.

2. Diminuisci le richieste

Eccoci di nuovo qui con le richieste. Come sviluppatore questo è di tua competenza. Se il tuo tema o plugin usa un sacco di Javascript e CSS è meglio concatenare tutto quanto.

Noi personalmente amiamo dividere gli script e gli stili in tantissimi file semplicemente perché è meglio per lo sviluppo.

Usiamo strumenti come Gulp per concatenare in maniera automatica i file. Otteniamo 1 file per gli script e 1 file per gli stili invece di una dozzina di file diversi. Con una cosa così semplice stai migliorando di tanto la velocità di caricamento.

sprites

Un altro tool che hai a tua disposizione come sviluppatore sono le sprites.

Le sprites sono immagini concatenate; invece di caricare tutte le tue icone social separatamente puoi combinarle tutte in una sola immagine che poi andrai a utilizzare come sfondo (background) posizionandola in maniera giusta così da vedere solo ciò di cui hai bisogno.

Twitter per esempio usa le sprites, e non è l’unico sito web grosso a farlo.

Quando abbiamo bisogno di una sprite, giusto per intederci, non parliamo della famosa bevanda, utilizziamo uno strumento online molto utile che si chiama Stitches.

Questo strumento ci permette di caricare le immagini e sistemarle come preferiamo; alla fine ci genera gli stili necessari in automatico.

3. Minifica i tuoi file

La concatenazione e la minificazione di solito vanno a braccetto.

Una volta che hai i tuoi file finali è arrivato il momento di diminuire la loro dimensione.

Alla fine i browser non hanno bisogno dei tuoi commenti, spazi, etc. Va bene lo stesso se il codice è una massa di codice “illeggibile”.

Utilizziamo sempre Gulp anche per questo, ma ci sono tantissimi altri tool disponibili, come per esempio Grunt.

4. Carica gli script nel footer

A meno che tu non abbia assolutamente bisogno di caricare uno script nell’intestazione (header) assicurati di caricarlo dal pie di pagina (footer).

Utilizzando la funzione wp_enqueue_script() imposta il quinto parametro su true per far sì che gli script si carichino dal footer.

Questo sembra che diminuisca la velocità di caricamento semplicemente perché carica i contenuti importanti per primi.

Come bonus, se uno degli script si blocca o dà un errore non impedisce ai contenuti importanti di caricarsi.

5. Dai priorità ai contenuti

Anche i contenuti possono avere una priorità nel caricamento, è simile a caricare gli script dal footer.

Se per esempio la tua barra laterale contiene informazioni rilevanti e contenuti non tanto essenziali, come succede di solito, dovresti farla caricare dopo aver caricato i contenuti principali.

Questa non è sempre un’ opzione valida, ma se carichi sempre i contenuti importanti per primi il tuo sito web sembrerà più veloce e questo ti può aiutare a posizionarti meglio sui motori di ricerca.

6. Utilizza le dimensioni giuste per le immagini

Quando usi le immagini in WordPress dovresti specificare le dimensioni semplicemente perché tu sai dove queste immagini vengono utilizzate, ad esempio immagine in evidenza dell’ articolo, avatar, immagini piccole negli articoli, etc.

Utilizzando la funzione add_image:size() puoi dire a WordPress le dimensioni. Cosi ogni volta che un’ immagine viene caricate WordPress ne crea una per la dimensione da te specificata.

L’idea è che se abbiamo bisogno di un’immagine 600px * 320px dovremmo utilizzare un’immagine della stessa dimensione (600x320) per questi semplici motivi:

  1. Se utilizziamo un’immagine più grossa stiamo sprecando banda e stiamo diminuendo la velocità di caricamento.
  2. Se ridimensioniamo l’immagine, sia che la facciamo più piccola o più grande, abbiamo bisogno di utilizzare risorse dal server e molte volte abbiamo anche una diminuzione della qualità.

7. Diminuisci e ottimizza le richieste alla base di dati

Le richieste alla base di dati possono rallentare parecchio il tuo sito web perché utilizzano la memoria del server (RAM).

Abbiamo lavorato ad un progetto dove il server andava in down cosi tante volte per colpa di tante richieste sbagliate che alla fine l’host ha deciso di disabilitarlo temporaneamente.

Ci sono 2 tattiche che puoi utilizzare, sia diminuendo sia ottimizzando le richieste esistenti.

Delle volte ottimizzando arrivi ad aumentare il numero di richieste, ma anche se il numero è più grande, le richieste vengono fatte con un consumo minore di memoria e soprattutto in meno tempo.

Prima di tutto evita richieste diretta alla base di dati. Ci sono un sacco di funzioni a tua disposizione per avere tutto ciò di cui hai bisogno, da articoli a commenti, tag e metadata.

codexSe non sei sicuro di qualcosa il Codex di WordPress è il tuo migliore amico.

Se devi scrivere da solo una query, o richiesta, assicurati di utilizzare la classe WPDB per massima sicurezza ed efficienza.

Evita di unire tabelle o altre cose complicate. In molti casi è meglio utilizzare 2 richieste separate se sono più veloci. Ci sono tantissimi strumenti per vedere e capire se le tue richieste sono scritte nel modo giusto.

Puoi utilizzare plugin come Query Monitor o utilizzare define (‘SAVEQUERIES’, true) nel tuo wp-config.php  per poi mostrare tutte le query via $wpdb->queries.

Hai anche l’opzione di fare un log di tutte le query MySQL lente.

Questa opzione è abilitata da tantissimi provider se il tuo non lo ha fatto puoi chiedere a loro di abilitarlo. Puoi trovare più informazioni sul sito MySQL.

Conclusione: La velocità non è tutto

La velocità di caricamento è molto importante per un sito web, la cosa buffa è che non è l’unica cosa importante.

Per fare in modo che il tuo sito web ti aiuti a raggiungere lo scopo che ti sei prefissato devi saper bilanciare le varie cose e non concentrarti soltanto su una.

A parte la velocità di caricamento dovrai rendere il tuo sito bello da vedere e amichevole per gli utenti, ai quali dovrai dare tutte le informazioni necessarie.

Inoltre devi anche pensare a quanti soldi e quanto tempo puoi impiegare.

Può valere la pena pagare qualcuno 500 Euro per abbassare il tempo di caricamento del tuo sito web da 4 secondi a 1.8 secondi, ma spendere altri 500 Euro per andare da 1.8 secondi a 1.2 non sarà più conveniente;  meglio investire gli stessi 500 Euro su attività che portano dei risultati veri come il marketing.

Ricorda: più cerchi di abbassare la velocità di caricamento, più diventa complicato.

Se stai cercando altre informazioni ti segnaliamo un paio di articoli scritti da altri blogger per aiutarti a capire meglio l’argomento.

Articolo su come velocizzare un sito web sul blog di tagliaerbe.

Articolo sulla velocità di caricamento sul blog di Emanuele Tamponi.

Articolo su come misurare la velocita di caricamento.

Articolo su come velocizzare un sito WordPress su sos-wordpress.it

Articolo su come velocizzare wordpress sul blog di Francesco Gavello.

Articolo con 14 regole da rispettare per rendere un sito web veloce

La nostra intenzione è di trasformare questo articolo in una risorsa completa sul’ argomento. Se pensi di poterci aiutare a migliorare questa risorsa scrivici qui nei commenti o utilizza la pagina dei contatti e ti risponderemo al più presto.

Speriamo davvero che questa guida ti abbia aiutato a capire come migliorare le prestazioni del tuo sito web, blog o negozio online realizzato con WordPress.

Hai trovato utile questo articolo?

Fallo sapere a tutti a quanti lasciando una tua valutazione ( da 1 a 5 stele ) qui sotto. A te non costa nulla ma per noi significa tantissimo, sopratutto se il tuo sarà un voto a 5 stele.

Inoltre se ti va puoi usare i tasti di condivisione qui sulla sinistra della pagina per condividere questo articolo con altre persone che hanno il bisogno di capire come ottimizzare le immagini del loro sito web.

Hai domande o argomenti da aggiungere? Commenta qui sotto! Sarà utile a tutti quanti.

Abbiamo inoltre messo in piedi un gruppo gratuito su Facebook per tutti gli utilizzatori di WordPress, il gruppo e aperto a tutti quanti e dentro puoi fare domande, chiedere aiuto e sopratutto confrontarti con veri professionisti che usano WordPress per tutti i loro progetti online. Il gruppo si chiama Utilizzatori WordPresslo puoi trovare qui.

Se ti sei appena iscritto al nostro gruppo facci un saluto! Non mordiamo sai.

Come migliorare le prestazioni di WordPress (aggiornato Aprile 2017)
5 (100%) 6 votes

Scopri come migliorare le prestazioni di WordPress (aggiornato marzo 2017)

Una guida completa e gratuita (7000+ parole) che aggiornerò di tanto in tanto per insegnarti come migliorare le prestazioni di WordPress.

Send this to a friend