Come ottimizzare le dimensioni delle immagini per il tuo sito web

Le immagini non sono dei semplici file da caricare sul sito per renderlo più bello, ma un elemento fondamentale e complementare per creare un sito web davvero utile ed efficace, sia per te che per tuo cliente ideale.

Devono essere scattate o scelte con la stessa cura con cui si scrivono i testi o si scelgono i colori e lo stile di tutto il sito per rendere la tua comunicazione più semplice ed immediata possibile.

Le immagini per il sito devono essere ottimizzare per il web cioè ridimensionate sia in dimensioni (ad esempio 1920x1280px) che in termini di pesantezza (150/200 Kb), per ridurre il tempo di caricamento di tutto il sito.

Scegliere il formato ed il peso giusto di un’immagine influenza drasticamente la velocità di apertura di quella pagina e condiziona, positivamente o negativamente, tutta l’esperienza utente sul tuo sito.

Ecco perchè è così importante ottimizzarle per il web prima di pubblicarle online.

Spesso chi gestisce il sito in autonomia, tende a tralasciare questo particolare e si trova ad aspettare interminabili minuti per vedere aprire le immagini.

Formati delle immagini

Esistono diversi formati per salvare le immagini, i principali sono soprattutto tre:

• JPG o JPEG: è il formato più utilizzato in assoluto, creato appositamente per comprimere le immagini ed averle più leggere
• PNG: il formato PNG fornisce un’immagine con sfondo trasparente ed utilizza una compressione anche se meno ridotta rispetto al JPG; di conseguenza occupa un maggiore spazio rispetto ad un file JPG.
• GIF: anche le GIF possono avere uno sfondo trasparente, ma il formato supporta solo 256 colori per cui non sarà possibile utilizzarlo per illustrazioni o fotografie, inoltre le GIF possono essere animate.

Come ridimensionare le immagini

Per ridimensionare le immagini per il web ci sono vari modi e si possono usare diversi programmi online e offline.

Photoshop è la soluzione regina, ma se tu non hai Photoshop nessun problema!

Puoi usare Pixlr.com, un programma online di grafica completamente gratuito, molto simile a Photoshop.

Puoi utilizzare Comprimilo.com, altro software online completamente gratuito e di facile utilizzo.

Dove trovare immagini già ottimizzate

Se hai bisogno di immagini belle, di buona qualità e già ottimizzate per il web puoi usare Pixabay, un sito di foto stock free che ti da la possibilità di scaricare già l’immagine in diversi dimensioni e pesantezza.

Non tutte magari sono immagini belle o fanno al caso tuo, ma se trovi quella che fa per te sei già a buon punto.

Puoi scaricare quell’immagine cliccando sul bottone Download gratuito che si trova a destra dell’immagine e lì puoi scegliere la dimensione ed il peso dell’immagine che vuoi scaricare.

Dove e come usarle

Ecco qualche altro consiglio su come e dove usare le immagini ottimizzate.

• Se stai creando uno slider, scegli immagini che abbiamo una larghezza minima di 1.920px, l’altezza può variare a seconda di che ingombro vuoi dare nella pagina.
• Se stai creando una sezione parallax sull’home page, usa immagini con una buona altezza, almeno 1.600 px perchè in questo modo l’immagine di fondo scorrerà lungo la sua altezza e si creerà l’effetto visivo di sovrapposizione tra testo e immagine.
• Se cerchi un’immagine per l’articolo del tuo blog, scegline una con una larghezza massima di 1.000px o 1.200px, in questo modo hai un’immagine piuttosto leggera e di buona qualità.
• Per una immagine quadrata di illustrazione la larghezza potrebbe essere di 800x800px
• Per un logo 500px
• Per piccole immagini 300px
• Per icone 150px

Ora che hai visto come ottimizzare le immagini per il web, cosa ne pensi? Lo stai già facendo sul tuo sito?

Al prossimo articolo!