Come ottimizzare le immagini su WordPress

E’ stato stimato che il tempo medio di permanenza su una pagina web va da 3 a 6 secondi superati i quali l’utente abbandona il sito. In chiave SEO scoprire come ottimizzare le immagini su WordPress per favorire la velocità di caricamento è estremamente importante e può decidere sulle sorti di un sito web. 

La principale causa di rallentamento nel caricamento di una pagina è data da file molto pesanti di immagini da ottimizzare assolutamente. Per quanto si possa ottimizzare un sito a livello generale, le immagini rappresenteranno sempre uno dei fattori che tendono a rallentare parecchio le pagine. Ogni immagine non ottimizzata si traduce in un consumo inutile di banda e tempi di attesa più lunghi per gli utenti.

Quando carichi un’immagine su un sito che utilizza WordPress, il sistema esegue una compressione per ridurre la qualità dell’immagine stessa. WP è impostato per comprimere il 90% del file originale.

Se vuoi velocizzare il tuo sito WP ti spieghiamo come fare.

Come ottimizzare le immagini su WordPress: riduci il peso del file prima di caricarlo

Per evitare di danneggiare il sito rallentando il tempo di caricamento delle pagine, bisogna ricordarsi sempre di ridurre il peso delle immagini prima di caricarle su WordPress. E’ questa la soluzione migliore per velocizzare il tuo sito WP.

Per alleggerire il peso delle immagini e, allo stesso tempo, ritagliarle in base alle dimensioni previste, è necessario utilizzare programmi di fotoritocco come Adobe Photoshop. Con questo software puoi scegliere la risoluzione ideale per il sito.

Non è possibile ottimizzare il peso di un’immagine direttamente su WP perché questo CMS open source integra comandi che possono ridurre soltanto la dimensione (tramite valori associati a width e height) ma non il peso del file. Questi comandi servono a visualizzare correttamente contenuti ma l’immagine caricata si riferisce al file originale.

Seleziona il formato delle immagini ideale per un sito WP

La scelta del formato è un altro passo importante da fare. Innanzitutto, bisogna escludere a priori i formati che richiedono la compressione della foto e prediligere i formati JPG (o JPEG), PNG E HEIF.  JPEG è il formato migliore per immagini che mostrano una gran varietà di colori: le immagini JPEG, in fase di compressione, perdono qualità per la riduzione delle dimensioni del file. I PNG sono ideali per la grafica, disegni, testo ed alcuni screenshot: supportano la trasparenza, utilizzano la compressione senza perdita di dati per una qualità superiore.

E’ necessario rimuovere tutte le informazioni inutili e invisibili all’utente, che vengono solitamente integrate in ogni formato quando vengono salvate. Tra queste informazioni troviamo i dati exif contenenti vari dettagli (software con cui è stata creata l’immagine, macchina fotografica). In certe operazioni di editing vengono aggiunti metadati che appesantiscono il file. Bisogna eliminare tutti i dati inutili e recuperare Kb il più possibile. 

La rimozione può essere effettuata manualmente oppure tramite plugin disponibili su WP, in particolare Smush in grado di cancellare le informazioni inutili e comprimere al massimo l’immagine senza comprometterne la qualità. Con Smush si possono risparmiare parecchi Kb riducendo il peso di ogni immagine caricata sul sito. Anche una percentuale minima di ottimizzazione può essere preziosa se rapportata alla quantità di immagini presenti su un sito ed al numero di accessi.

Ottimizza le immagini utilizzando un CDN

Come vengono raggiunti e distribuiti sul web i file? Bisogna porsi questa domanda in fase di ottimizzazione delle immagini su WordPress. Le distanze geografiche tra il server di un sito web e la posizione di un visitatore impattano sulla velocità del sito. Maggiore è la distanza, maggiore sarà l’attesa.

Per risolvere questo problema di latenza allo scopo di velocizzare il sito, dovresti considerare l’idea di installare una CDN (Content Delivery Network) ovvero una rete per la distribuzione di contenuti. Si tratta di un gruppo di server distribuiti in varie aree geografiche che serve a velocizzare la delivery (consegna) dei contenuti web avvicinandoli maggiormente alle posizioni geografiche degli utenti. Una CDN funziona come lo sportello automatico di una banca. Conserva una cache dei file multimediali rendendoli, appunto, raggiungibili agli utenti geograficamente più vicini. Questa soluzione permette di ridurre i tempi di attesa impedendo alle immagini di pesare troppo sui contenuti caricati sul server.

Sfrutta le tecniche di Lazy Loading

La piattaforma WordPress, come impostazione predefinita, tratta allo stesso modo tutte le immagini (da quella superiore a quella inferiore della pagina). In realtà, l’immagine superiore merita priorità ed è quello che fa il Lazy Loading. Si tratta di una strategia di progettazione basata sul caricamento graduale delle immagini. Non a caso WordPress rende disponibili diversi plugin tra cui BJ Lazy Load.

Il Lazy Loading è un sistema molto utile per ottimizzare le immagini su WP. Consente all’utente di accedere alle foto solo in caso di necessità per la porzione del sito web che sta visitando in un determinato momento. Tutti i vari file presenti in una pagina non saranno visualizzati automaticamente, una volta aperto il sito. Saranno riprodotti solo quando l’utente esegue lo scrolling verso il basso di una certa pagina. Praticamente, il Lazy Load consente di ottenere contenuti più pesanti (immagini, video) di una pagina solo quando servono senza appesantire i tempi necessari per mostrare la prima parte della pagina. Ritarda il download e il rendering per non precludere ciò che vede l’utente appena si collega sulla pagina web. Fa guadagnare secondi preziosi in fase di caricamento della pagina. Questo sistema, noto anche come caricamento differito, permette di impegnare l’upload solo per ciò che serve escludendo tutto quello che si trova fuori schermo.