Kodierung von Präsentationsgraphiken
Bei der Visualisierung von Daten können Präsentationsgraphiken einen schnellen Überblick vermitteln. Derartige Graphiken werden häufig auch auf Internetseiten eingebunden. Gerade diese Graphiken haben Eigenschaften, die einer performanten Veröffentlichung auf der Website entgegen kommen.
Der gewählte Farbpalettenumfang hat also einen erheblichen Einfluss auf die Qualität mit der ein GIF-Bild dargestellt wird. Zur Verdeutlichung sollen einige beispielhafte Rastergraphiken dienen, die zwei simple Formen von Präsentationsgraphiken darstellen. Dabei soll der Umfang der genutzten Farbpalette variiert und die dadurch hervorgerufenen Unterschiede bei der Darstellungsqualität und der Dateigröße angegeben werden.
Die Erste Rastergraphik zeigt ein normales Balkendiagramm, wie es auf vielen Websites zur Vermittlung bzw. Visualisierung von Datenmaterial genutzt wird. Bei Ansicht des Bildes fällt auf, dass die Anzahl der unterschiedlichen Farbwerte relativ gering ist und dass keine Farbverläfe über breite Farbspektren enthalten sind. Darüber hinaus gibt es viele große Flächen – etwa der weisse Hintergrund der Graphik.
In der folgenden Abbildung wird die Graphik in Form eines 256-Farbigen GIF-Bildes eingebunden. Qualitativ gibt es hier nichts auszusetzen. Es sind keine ausgefransten Bereiche zu erkennen und die dargestellten Texte werden scharf wieder gegeben.
Abb. 1: 256 Farben / 7.489 Bytes
Anders als bei Abbildung 1, enthält die Version aus Abbildung 2 lediglich sechzehn unterschiedliche Farbwerte. Zwar führt dies zu einer etwa um die Hälfte geringeren Dateigröße, aber auch die Qualität des Bildes hat sichtbar nachgelassen. So sind die Balken an einigen Stellen ein wenig ausgefranst.
Abb. 2: 16 Farben / 3.848 Bytes
Neben Farbpaletten mit 256, 16 und 2 Farben können GIF-Rastergraphiken auch mit anderen Indexgrößen abgelegt werden. Hier sollte die Anzahl der enthaltenen Farbwerte jeweils in Zweierpotenzen gewählt werden. Das folgende Bild (Abb. 3) nutzt mit 64 unterschiedlichen Farbwerten eben eine solche Zweierpotenz (hier können einzelne Pixel mit 6-Bit-Indexwerten angegeben werden). Eine Angabe von Palettengrößen, die keiner Zweiterpotenz entsprechen macht keinen Sinn, da die maximale Anzahl der Farbwerte bei der Kodierung einzelner Pixel nicht ausgereizt wird. Beispielsweise würde eine Farbpalette mit 50 Farbwerten bei der Kodierung ebenso einen 6-Bit langen Index benötigen, da der Index in binärer Schreibweise 50 Werte unterscheiden können muss.
Abb. 3: 64 Farben / 5.425 Bytes
Zum Vergleich zeigt Abbildung 4 die Präsentationsgraphik in Form eines eingebundenen JPG-Bildes. Zwar wird hier ein großes Farbspektrum geboten und auch die Wiedergabequalität stimmt, allerdings steigt die Dateigröße auch deutlich – Gegenüber dem qualitativ ausreichenden GIF-Bild mit 64 Farben um fast 50% – an. Beim Aufruf der Internetseite profitiert der Seitenbesucher also von einer geringeren Latenzzeit. Dabei ist noch anzumerken, dass das Bild aus dem Beispiel mit 227x182 Pixeln eine relativ geringe Rastergröße hat. Je größer die Pixelzahl einer auf der Website darzustellenden Rastergraphik ist, desto größer kann auch die Differenz der Dateigrößen ausfallen.
Abb. 4: JPG / 10.347 Bytes
Nicht in jedem Fall können Graphiken mit großen, einfarbigen Flächen (etwa bei einfarbigem Hintergrund) auch in annehmbarer Qualität in ein GIF-Bild verpackt werden. Enthalten die darzustellenden Graphiken Farbverläufe, so steigt die Anzahl der durch das Bild verwendeten Farben rapide an. Dies führt letztlich zu allzu groben Übergängen.