Il significato di ottimizzare è, in qualunque campo, quello di migliorare le prestazioni o l’utilizzo fino al massimo possibile. Questo è anche il significato che si dà, nella costruzione dei siti web, all’ottimizzazione delle immagini. Chi bada alla grafica web, spesso è un grafico che si è conferito dalla stampa all’online e usa gli stessi standard di qualità. Per la stampa sulla carta le immagini devono essere belle, il più definite possibile e devono pesare almeno un milione di megabyte. Una immagine ottimizzata è quindi grande con un’ ampissima tavolozza di colori e moltissimi pixel. Nel web è l’esatto contrario. Un’ immagine ottimizzata è una immagine il più leggera possibile e l’ottimizzazione è il livello fino al quale è possibile alleggerire un’immagine senza avere la percezione visiva della perdita qualità.
Perchè ottimizzare le immagini?
Paradossalmente non sono le dimensioni spaziali a definire l’ottimizzazione di un’immagine. Larghezza e altezza non sono importanti, ma lo è il peso misurato in kb. Il motivo è semplice. più l’immagine è pesante pi tempo ci metterà il server e il computer a scaricarla e mostrarla. Chi usa gli smartphone, i tablet o altri apparecchi che si connettono al web tramite connessioni che hanno tariffe per il traffico dati, l’ottimizzazione delle immagini è una delle caratteristiche che fanno preferire un sito o un blog rispetto ad un altro. Meno byte scaricati significa meno costi sostenuti. Un blog WordPress è composto fondamentalmente da due elementi. Uno è il testo, che sia il codice html o php oppure le parole scritte, e l’altro sono le immagini. Dato che il testo è di per sè leggerissimo, bisogna concentrarsi ad alleggerire le immagini per essere “mobile friendly”
Come ottimizzare le immagini
La prima cosa da fare è eliminare le info di una fotografia, autore caratteristiche della videocamera, tipo di esposizione usata sono informazioni utili ai fotografi, ma rendono la fotografia pesantissima. Eliminandole, si dimezza il peso dell’immagine. Il secondo elemento da eliminare sono i colori inutilizzati. Molto spesso le fotografie caricano l’intera tavolozza di colori disponibile anche se usano pochissimi colori. Un altro bel taglio al peso si dà eliminando dalla foto i colori inutilizzati. La terza operazione riguarda la pixellatura e la qualità dell’immagine e va effettuata dopo aver scelto le dimensioni dell’immagine. Dopo aver deciso se si vuole un ‘immagine adatta alle anteprime di Facebook, con almeno 600 pixel di larghezza, oppure se la preferiamo larga 324 pixel, cioè la larghezza più piccola dello schermo di uno smartphone, si deve diminuire il peso fino a che la qualità dell’immagine comincia ad essere inaccettabile a chi guarda lo schermo, sgranata o pixellata (si vedono cioè i quadretti del pixel). Al punto prima della sgranatura l’immagine è ottimizzata.
C’è qualcosa di automatico che aiuta?
Photoshop e Gimp e molti altri programmi di grafica hanno delle app per ottimizzare le immagini per il web. Anche Microfoft office picture manager, inserito fra i programmi di default di windows, ha l’opzione per ottimizzare le immagini. Sotto la voce, modifica immagine c’è “comprimi immagine” che da quattro opzioni: non comprimere, documenti, web, email. L’opzione “web” è già un mezzo per ottimizzare le immagini, utilizzabile prima di caricarle sul proprio blog. Io mi trovo benissimo con Riot Image Optimization tool, un tool gratuito che permette di avere immagini perfette, ottimizzate e delle dimensioni desiderate. La sua unica pecca è di non aver la versione per smartphone e di essere utilizzabile solo da desktop. Anche WordPress a modo suo aiuta, diminuendo automaticamente all’ 80% il peso delle immagini al momento in cui si caricano. Ci sono poi alcuni plugin per WordPress che aiutano l’ottimizzazione dopo aver caricato le immagini sul web. Smush , ad esempio, ottimizza anche le immagini dei thumbnail e delle miniature create automaticamente da WordPress. Anche Ewww Image Optimizer, lavora le immagini in modo automatico nel momento in cui si caricano sul server. Questi due plugin non sono però perfetti e può capitare che non diminuiscano abbastanza il peso delle immagini. In questo caso, misurando la velocità delle pagine con lo strumento apposito della Google, PageSpeed Insights ci venga indicato che dobbiamo ottimizzare delle immagini. Anche in quest caso google ci vine incontro dandoci l’indirizzo web esatto di dove si trova l’immagine da utilizzare e, in fondo alla pagina si può scaricare l’immagine con la perfetta ottimizzazione. A quel punto basta sostituire l’immagine originale con la versione data da google, utilizzando WordPress oppure l’ftp, magari tramite Filezilla e il gioco è fatto.