Gdesign.it :: Come progettare siti web accessibili ed efficaci ::


Home » Principi » La grafica per il web: Il formato GIF

Il formato GIF

di GDesign, 30 Ottobre 2001

Versione StampabileDownload in pdf


Il formato GIF (Graphic Interchange Format) fu diffuso negli anni Ottanta come metodo efficiente di trasmissione delle immagini su reti di dati. All'inizio degli anni Novanta i progettisti originali del web lo adottarono per l'efficienza che offriva. Oggi la stragrande maggioranza delle immagini sul web è in questo formato ed è supportato da tutti i browser web.

Il formato GIF usa una forma di compressione LZW che mantiene inalterata la qualità dell'immagine, ovvero riduce le dimensioni del file senza pregiudicare la qualità grafica dell'immagine. La profondità dei colori delle immagini GIF è di 8 bit, che consente di usare una tavolozza di 256 colori. Meno colori si usano e maggiori saranno le possibilità di compressione, ovvero minori saranno le dimensioni del file.

Lo schema di compressione LZW è più adatto a comprimere immagini con grossi campi di colore omogeneo ed è meno efficiente nella compressione di immagini complicate con molti colori e grane complesse.

È possibile sfruttare le caratteristiche della compressione LZW per migliorarne l'efficienza e ridurre di conseguenza le dimensioni delle immagini GIF. La strategia consiste nel ridurre il numero di colori in un'immagine GIF al numero minimo necessario e nell'eliminare i colori isolati non necessari per la rappresentazione dell'immagine.

Un'immagine GIF non può avere più di 256 colori, ma può averne meno, fino a un minimo di due (bianco e nero). Le immagini con meno colori sono compresse più efficacemente con la compressione LZW.

Questa compressione consente anche di salvare le immagini in un formato interllacciato. Il formato a interllaciamento produce una visualizzazione graduale di un'immagine in una serie di passate sempre più definite a mano a mano che i dati arrivano al browser. Ogni nuovo passo crea un'immagine più nitida fino al completamento dell'intera immagine.

Molti utenti trovano attraente l'effetto animato "da sfocato a nitido" dell'interlacciamento, ma il vantaggio più importante di questa tecnica è che offre un'anteprima dell'intera area dell'immagine mentre l'immagine viene scaricata sul browser.

L'interlacciamento è più adatto a immagini GIF di grandi dimensioni, quali le illustrazioni e le fotografie, ma non rappresenta una buona scelta per immagini GIF di piccole dimensioni come le barre di navigazione, i pulsanti e le icone che vengono caricate su schermo molto più rapidamente se mantenute nel formato GIF tradizionale (non interlacciato).

In generale, l'interlacciamento non ha effetti significativi sulle dimensioni dei file d'immagine GIF.

Il formato GIF consente anche di scegliere nell'immagine un colore che risulterà trasparente nel browser. Nelle aree di colore contrassegnato come trasparente, verrà visualizzato il colore di sfondo della pagina. Purtroppo la proprietà trasparente non è selettiva: se rendiamo trasparente un colore, ogni pixel dell'immagine caratterizzato da tale colore diventerà a sua volta trasparente, e questo può produrre risultati imprevisti.

L'aggiunta di trasparenza a un'immagine GIF può anche produrre risultanti deludenti quando l'immagine contiene smussature o antialiasing.

Supponiamo di voler creare un pulsante di forma circolare di colore rosso da inserire sopra un colore di sfondo usando Adobe Photoshop. Photoshop smussa la forma circolare inserendo pixel di colori intermedi lungo i bordi della forma; questa smussatura migliora l'aspetto delle immagini su schermo ammorbidendo i bordi frastagliati.

Gif originale e trasparenteI problemi iniziano quando s'imposta il colore di sfondo a trasparente e si utilizza l'immagine in una pagina web su un altro colore di sfondo: il pixel soggetto ad antialiasing nell'immagine corrisponderà sempre al colore di sfondo originale e quindi si vedrà un brutto alone attorno all'immagine.

Occorre allora prestare attenzione quando si usa la trasparenza nelle immagini GIF per evitare il problema sopra descritto.

^Top

Dai un voto a questo articolo:   HITS: 279 | VOTI: | MEDIA VOTI:     

Home:: Html:: Principi:: How To:: Download:: Tips:: Link:: Collabora:: Partners:: News&Updates:: Contatto:: Info

© 2001 - 2006 Giuseppe Di Carlo :: Riproduzione vietata ::

Utenti on line: 3