Tortendiagramme mit Farbverläufen
Breit gefächerte Farbspekten oder Farbverläufe wirken sich negativ auf die Bildqualität von GIF-kodierten Rastergraphiken aus. Mit Blick auf die Optimierung der Website Performance sollten Präsentationsgraphiken mit möglichst wenigen unterschiedlichen Farbwerten auskommen.
Da eine breite Palette von Farbwerten dazu führt, dass sich GIF-Kodierte Rastergraphiken aufgrund der Reduktion vorhandener Farbwerte in ihrer Qualität verschlechtern, sollten Farbverläufe bei der Integration von Präsentationsgraphiken in eine Internetseite vermieden werden. Selbst wenn die im Bild enthaltenen Farben noch in den bei GIF-Dateien realisierbaren Index passen, wächst die Dateigröße unverhältnismäßig stark an. Der Mehrwert solcher „schöngerechneten” Charts steht in keinem Verhältnis zum hieraus erwachsenen Nachteil, der sich in einer höhreren Latenzzeit bei Aufruf der Internetseite ergibt.
Folgendes Beispiel soll Anhand eines Tortendiagramms demonstrieren, wie sich die Verwendung von Farbverläufen auf die Größe der GIF-Bilddatei auswirkt und welche Folgen eine Reduktion der Farbpalette auf die Darstellungsqualität der Rastergraphik hat. Abbildung 1 zeigt ein Tortendiagramm, welches die unter dem GIF-Format höchstmögliche Anzahl an Farbwerten enthält. Das Diagramm nutzt bei der Darstellung der Anteile jeweils einen Farbverlauf. Qualitativ ist gegen dieses Bild nichts einzuwenden. Dabei ist allerdings anzumerken, dass die Darstellungsqualität mit zunehmender Zahl von „Kuchenstücken” deutlich schlechter würde und auch die Dateigröße stiege an.
Abb. 1: 256 Farben / 7.430 Bytes
In einem solchen Fall führte dies zu einem ähnlichen Ergebnis, wie in Abbildung 2 zu sehen ist. Aufgrund der Tatsache, dass die Anzahl der in der Farbpalette abgelegten Farbwerte nicht mehr ausreicht, werden die in den Farbverläufen enthaltenen Zwischenwerte entsprechend reduziert und Verlauf verliert seine fliessenden Übergänge. Das untere Bild zeigt die Tortengraphik, nachdem die Farbpalette auf 16 Farben reduziert wurde. Der Farbverlauf sieht nun nicht mehr allzu toll aus, allerdings ist die Größe der Bilddatei auf weniger als die Hälfte geschrumpft. Ohne die enthaltenen Verläufe könnte die Datei sogar noch kleiner ausfallen.
Abb. 2: 16 Farben / 2.969 Bytes
Zum Vergleich zeigt Abbildung 3 das Tortendiagramm als JPG-Datei, wobei diese mit einem von der Bildbearbeitung vorgegebenen Standard-Qualitätsfaktor gespeichert wurde. Trotz der Tatsache, dass die Dateigräße noch über der 256-farbigen GIF-Version liegt, kann die Qualität nicht überzeugen. Besonders am Übergang zwischen der roten und der blauen Fläche, aber auch im gesamten Randbereich der roten Fläche sind deutliche Artefakte zu sehen.
Abb. 3: JPG Standardqualität / 8.745 Bytes
Durch Steigerung des Qualitätsfaktors läßt sich dieses Manko ausmerzen. Abbildung 4 zeigt das JPG-Bild mit dem höheren Qualitätsfaktor. Dies wirkt sich aber stark auf die Größe der resultierenden Bilddatei aus – gegenüber der GIF-Datei wird nahezu doppelt so viel Speicherplatz benötigt.
Abb. 4: JPG akzeptable Qualität / 13.359 Bytes
Aufgrund der Stärken des GIF-Formats sollte dieses in den meisten Fällen bei der Integration von Präsentationsgraphiken auf einer Internetseite zum Einsatz kommen. Immer vorausgesetzt, dass Farbverläufe und ähnlich farbenfrohe Bildinhalte vermieden werden, kann die Größe der Bilddateien auf diese Weise klein gehalten werden. Da der vermittelte Inhalt nicht unter einem sparsamen Farbeinsatz leidet, spricht nichts dagegen die Website Performance, durch wohlüberlegte Gestaltung von Rastergraphiken, bei der Erstellung der Internetseite im Auge zu behalten.