Come ottimizzare le immagini in formato PNG con Xnview e il plugin Riot, con Photoshop e con TinyPNG e comparazione dei risultati.
Nell'articolo precedente abbiamo fatto dei test tra i vari strumenti per l'ottimizzazione delle immagini in JPEG che è il formato più utilizzato per le foto pubblicate nel web. In generale dovremo utilizzare sempre tale formato escluso alcuni casi particolari. Il formato GIF è utile quando si voglia pubblicare immagini animate che esse stesse possono essere ottimizzate.
Le foto in formato PNG invece debbono essere usate solo quando si sia in presenza di trasparenza ovvero di immagini che abbiano anche il Canale Alfa come potrebbe essere una foto con lo sfondo trasparente. Abbiamo visto alcuni metodi di ottimizzazione di immagini che possono servire anche per il formato PNG. L'obiettivo di questo post è quello di comparare i risultati e la qualità della foto risultante per trovare quella che è la procedura migliore.
Ricordo che per ottimizzare una foto in PNG si possono usare i seguenti tool:
La terza opzione porta a risultati pressoché analoghi sia con Gimp sia con XnView visto che si utilizza lo stesso plugin. Per testare ho utilizzato una foto con sfondo trasparente del peso iniziale di 395KB e l'ho ottimizzata con tutti e tre i procedimenti. I risultati sono stati i seguenti:
| Strumento usato | Peso immagine |
|---|---|
| Photoshop Salva per il Web | 149KB |
| Tool TinyPNG | 124KB |
| XnView e Riot | 119KB |
L'ottimizzazione tramite il plugin Riot e XnView è quindi risultata la più efficiente. Anche la qualità risulta in linea con quella di TinyPNG e addirittura migliore di quella ottenuta con Photoshop. Vediamo quindi come procedere per la ottimizzazione delle foto in PNG con questo strumento.
Si installa XnView in versione Extended in modo che contenga tutti gli addon e i plugin. Si apre il programma quindi si va su File -> Apri e si seleziona l'immagine da ottimizzare. Alternativamente si può fare doppio click sulla immagine in questione nella visualizzazione Catalogatore. Se l'immagine fosse troppo larga per il layout del nostro sito si va su Immagine -> Ridimensiona immagine per diminuirne in proporzione sia la larghezza sia l'altezza. Dopo questa operazione opzionale si va su Filtri -> Riot per aprire il tool di ottimizzazione
Si tratta di uno strumento che nella parte bassa permette di scegliere il formato da ottimizzare tra JPEG, PNG e GIF. Si visualizzeranno le anteprime della immagine originale e di quella ottimizzata
La scheda PNG Options non ha un cursore di compressione come il formato JPEG ma permette di ridurre il colore scegliendo la tavolozza a 256 colori (consigliata) oppure quella a 128 o ancora a 16 per una ottimizzazione più radicale. È chiaro che se si diminuiscono i colori diminuisce anche la qualità. In Compression si sceglie la massima mettendo la spunta anche a Best Optimization. Le altre schede Metadata, Mask e Image Adjustments sono opzionali e servono per eliminare i metadati o per aggiustare luminosità contrasto e altri parametri. Si va su Save per salvare l'ottimizzazione. Ci verrà chiesto se sovrascrivere l'immagine originale, in linea di massima da evitare, per poi scegliere la cartella di uscita e dare un nome al file. Come vedete dallo screenshot precedente siamo passati da una immagine del peso di 395KB a una del peso di 120KB, risultato ottenuto senza ridimensionamento.
Nessun commento :
Posta un commento
Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy