Für Webmaster sind grundsätzlich drei verschiedene Grafikformate interessant: GIF (Graphic Interchange Format; Dateiendung: .gif), JPEG (Joint Picture Experts Group, Dateiendung: .jpg) und PNG (Portable Network Graphics, Dateiendung: .png). Zur Zeit sollte man das PNG Format noch vernachlässigen, da die meisten interessanten Effekte, etwa Alpha-Transparenz, in noch nicht komplett in allen Browsern unterstützt werden.



Das GIF-Format speichert die Daten verlustfrei, also ohne wie im JPEG-Verfahren Informationen zu löschen, um eine geringere Dateigrösse zu erhalten. Der Nachteil: Das GIF - Format unterstützt nur 8-Bit Graphiken, also maximal 256 Farben.

Daraus ergibt sich der Haupteinsatz im Web: Man nutzt es am Besten für grossflächige Graphiken mit wenigen Farben, und zum Beispiel Text, weil die Kanten von Farbflächen und so auch Text scharf bleiben (da keine Farbinformationen verloren gehen). Zwei andere Vorteile des Graphic Interchange Format sind die Möglichkeit zu Transparenz und Animation. Man kann mehrere GIF - Bilder zu einer GIF89a Animation zusammenfügen.

Auch kann man eine Farbe als transparent definieren, so dass z.B. ein Hintergrundbild durchscheint. Um mehr als die 256 Farben zu simulieren, nutzt das GIF-Format einen optionalen "Dither-Modus":



Ohne Dithering





Mit Dithering





Das JPEG-Format unterstützt Graphiken mit hohen Farbtiefen (24 Bit) und eignet sich damit optimal zum Speichern vom Fotos oder Farbverläufen. Der Nachteil ist, dass beim JPEG - Format zum Erreichen von geringeren Dateigrößen Bildinformationen verloren gehen. Ähnliche Farben werden zusammengefasst, je nachdem wie gering die Qualitätsstufe eingestellt wird. Läßt man die Qualität bei grösseren Bildern aber bei 55 - 60%, sind die Unterschiede kaum bemerkbar.



Farbverlauf als GIF-Bild




Farbverlauf als JPEG-Bild





Das Portahble Network Graphics Format wird immer noch nicht von allen Browsern plattformübergreifend mit allen Funktionen unterstützt. Deshalb sollten sie vor der Veröffentlichung noch einmal auf mehren Browser - Versionen Ihre Seite überprüfen.

Aber das PNG Format hat einige interessante Eigenschaften, hiermit lässt sich echte Transparenz (siehe Bild) mit einem Alphakanal abspeichern, die anders als bei transparenten GIF-Bildern auf jedem Hintergrund ordentlich freigestellt sind. Hier kann nicht nur eine Farbe transparent markiert werden, es lassen sich auch prozentuale Werte (Halbtransparenz) angeben, um das Bild langsam ausblenden zu lassen. Transparente Effekte lassen sich auf Webseiten aber auch mit CSS realisieren.

Im PNG-Format lassen sich die Bilder verlustfrei komprimieren, so dass aus der gespeicherten Version noch sämtliche Daten wieder zurückherechnet werden können. Anders als bei dem .gif Format ist dies hier allerdings auch in 24 Bit Farbtiefe möglich.