Come ottimizzare le immagini di WordPress per migliorare la velocità del sito

By | Giugno 10, 2019

Mettiti comodo stiamo per spiegarti come ottimizzare le immagini di WordPress. Le immagini sono una parte vitale di qualsiasi sito Web / blog, ma possono anche causare problemi se non sono ottimizzate correttamente: aumentano la dimensione della pagina, quindi la sua velocità, che è un fattore importante sia per la SEO che per la User Experience; aumentano la larghezza di banda; riducono lo spazio di archiviazione sul tuo server.



Quindi, se vuoi evitare questi problemi, e presumo che tu lo vuoi, continua a leggere questa guida completa su come ottimizzare le immagini per WordPress!

Come ottimizzare le immagini di WordPress per migliorare la velocità del sito

L’importanza delle immagini

Ci sono molti motivi per cui dovresti sempre usare le immagini sul tuo sito web e sui post del blog. Proverò ad elencarli; se mi dimentico di qualcuno, per favore sentiti libero di lasciare un commento e fammi sapere!

  • Le immagini rendono il contenuto molto più attraente;
  • Le immagini migliorano l’esperienza utente;
  • Le immagini rendono i tuoi contenuti più ricchi, una cosa che i motori di ricerca amano, posizionandoti più alto in classifica;
  • Le immagini dividono il contenuto, semplificando la lettura da parte degli utenti. Agli utenti non piace leggere grandi blocchi di contenuti, quindi probabilmente lasceranno (come faccio io) senza interagire con la pagina o altre pagine, influenzando negativamente la frequenza di rimbalzo ;
  • Se i tuoi contenuti sono ricchi, utilizzando immagini o video, specialmente quando si scrivono tutorial, le possibilità che tuoi articoli vengono condividi sui social media aumentano;
  • Le immagini possono ottenere traffico di riferimento dai risultati di ricerca delle immagini (se si utilizzano i testi alt appropriati);
  • Le immagini migliorano il tuo invito all’azione (call-to-action) stimolando visivamente gli utenti.

Ora, non usare le immagini solo per il gusto di usarle. Usa le immagini quando e dove è rilevante. Forse alcuni articoli non hanno bisogno di immagini all’interno del contenuto, specialmente quelli corti.



Quale formato di file dovresti usare

I formati più comuni sono JPEG e PNG.

  • JPEG (Joint Photographic Experts Group) è migliore quando si tratta di fotografie o immagini che contengono una grande varietà di colori. Il formato utilizza una compressione con perdita di dati, il che significa che la qualità dell’immagine è alquanto ridotta, quindi può produrre una dimensione di file più piccola;
  • PNG (Portable Network Graphics) è migliore per immagini più semplici, come screenshot o immagini contenenti testo, disegni al tratto, ecc. Il formato utilizza la compressione senza perdita di dati, il che significa che la qualità non ne soffre, ma la dimensione del file sarà maggiore.

Come ottimizzare le immagini di WordPress prima di caricarle

1. Regola le immagini per adattarle all’area del contenuto

Ad esempio, se l’area del contenuto del tuo post ha una larghezza di 700 px, non caricare un’immagine con una larghezza di 2000 px. Carica un’immagine adatta al tuo layout (700 px o più poco).

Ci potrebbero essere eccezioni, però. Ad esempio, hai creato uno screenshot per un tutorial, ma se lo riduci a 700px, la scrittura potrebbe essere troppo piccola e difficile da leggere, quindi devi caricare un’immagine più grande su cui gli utenti possono fare clic per ingrandire.

Alcune immagini devono essere molto grandi per il responsive design, ma questo vale per le pagine del tuo sito (es. Homepage), dove potresti usare parallasse e cose del genere.

2. Utilizzare un software di editor di grafica

Io uso Photoshop. Questo è utile anche per regolare la dimensione delle tue immagini, come ho detto sopra.

In Photoshop, hai un’opzione chiamata “Salva per il Web”, o qualcosa del genere (dipende dalla tua versione di Photoshop), che ti consente di ottimizzare le immagini prima di salvarle.

Ci sono diverse opzioni tra cui scegliere, come il formato del file, la qualità dell’immagine, ecc. Di solito scelgo “Progressive” e “High Quality: 60” per .JPEGs e PNG-8 (256 colori) per .PNGs.

Puoi utilizzare GIMP come alternativa gratuita.

Come ottimizzare le immagini di WordPress dopo averle caricate

È qui che i plug-in di WordPress prendono il sopravvento. Non più lavoro manuale!

1. Utilizzo di plug-in di ottimizzazione delle immagini per ridurre ulteriormente le dimensioni delle immagini

I plug-in di seguito riducono le dimensioni del file senza influire sulla qualità.

Credo che il plugin più comune per l’ottimizzazione delle immagini sia WP Smush.

Una buona alternativa gratuita a WP Smush è EWWW Image Optimizer, che attualmente utilizziamo. È un ottimo plugin, con molte funzionalità!

Le sue opzioni potrebbero sembrare un po’ pesanti, ma di solito non c’è bisogno di configurazioni aggiuntive dopo l’installazione, a meno che non sia necessario per eseguire altre operazioni oltre a ridurre le dimensioni delle immagini. 

2. Utilizzo della funzione Lazy load

Lazy load significa che l’immagine viene caricata solo quando gli utenti scorrono verso il basso fino alla visualizzazione dell’immagine. Questa funzione consente di risparmiare un sacco di risorse, rendendo la tua pagina molto più veloce.

Ecco un esempio di caricamento pigro con effetto dissolvenza. Quando ho avuto accesso a questa pagina per la prima volta, sono state caricate immediatamente solo le prime 3 immagini (il numero di immagini dipende dalle dimensioni dello schermo). Quando ho iniziato a scorrere verso il basso, ho notato come il resto delle immagini è iniziata ad apparire, una per una.

Un buon plugin WordPress per il caricamento lazy è BJ Lazy Load. È facile da configurare e fa un ottimo lavoro. Sfortunatamente, questo tipo di plugin potrebbe non funzionare bene con tutti i plugin di temi o gallerie.

Abbiamo provato a utilizzare BJ Lazy Load su questo sito, ma alcune funzionalità del tema hanno smesso di funzionare correttamente e alcune immagini di alcuni post del blog non venivano caricate.

Non abbiamo scoperto cosa ha causato il problema, ma, ad essere onesti, non ci abbiamo provato. Abbiamo semplicemente smesso di usarlo e non abbiamo provato ad installare altri plugin, perché, come ho detto, i problemi possono apparire solo in alcuni punti, rendendoli difficili da individuare, e non vogliamo più spiacevoli sorprese.

Questo non significa che non dovresti usarlo! La maggior parte delle volte funziona senza problemi. Assicurati di controllare il sito dopo averlo installato.

Ecco due alternative a BJ Lazy Load:

Oppure, se stai usando il plugin per il caching di WP Rocket, sarai felice di sapere che ha una funzione di caricamento lenta integrata, quindi non dovrai installare un altro plug-in!

L’ottimizzazione delle immagini per il tuo sito Web / blog WordPress è di vitale importanza. Non dovresti mai saltare questo passaggio! L’ottimizzazione delle immagini migliorerà la velocità della tua pagina, quindi la tua esperienza utente e SEO, e ridurrà anche la larghezza di banda e l’archiviazione sul tuo server.

Assicurati che, nel processo di ottimizzazione, non influisca negativamente sulla qualità delle tue immagini.

Spero vi sia piaciuta la nostra guida su come ottimizzare le immagini per WordPress! Se hai domande o vuoi solo condividere le tue opinioni con noi, ti preghiamo di lasciare un commento!

Altro su WordPress:

La conoscenza muore se non è condivisa ...!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato.