Tripod-HTML-Kurs (1)
Tripod-HTML-Kurs (2): Einführung
- <BODY>-Tag
- <IMG>-Tag
- Imagemaps
- Farbmodelle
- Bildformate
- <META>-Tag
- farbige Tabellen
- Style Sheets
- Formulare
- Test
Tripod-HTML-Kurs (2): Bildformate für Webseiten
In diesem Kapitel erfahren Sie eine Menge über GIF und JPEG. Wenn Ihnen dieses
Kapitel zu theoretisch ist, können Sie es einfach überspringen und mit dem
Kapitel "Das <META>-Tag" weitermachen.
Die gängigen Browser können zwei Graphikformate in ihrem eigenen Fenser
darstellen ("inline"), ohne irgendwelche Plug Ins oder Zusatzprogramme laufen zu
lassen: GIF und JPEG
(von Graphics Interchange Format, bzw. Joint Picture
Experts Group).
Eigentlich ist JPEG kein Bildformat, sondern eine Kompressionsmethode, d.h.
ein Algorithmus, um eine Bilddatei zu einer kleineren Größe zu
packen.
Es gibt also einen Unterschied zwischen dem Dateiformat, d.h. wie die Daten
abgespeichert werden, und der Methode Daten zu komprimieren.
JPEG, MPEG, LZW, CCITT sind Kompressionsmethoden, Bildformate nutzen diese
Kompressionsmethoden.
In der Tabelle sind die Bildformate und die dazugeörige Kompressionsmethode
zusammengestellt.
| Bildformat |
nutzt die Kompressionsmethode |
| GIF |
LZW |
| JFIF* |
JPEG |
| TIFF |
CCITT Group 3 und 4 |
*: JFIF steht für JPEG File Interchange Format
GIF steht für "Graphics Interchange Format". Es gibt zwei Versionen, die
eine stammt aus dem Jahr 1987 und heißt dementsprechend 87a, die andere Version
hat den Namen 89a.
Ein GIF-Bild kann bis zu 256 Farben enthalten (in Schritten von 2, 4, 8, 16,
32, 64, 128, 256): die verwendeten Farben werden in einer
Farbpalette in der Bilddatei abgespeichert und
werden mit einem RGB-Modell beschrieben.
Aufgrund der limitierten Anzahl an Farben eignet sich GIF für ganz bestimmte Zwecke
(wie auch JPEG).
Das GIF ist besonders dann geeignet, wenn sich Kontraste schnell ändern,
wie z.B. bei Grafiken die schwarze Linien auf weißem Hintergrund darstellen (Logos,
Comic-Figuren, ...).
Dies ist einsichtig: da nur wenige Farben zur Verfügung stehen, können Farbkontraste,
die sich nur langsam ändern, schlecht dargestellt werden, da für diese viele
Farben aus der Palette verbraucht werden. Bei scharfen Kontrasten werden nur wenige Farben
verwendet, eine kleine Farbpalette reicht aus.
Mit GIF können Sie einige Webeffekte erstellen, die mit JPEG
nicht machbar sind.
- Mit interlaced GIF-Bilder können Sie einen Fade-In Effekt kreiieren
- transparente Bilder machen
- Animationen erzeugen
Fade-In-Effekt: das Bild wird beim Laden immer deutlicher, der Betrachter
bekommt bereits einen Eindruck von dem Bild, bevor es vollständig geladen ist.
Transparenz: eine Farbe des Bildes wird als transparent definiert, damit der
Hintergrund des Bildes durchscheinen kann, ein Bild kann damit ohne scharfe
Übergänge auf eine Webseite eingebunden werden.
Animation: sie können mehrere aufeinanderfolgende GIF-Bilder in einer
Datei speichern, die abgespielt einen kleinen Film ergeben. Diesen Effekt können
Sie nicht mit JPEG-Bildern erzeugen.
JPEG steht für "Joint Picture Experts Group".
Diese Bilder können viel mehr Farben auf einmal enthalten als ein GIF-Bild.
Ein JPEG-Bild kann bis zu 16 777 216 Farben enthalten!
Sie erahnen es bereits: da hier viel mehr Farben in der Palette zur Verfügung stehen,
können mit diesem Format Kontraste, die sich allmählich ändern, dargestellt
werden. Dieses Format ist ideal für Farbfotos. Wenn Sie ein Bild ihres letzten
Familienfestes oder ein Bild Ihrer Katze einscannen, dann sollten Sie diese als JPEG-Bilder
abspeichern.
Natürlich hat diese Farbenvielfalt auch ihre Nachteile:
- die Dateigröße ist i.d.R. größer als ein GIF-Bild
- transparente Bilder sind mit diesem Format nicht möglich
- animated "JPEGs" gibt es nicht
Mit dem progressive-JPEG Format ist ein Fade-Effekt machbar, vergleichbar den
interlaced GIFs.
Die Farben eines JPEG-Bildes werden nicht mit einem RGB-Farbmodell
beschrieben. Jedem Pixelwert wird ein Helligkeitswert ("luminance") und ein Farbtonwert
("hue") zugeordnet. Diese zwei Werte werden getrennt komprimiert. Jeweils 8X8 Pixel
werden auf einmal komprimiert.
Es gibt verschiedene Grade der JPEG Kompression (z.B. "hoch - mittel - niedrig", eine
Skala von 1 bis 99), die nicht einheitlich festgelegt sind, und von Grafikprogrammen
auch unterschiedlich definiert werden. Allgemein gilt: je höher die Kompression
ist, desto kleiner ist die Dateigröße und desto niedriger ist die
Bildqualität.
Diese Effekte sind jedoch nicht linear zueinander, daher kann bereits eine kleine
Kompression einen groen Effekt auf die Dateigröße eines Bildes haben
ohne das die Bildqualität zu sehr leidet.
Bedenken Sie auch: die Kompressionsmethode bzw. das Bildformat sollte dem Zweck
angebracht sein, dann erreichen Sie einen hohen Kompressionsgrad ohne daß die
Bildqualität zu sehr leidet, d.h. für weiche Übergänge ist JPEG,
für scharfe Kontraste ist GIF geeignet.
Die Vor- und Nachteile haben Sie ja bereits kennengelernt.
Wenn Sie eine Animation erzeugen möchten, muß die Wahl auf GIF fallen.
Transparente Bilder sind auch nur mit GIF möglich.
Den Fading-Effekt können Sie mit interlaced GIFs oder progressive JPEGs
verwirklichen.
JPEGs sind nicht gut für plötzliche Farbwechsel, dafür verwenden Sie das
GIF.
Möchten Sie Fotos in voller Schönheit weitergeben, sollten Sie zu JPEG greifen:
Sie können mit diesem Format bis zu 16.7 Millionen Farben in einem Bild speichern,
mit GIF lediglich 256 Farben.
