Abbiamo già menzionato in altri articoli riguardanti l’importanza delle immagini nel web design.
Le aziende sono ben consapevoli dell’importanza dell’impatto visivo sugli utenti nel web design. In un sito web, la prima impressione è molto importante. A causa dell’enorme offerta di siti web, l’utente deve trovare quello che sta cercando il più velocemente possibile e per questo, le immagini sono uno strumento fondamentale.
Ma questo non è sufficiente. Oltre ad essere attraenti ed efficaci per la comunicazione nel web design, devono essere ottimizzati, devono essere di alta qualità e devono essere molto leggeri. Questo è ciò di cui parleremo in questo articolo.
L’eccesso di dimensioni e peso delle immagini contenute in una pagina web è una delle cause principali del suo lungo tempo di caricamento.
E nel caso non lo sapessi, il tempo di caricamento è uno dei tanti fattori che Google prende in considerazione quando posiziona il tuo sito web.
Inoltre, questa scarsa velocità di caricamento, dovuta alle grandi dimensioni delle tue foto online, è anche molto dannosa per l’esperienza dell’utente.
Perché dovremmo ridurre le dimensioni delle immagini sul nostro sito?
Ridurre o comprimere le dimensioni delle foto è a volte una delle azioni a cui non diamo molta importanza quando progettiamo il nostro sito web… ma può portarci molti benefici.
“L’ottimizzazione del peso delle immagini migliora i tempi di caricamento del nostro sito o blog e aiuta a migliorare il suo posizionamento”.
Il più grande e principale beneficio che otteniamo comprimendo le dimensioni di una fotografia è che aumentiamo la velocità di caricamento del nostro sito web.
Avere un sito web con bassi tempi di caricamento migliora l’esperienza dell’utente e ci aiuta a ridurre la frequenza di rimbalzo della pagina.
Più tempo impiega un sito web a caricarsi, più è probabile che il lettore chiuda il tuo sito e ne cerchi un altro.
È consigliabile controllare come funziona il tuo sito web, fare un test di velocità al tuo sito web. Consiglio di usare lo strumento PageSpeed Insights di Google.
Una delle raccomandazioni date da tutti i test di velocità è di ottimizzare le immagini riducendo le loro dimensioni.
L’altro vantaggio che otteniamo riducendo il peso delle foto online è che riduciamo anche il consumo del trasferimento di dati. Che può condizionare il buon funzionamento del nostro hosting.
Alla fine dell’articolo vi mostrerò una lista di editor di foto online gratuiti o strumenti per ridurre il peso delle vostre foto prima di caricarle sul web. Ma prima vorrei darvi alcuni consigli per l’uso delle immagini.
Come utilizzare e ottimizzare un’immagine per il tuo sito web?
- Dimensione dell’immagine
La dimensione di un’immagine è la dimensione in pixel dell’immagine. Se avete bisogno di un’immagine 300×300 px per il vostro articolo, non usate un’immagine più grande e poi riducete le sue dimensioni nello stesso articolo.
Invece, caricatelo sul sito web già ottimizzato per quella dimensione ideale. Perché, più pixel risulteranno in file più pesanti e questo è ciò che vogliamo evitare.
- Formato immagine
I due formati più importanti usati nel web design sono 2: jpeg e png.
Come usare ogni formato di compressione delle immagini è molto semplice.
Salveremo fotografie complesse, con molti colori e sfumature, con l’estensione jpg. Poiché il suo algoritmo dà migliori risultati di compressione dell’immagine.
Per immagini piatte o con trasparenze, come disegni vettoriali, loghi o fotografie con grandi aree di colori piatti, l’estensione png. In passato, questi tipi di immagini venivano salvati con l’estensione gif, ma sta perdendo terreno a favore dell’estensione png.
- Nome del file
Sì, anche il nome è importante. Ti aiuta a posizionarti nel motore di ricerca di immagini di Google. Non è la stessa cosa avere una foto con il nome city-1354.jpg come barcelona-night.jpg. Solo guardando il nome, uno ti dice più dell’altro.
Bene, tutto questo va bene, ma come faccio a ottimizzare le immagini sul mio sito web?
Editor di foto online gratuiti per ottimizzare il peso, ridurre le dimensioni o comprimere le foto senza perdere qualità
1) Smush.it
Se non vuoi complicare le cose, questa è l’opzione più semplice se usi WordPress. È un plugin che si installa nel gestore dei contenuti, e agisce automaticamente ogni volta che si carica un’immagine riducendone le dimensioni.
2) Imagify
Su Mistersito utilizziamo questo fantastico plugin. Imagify è uno strumento di ottimizzazione delle immagini che vi aiuta a ridurre le dimensioni delle vostre immagini su WordPress in modo semplice senza perdere la qualità. Imagify converte anche le vostre immagini in formato WebP, che ridurrà ulteriormente le dimensioni del vostro sito web rendendolo più veloce.
Imagify può ottimizzare jpgs, pngs, pdf e gif (animati o meno).
Il Backup delle vecchie foto è attivo di default quando si attiva il plugin WP.
3) Compressor.io
Questo programma per ridurre le immagini sul tuo sito web, ti permette di farlo fino al 90% del suo peso originale.
È molto facile da usare, e permette di caricare fino a 10 Mb di foto e scegliere il tipo di compressione. È possibile ridurre le dimensioni della foto senza perdita di qualità dell’immagine (compressione inferiore) o con perdita (compressione superiore).
4) Tiny PNG
È un programma per ridurre le dimensioni delle immagini online che permette di caricare fino a 20 immagini alla volta con un massimo di 5 Mb ciascuna. È una buona opzione se gestite una grande galleria di immagini.
5) PhotoAiD
PhotoAiD è un generatore di fototessere online basato sull’Intelligenza artificiale. Oltre alle foto tessere per i documenti ufficiali, come carta di identità o passaporto, l’app offre un servizio gratuito di editor di foto. Con l’app è possibile rimuovere lo sfondo, ritagliare la foto, rimuovere le ombre, e tanto altro.
6) Web Resizer
La cosa buona di questo strumento online per ottimizzare le immagini che usiamo nei nostri siti web o email, è che permette anche di eseguire altre operazioni come cambiare, ritagliare, ridurre, ruotare le dimensioni.
7) Image Optimizer
Dovete solo caricare la foto, indicare la dimensione finale dell’immagine e lui fa il resto. Non devi preoccuparti di altro per ridurre o comprimere le dimensioni delle immagini che usi sul tuo sito web senza perdere qualità.
8) Optimizilla
È uno strumento molto semplice per comprimere le dimensioni delle immagini. Devi solo caricare le foto che vuoi comprimere, fino a un massimo di 20 alla volta. E nelle miniature vi mostra la percentuale di riduzione delle dimensioni del file ottenuta.
Cosa ne pensi, è facile ridurre il peso delle immagini sul tuo sito web?
Un’ultima cosa, ricordatevi sempre di controllare le licenze delle immagini che usate nei vostri articoli. Anche se usi immagini con licenze Creative Commons, cita sempre la fonte.
Comprimere le dimensioni e ridurre le foto alla dimensione corretta, è una pratica che dovremmo fare ogni volta che carichiamo una foto sul web.
Con la lista di editor di foto online gratuiti (o strumenti per comprimere le foto su internet) che hai in questo post, non ti ci vorranno due minuti per ottenere la dimensione perfetta per ogni immagine che carichi sul tuo sito web senza perdere qualità.
