Le immagini, oltre ad essere decorative, sono un elemento importante perchè catturano la nostra attenzione prima ancora di leggere qualcosa ma il loro peso può influire sul caricamento del sito web.
Se un’immagine è pesante, rallenterà il caricamento dell’intera pagina da visualizzare. Questo andrà ad incidere sulla performance del sito e di conseguenza anche sul posizionamento nei risultati di ricerca. Infatti, una delle Best Practies di Google, ci dice che i siti leggeri sono maggiormente apprezzati dal suo algoritmo.
Quindi, come si fa a ridurre il peso delle immagini?
Per rendere un’immagine più leggera puoi optare per due soluzioni:
- installare un plugin sul sito (ad esempio: EWWW Image Optimizer)
- usando un programma di grafica
Comprimere un immagine con Photoshop
Vediamo però come ottimizzare un’immagine per il web con Photoshop. Perchè parto utilizzo un programma di editing di photo invece del plugin? Perchè sarebbe preferibile caricare immagini già ottimizzate invece di aggiungere un altro plugin di cui si potrebbe fare a meno. Il motivo è che anche i plugin, se sono troppi, possono rallentare il sito web. Ci sono anche altre alternative gratuite a Photoshop, ad esempio Canva Pro, Photopea, Gimp per citarne alcuni.
Quindi, per ottimizzare un immagine, aprila in Photoshop. Vai su File > Esporta > Salva per Web

Nelle impostazioni, scegli il formato JPEG e spunta la casella di progressione ottimizzata.
Se cliccate sulla tab “4 immagini”, potete vedere il peso delle immagini in base alla percentuale della compressione che si vuole scegliere.
Una buona compressione è quando l’immagine scende al di sotto dei 2MB.
Scegliamo quindi la compressione più bassa, in questo caso l’ultima in basso a destra, cliccando sul riquadro. Dopo di che clicca Salva.

Conclusione
Con questa operazione potete ottimizzare immagini di grandi dimensioni, ad esempio quella che ho usato è 5760×3840 px, senza appesantire il vostro sito.
Siamo passati da un immagine di circa 4MB ad una di circa 350kb. Non male vero?
Come ottimizzi le immagini prima di caricarle sul sito?