Tutorial multimedia - Immagini GIF

GIF è uno dei principali formati di immagini utilizzati sul Web.

Questo articolo spiega in dettaglio le caratteristiche e le tecniche di utilizzo delle immagini GIF.

Comprendere i formati delle immagini

Entrambi HTML e XHTML non stabiliscono un formato ufficiale per le immagini. Tuttavia, i browser popolari hanno stabilito formati specifici per le immagini: di solito sono GIF e JPEG. La maggior parte dei formati multimediali richiede applicazioni ausiliarie speciali, e ogni utente del browser deve ottenere, installare e utilizzare correttamente queste applicazioni per vedere o ascoltare questi file speciali. Pertanto, GIF e JPEG sono diventati lo standard reale sul Web, il che non sorprende.

Prima dell'arrivo del Web, questi due formati di immagini erano già stati ampiamente utilizzati, quindi c'era una grande quantità di software di supporto che ci ha aiutato a creare immagini in questi due formati. Tuttavia, ciascuno di questi formati ha i suoi pro e contro, e alcuni browser utilizzano le loro caratteristiche per ottenere effetti di visualizzazione speciali.

GIF

Il formato GIF si riferisce al formato di scambio di immagini (Graphics Interchange Format, GIF), che è stato sviluppato originariamente da CompuServe per trasmettere immagini agli utenti del suo servizio online.

Caratteristiche del formato GIF

Il formato GIF ha molte caratteristiche, quindi è molto diffuso in HTML/XHTML.

Prima di tutto, la sua tecnologia di codifica può essere utilizzata su molte piattaforme. Pertanto, attraverso GIF decoder software adeguato (la maggior parte dei browser contiene questo software), è possibile creare e comporre immagini di file GIF su Macintosh e caricare, decodificare e visualizzare senza sforzo su PC basati su Windows.

La seconda caratteristica del formato GIF è che utilizza una tecnologia di compressione speciale che può ridurre significativamente la dimensione dei file di immagine, rendendo possibile una trasmissione più veloce su Internet. La compressione GIF è una compressione

Inoltre, le immagini GIF sono molto facili da animare.

Versioni e colori del formato GIF

Nonostante i file di immagine GIF utilizzino .gif (o .GIF) come suffisso del nome del file, ci sono due versioni di GIF: il GIF originale 87a e il GIF89a, quest'ultimo che supporta molte nuove funzionalità, tra cui sfondo trasparente, archiviazione incrociata e animazione, queste funzionalità sono molto diffuse tra i creatori web.

Oggi i browser più popolari supportano entrambi i formati GIF, che entrambi mappano i valori dei pixel a 8 bit su un elenco di colori con lo stesso schema, il che significa che ogni immagine può avere fino a 256 colori.

La maggior parte delle immagini GIF ha meno colori reali, e alcuni strumenti speciali (come Macromedia Fireworks) possono semplificare questi colori in immagini più dettagliate. Semplificando i colori, è possibile creare immagini di colore più piccole e rafforzare la ridondanza dei pixel, rendendo la compressione dei file più efficace e accelerando la velocità di download.

Tuttavia, a causa del numero limitato di colori, le immagini codificate in GIF non sono sempre adatte, specialmente per immagini con un effetto di foto veramente realistico. Le immagini GIF possono essere utilizzate per creare icone molto belle e immagini con pochi colori e disegni.

Anche i creatori più esigenti scelgono GIF

Poiché la maggior parte dei browser grafici supporta esplicitamente il formato GIF, è ora il formato di codifica delle immagini più accettato sul web. Entrambe le immagini inline e le immagini collegate esternamente possono utilizzare questo formato. Se esitate a scegliere il formato delle immagini, utilizzare GIF è certamente una buona scelta. Funziona praticamente in ogni situazione.

Tecniche delle immagini GIF

Le immagini GIF hanno tre tecniche speciali: scorrimento a interlacciamento (interlacing), trasparenza (transparency) e animazione (animation).

Scorrimento a interlacciamento

Tramite lo scorrimento a interlacciamento, l'immagine GIF può apparire sullo schermo immediatamente, piuttosto che essere visualizzata gradualmente da sopra in basso. Di solito, le immagini codificate in GIF sono una sequenza di dati pixelati disposti in ordine consecutivo, da alto in basso, riga per riga. Pertanto, quando le immagini GIF normali vengono visualizzate sullo schermo, sembrano aprire improvvisamente una tenda, mentre quelle con scorrimento a interlacciamento sembrano sollevare un persiane. Questo è perché la sequenza di dati pixelati si intercallica ogni 4 righe. Gli utenti possono vedere un'immagine completa da alto in basso in un quarto del tempo necessario per scaricare e visualizzare l'intera immagine, anche se è piuttosto sfocata. Di solito, l'immagine che rappresenta un quarto è abbastanza chiara, in modo che gli utenti con connessioni internet più lente possano determinare se sia necessario scaricare il resto dell'immagine.

Nonostante tutti i browser grafici possano visualizzare GIF con scannamento interlacciato, non tutti possono mostrare l'effetto di chiarezza progressiva. Anche se i browser che possono realizzare questo effetto permettono agli utenti di scegliere di visualizzare l'immagine solo dopo che è completamente scaricata e decodificata, i browser obsoleti visualizzano sempre l'immagine completamente scaricata e decodificata, quindi non supportano questo effetto.

Trasparenza

Un altro effetto comune delle immagini GIF (in realtà delle immagini nel formato GIF89a) è la possibilità di rendere trasparente una parte dell'immagine, permettendo così al contenuto sotto l'immagine (solitamente lo sfondo della finestra del browser) di essere visualizzato attraverso la parte trasparente. Le immagini GIF trasparenti utilizzano un colore speciale nella loro mappatura dei colori come colore di sfondo, permettendo così che illo sfondo della finestra di visualizzazione sia trasparente. Attraverso la accuratezza nella riduzione delle dimensioni dell'immagine e la scelta di un colore di sfondo quasi puro, le immagini trasparenti possono essere create per sembrare completamente incastonate nel sito web o galleggiare sopra di esso.

Le immagini GIF trasparenti sono adatte a qualsiasi grafica che desidera integrarsi nel documento ma non vuole sembrare un quadrato. I loghi trasparenti GIF sono molto comuni, come icone trasparenti o simboli stampati, ecc. - qualsiasi immagine con una forma naturale può utilizzare questo effetto. È anche possibile inserire immagini inline trasparenti all'interno del testo tradizionale per visualizzare simboli speciali.

Un difetto dell'effetto di trasparenza delle immagini GIF è che se viene incluso all'interno di un tag di collegamento anchor (a) senza rimuovere i suoi bordi, o racchiuso in un frame speciale, sembra molto brutto. Inoltre, il contenuto attorno al bordo rettangolare dell'immagine viene visualizzato, invece di avvicinarsi al bordo opaco dell'immagine. Questo risultato comporta l'eccessiva isolazione dell'immagine o una pagina web che sembra molto strana.

Animazione

Il terzo aspetto unico del formato di immagine GIF89a è la possibilità di realizzare animazioni semplici frame per frame. Utilizzando software speciali per animazioni GIF, è possibile inserire una serie di immagini GIF in un singolo file GIF89a. Il browser visualizzerà consecutivamente ogni immagine del file, come quei libri illustrati che abbiamo giocato (e persino disegnato) da bambini, che creano un effetto animato attraverso la rapida paginatura. Nei file GIF, c'è una sezione di controllo speciale tra ogni immagine, che può essere utilizzata per impostare il numero di volte che il browser visualizzerà l'intera sequenza (in loop), il tempo di pausa tra ogni due immagini, e se cancellare lo spazio di immagine di sfondo prima di visualizzare l'immagine successiva, ecc. Combinando queste caratteristiche con quelle tipiche dei GIF (inclusa la tabella dei colori, la trasparenza, lo scannamento interlacciato, ecc.), è possibile creare immagini molto attrattive e di alta qualità.

Un'altra importante ragione per cui gli animazioni GIF semplici sono così efficaci è che non è necessario scrivere programmi specifici per documenti HTML per ottenere l'effetto animato. Ma ha anche un difetto molto grande, ossia è limitato a grafici molto piccoli come icone o grafici che occupano una piccola striscia della finestra del browser: anche se si è molto prudenti e non si ripetono parti statiche nei frame animati consecutivi, le animazioni GIF sono molto facili da diventare grandi. Di conseguenza, se il documento contiene più animazioni, il tempo di scaricamento delle immagini potrebbe essere molto fastidioso per l'utente. Se c'è una caratteristica che merita di essere trattata con grande attenzione per evitare l'abuso, è l'animazione GIF.

Conclusione

Le animazioni GIF semplici sono efficaci per un'altra importante ragione: è possibile ottenere l'effetto animato senza dover scrivere programmi specifici per documenti HTML. Ma ha anche un difetto molto grande, ossia è limitato a grafici molto piccoli come icone o grafici che occupano una piccola striscia della finestra del browser: anche se si è molto prudenti e non si ripetono parti statiche nei frame animati consecutivi, le animazioni GIF sono molto facili da diventare grandi. Di conseguenza, se il documento contiene più animazioni, il tempo di scaricamento di queste immagini potrebbe essere molto fastidioso per l'utente. Se c'è una caratteristica che merita di essere trattata con grande attenzione per evitare l'abuso, è l'animazione GIF.