ELEMENTI DEL LINGUAGGIO HTML

I formati grafici su Internet

Se è vero che una immagine vale più di mille parole, è anche vero che una immagine di solito occupa uno spazio ben più grande di quello che occuperebbero mille parole. In tal modo, i pochi kbytes del testo vero e proprio di un documento in formato html, detto anche "pagina", arrivano dal server con grande rapidità, ma non altrettanto si può dire delle immagini contenute nella pagina stessa.

In generale, la manipolazione delle immagini risulterebbe difficoltosa se non venissero tradotte in files utilizzando un qualche metodo di compressione. Un "formato" di immagine stabilisce la struttura del file ed il metodo di compressione utilizzato.
In Internet, i formati grafici di gran lunga più utilizzati sono il GIF (Graphics Interchange Format) e il JPEG (Joint Photographer Expert Group). Le immagini gif possono contenere al massimo 256 diverse tonalità (colori), mentre quelle jpeg sono in ogni caso a più di 16 milioni di colori (si parla di True Color).

La grande differenza tra i due formati è che il primo è di tipo lossless: la compressione avviene senza perdite di informazioni; mentre nel secondo caso è di tipo lossy: la compressione avviene con perdita di informazioni; in particolare, vengono omesse le tonalità che l'occhio umano non sarebbe comunque in grado di rilevare.
Il metodo jpeg permette di solito rapporti di compressione più elevati del formato gif, e la perdita di informazioni non è mai tale da compromettere la qualità dell'immagine. In ogni caso, la qualità delle immagini jpeg è del tutto compatibile con la tecnologia di Internet.

Si possono pertanto osservare le seguenti regole:

utilizzare il numero di colori strettamente necessario (ad esempio, se è l'immagine è in formato gif, si possono utilizzare 16 colori anzichè 256);
sembra che la grande maggioranza di utenti di Personal Computer utilizzino monitor a 14 pollici con scheda grafica VGA o SuperVGA, cioè con risoluzioni massime rispettivamente di 640x480 e 800x600: pertanto, immagini più grandi di questi valori dovranno essere visualizzate tramite l'uso delle scroll-bar verticale ed orizzontale, piuttosto fastidiose; è buona norma contenere le immagini nelle dimensioni 450x450 o analoghe, perchè non è detto che l'utente utilizzi la finestra del browser a schermo intero;
nella scelta della risoluzione dell'immagine si deve tenere conto che i monitor visualizzano le immagini con una risoluzione di 96 pixel/pollice: pertanto, una immagine con risoluzione superiore viene visualizzata con dimensioni maggiori di quelle reali;
appena possibile, conviene inserire piccole immagini (thumbnails) che, selezionate, permettono di accedere all'immagine originale più grande.

Vi è inoltre la possibilità di utilizzare nei documenti HTML le cosiddette immagini gif interlacciate anzichè essere caricate riga per riga, esse vengono caricate intere con successive passate a risoluzioni sempre maggiori. Il vantaggio è che l'utente non deve aspettare per comprendere il contenuto dell'immagine, lo svantaggio è che il processo di caricamento può risultare per alcuni fastidioso. Questo tipo di immagini viene creato da appositi programmi di fotoritocco (ad esempio Paint Shop Pro).

Ancora, possono essere utilizzate le immagini gif animate. Le ultime versioni di Netscape e Internet Explorer riconoscono speciali controlli inseriti in immagini che sono formate da una successione di immagini (che formano appunto una breve animazione). Anch'esse vengono realizzate con appositi programmi (ad esempio GIF Construction Set).

Infine, possono essere utilizzate le cosiddette immagini gif trasparenti (formato GIF89). Esse contengono un colore che viene reso (dal programma che le crea, ad sempio il già citato GIF Constructor Set) trasparente, cioè tale da non coprire il colore sottostante su cui verrà posizionata.
Questo colore è di solito lo sfondo del soggetto dell'immagine stessa: in tal modo, quando l'immagine verrà posizionata sopra uno sfondo di quel colore (lo sfondo della pagina HTML), essa apparirà come parte integrante dello stesso.