Come la velocità di un sito WordPress ottimizzando le immagini

La velocità di caricamento di un sito WordPress, e più in generale di un qualsiasi sito web, oltre a essere un fattore che influisce sulla SEO, incide sulla user experience.

Per snocciolare qualche dato, riportiamo recenti analisi nel campo della UX e dell’ottimizzazione dei siti web:

1. Secondo Google la probabilità di abbandono aumenta del 32% quando il tempo di caricamento passa da 1 a 3 secondi.

1. Uno studio di Akamai evidenzia che il 53% degli utenti da mobile abbandona un sito che impiega più di 3 secondi per caricarsi.
2. Stando a Pingdom, il tasso di rimbalzo medio per i siti web che si caricano in 2 secondi è intorno al 9%, ma sale rapidamente al 38% per i siti che impiegano 5 secondi.

In una strategia di ottimizzazione per i motori di ricerca, anche le immagini giocano un ruolo fondamentale. Sul lungo periodo, queste saranno sempre in numero maggiore e, se non gestite correttamente, andranno ad appesantire il sito, compromettendone la velocità. In questo senso, ottimizzare le immagini rientra in quelle attività che cooperano nel velocizzare un sito web.

Come ottimizzare le immagini in WordPress

Secondo uno studio di Imagify, le immagini possono condizionare per un 50% il tempo di caricamento di una pagina web: prendersene cura risulta quindi fondamentale. L’ottimizzazione delle immagini in siti WordPress può essere eseguita manualmente o tramite appositi plugin; il primo metodo permette di essere più indipendenti, il secondo di risparmiare tempo pur senza sacrificarne la qualità.

Ottimizzazione manuale delle immagini

Queste le pratiche maggiormente adottate per ottimizzare manualmente un’immagine:

• Convertire l’immagine nel formato più adatto, in particolare:
  • JPEG: questo formato può prevedere due modalità di compressione, lossy e lossless (con o senza perdita di dati) ed è un buon compromesso se si vuol bilanciare qualità e dimensione.
  • PNG: le immagini sono di qualità superiore ma, ovviamente, presentano anche una dimensione maggiore; questo formato non comporta la perdita di dati.
• Identificare la dimensione massima dell’immagine sul tuo sito: questo ti eviterà di creare immagini più grandi e potrai ridimensionare l’immagine sulla base di quanto definito.
• Comprimere il file perché occupi meno spazio attraverso il tool Compress JPEG.

Ottimizzazione delle immagini con plugin WordPress e software

Se vuoi bypassare l’attività manuale, puoi affidarti a dei plugin di WordPress che ottimizzeranno in modo automatico le immagini. Il nostro consiglio è di ridimensionare l’immagine con uno strumento di modifica e, solo successivamente, caricarla utilizzando un plugin di ottimizzazione per ridurne ulteriormente la dimensione. Questo, per evitare di caricare immagini di dimensioni superiori ai 2 MB nella libreria di WordPress, soglia oltre il quale si rischierebbe di esaurire rapidamente lo spazio disco.

Tra i plugin WordPress per ottimizzare le immagini troviamo:

• Imagify: questo strumento può essere riutilizzato per ridimensionare e comprimere velocemente le immagini. Offre la possibilità di scegliere il livello di compressione, in base alla qualità che si vuol ottenere, e di ripristinare le immagini alle loro versioni originali se necessario.
• Optimole: rappresenta una soluzione all-in-one, basata su cloud, per tutte le esigenze. Con una gamma di funzionalità avanzate, questo plugin semplifica la “pulizia” di immagini pesanti e le elabora in tempo reale per renderle responsive.
• EWWW Image Optimizer: si serve di strumenti come jpegtran, optipng, pngout, pngquant, gifsicle e cwebp per ottimizzare le immagini sul server; queste vengono automaticamente compresse, ridimensionate per adattarsi alla pagina e alle dimensioni dello schermo, caricate e convertite nel formato WebP.
• ShortPixel Image Optimizer: si tratta di un plugin che supporta vari formati, in grado di ottimizzare automaticamente tutte le immagini caricate sul tuo sito web, sia quelle nuove che quelle già esistenti, e si integra con i content delivery network (CDN) per una distribuzione efficiente delle immagini.
• Smush: è forse il plugin più apprezzato dalla community di WordPress. Ottimizza tutte le immagini fino a 5 MB di dimensione senza alterarne l’aspetto. Smush scansiona meticolosamente ogni immagine, la pulisce da tutti i dati non necessari e li ridimensiona prima di aggiungerle alla libreria multimediale.

In alternativa ai plugin puoi serviti di appositi programmi di editing. Oltre ai più celebri Paint e Photoshop, segnaliamo:

• FileOptimizer: si tratta di un software per ottimizzare file e immagini senza alterarne le proprietà. Dispone di tecniche avanzate di compressione ed ottimizzazione e integra la funzionalità Drag&Drop.
• Paint.NET: è un software di editing per Windows. È dotato di un’interfaccia utente intuitiva e molto simile al classico Paint, disponendo però di ulteriori funzionalità comunque semplici da utilizzare.
• Gimp: è un editor di immagini multipiattaforma, disponibile per GNU/Linux, macOS, Windows e altri sistemi operativi. È un software gratuito che offre ampia personalizzazione, grazie anche alla possibilità di installare plugin.
• ImageOptim: è un software per iOS, che permette di gestire le dimensioni delle immagini preservandone la qualità. Rimuove i metadati EXIF, come quelli relativi alla posizione GPS e alla fotocamera utilizzata, in modo da poter pubblicare immagini senza esporre informazioni private.
• OptiPNG: comprime le immagini senza perdere alcuna informazione, con focus sul formato PNG.

Best practice per ottimizzare le immagini

Quali possono essere alcune best practice che possono tornare utili in fase di ottimizzazione delle immagini?

• Scegli un plugin che comprima e ottimizzi le immagini esternamente sul server, così da ridurre il carico sul sito.
• Utilizza la compressione con perdita di dati quando possibile.
• Serviti di un CDN per velocizzare ulteriormente il sito e il caricamento delle immagini.
• Alterna formati PNG e JPG a immagini vettoriali SVG e valuta l’utilizza del formato WebP.
• Ridimensiona le immagini basandoti sulla dimensione di visualizzazione.
• Rimuovi i metadati non necessari dalle immagini.
• Valuta il lazy loading, ossia il caricamento “in ritardo” delle immagini con l’obiettivo di velocizzare il primo rendering della pagina.

Ottimizzare le immagini aiuta a velocizzare le prestazioni del tuo sito web, favorendo la user experience e il posizionamento SEO. Anche altri fattori determinano la rapidità di caricamento delle pagine, tra cui l’hosting: scegliere il giusto servizio è il primo passo per assicurare al sito web prestazioni ottimali.o web, favorendo sia i visitatori e la user experience sia i motori di ricerca. Anche altri fattori determinano la rapidità di caricamento delle pagine, tra cui il Web Hosting: scegliere il giusto servizio è il primo passo per assicurare al sito web prestazioni ottimali.