Come ottimizzare un'immagine GIF
01 02 08 - 20:50 Category: Photoshop.
Cerchiamo di capire come procedere per l'ottimizzazione di un'immagine gif, sia statica che animata.
Per alleggerire il peso di un file gif animato è possibile agire tramite l'animazione e il salvataggio.
L'animazione
Ridurre il numero di fotogrammi.
Di ogni fotogramma è importante impostare:
- i livelli visibili per quel singolo movimento
- i secondi di transito del fotogramma stesso
Tanti più fotogrammi saranno creati, anche tramite la funzione tweening o la timeline, tanto più pesante sarà il file.
E' possibile ottimizzare l'animazione, dallo stesso menù del pannello, impostando come scelte:
Rettangolo di selezione, se vogliamo, per quel singolo fotogramma, ritagliare l'immagine per quanto occorre a noi, diversamente dal fotogramma precedente;
Rimozione pixel ridondanti (Automatico), che corregge e rende trasparente i pixel, se diversamente impostati nel fotogramma precedente. Ricordandosi, ovviamente, di selezionare la casella di Trasparenza nel pannello di ottimizzazione.
Salvare come GIF tramite Salva per web dispositivi.
Spero risulti tutto molto semplice da comprendere.
Ho riportato da fonte Adobe solo le specifiche tecniche di alcune diciture.
Innanzitutto occorre dire che il formato GIF (Graphics Interchange Format), proprietario CompuServe, utilizza la compressione LZW e viene suddiviso il GIF 87a e GIF 89a che comprende anche trasparenza ed animazione.
Il formato GIF effettua una compressione di circa 4 volte la dimensione originale ma la lettura che compie delle informazioni è particolare: legge la differenza tonale dei pixel su chiave orizzontale, nel senso che se orizzontalmente l'immagine ha molte varianti di colore, il file occuperà più memoria che se ne ha verticalmente.
Comprende il salvataggio di massimo 256 colori, ed ecco perché non è adatto a foto o immagini con sfumati.
Come fare per ottimizzare un'immagine salvata GIF?
E' possibile farlo tramite la Tavola di colore.
Scegliendo col contagocce un colore non compreso nella tavola è possibile inserirlo, allo stesso modo si può eliminare qualche colore che non ti sembra indispensabile, riducendo anche il peso del file.
Per esigenze di web, alle volte si può passare del tempo nel selezionare dati colori rispetto altri, ed allora può essere utile salvare la propria tavola di colore dal menù dello stesso pannello, e dallo stesso menù sarà possibile richiamarla.
Il file avrà estensione .act (Adobe Color Table).
Per la Riduzione di colore riporto esattamente le indicazioni dell'Adobe:
Algoritmo di riduzione del colore e Colori
Consente di specificare un metodo per la creazione della tavola di ricerca del colore e il numero di colori in essa contenuti. Potete selezionare uno dei seguenti metodi di riduzione del colore:
Percettivo
Crea una tavola colore personalizzata dando priorità ai colori ai quali l'occhio umano è più sensibile.
Selettiva
Crea una tavola colore simile a quella creata dall'opzione Percettiva, ma favorisce aree di colore più estese e conserva i colori per il Web. Questa tabella colore in genere produce immagini con maggiore integrità di colore. Selettiva è l'opzione predefinita.
Adattata
Crea una tavola colore personalizzata tramite il campionamento dei colori dello spettro predominante nell'immagine. Ad esempio, un'immagine con i soli colori blu e verde produce una tavola colore formata principalmente da toni di blu e verde. La maggior parte delle immagini contiene colori concentrati in particolari aree dello spettro.
Restrittivo (Web)
Usa la tavola standard di 216 colori comune alle tavole Windows e MacOS a 8 bit (256 colori). Questa opzione garantisce l'assenza di dithering dovuta all'uso di un browser quando l'immagine è visualizzata a colori a 8 bit (questa tavola è detta anche sicura per il Web). Questa palette è chiamata anche palette dei colori sicuri per il Web. La palette Web può creare file di dimensioni maggiori ed è consigliata solo se considerate particolarmente importante evitare il dithering dei browser.
Personale
Usa una tavola colore creata o modificata dall'utente. Se aprite un file GIF o PNG-8 esistente, la sua tavola colore sarà personale.
Altri valori su cui agire:
Perdita, utile sempre nell'ottimizzazione di un file, ed elimina i dati non essenziali nel salvataggio.
Da fonte Adobe:
non è possibile usare l'opzione Perdita con l'opzione Interlacciato né con il dithering Disturbo o Pattern.
Dithering: è un algoritmo che consente la simulazione di un colore rispetto un altro, utile ad esempio negli sfumati dove occorre per ammorbidire la differenza di tonalità.
Non lo consiglio nei bordi delle trasparenze, perché crea il tipico e fastidioso bordino bianco.
Sempre in caso di trasparenza, consiglio l'Alone, in cui scegliere o meno il colore che rimedierà ad eventuali semitrasparenze non notate nel salvataggio ottimizzato.
L'Alone è molto utile nel caso conosciate il colore su cui verrà inserita la gif trasparente.
Infine consiglio sempre l'opzione Interlacciato, che crea un effetto preload come detto, nel senso che l'immagine viene precaricata nella cache del browser: aprendo la pagina compare dapprima a bassa risoluzione, e nel mentre l'immagine si carica a strati perché è letta dal browser e non dalla memoria del computer.
Anche se aumenta leggermente il peso del file, in una pagina web con molti elementi il precaricamento risulta più veloce ed agevole.
Naturalmente, già dalla visualizzazione Ottimizzata si ha un'idea dell'immagine in fase di salvataggio, ma può essere utile anche richiamare l'Anteprima (menù File), che mostra la stessa immagine posizionata nel web.