HomeKontaktImpressum
Sie sind hier: Home

PNG als Alternative zum GIF-Format

Mit dem PNG-Format – PNG steht hier für Portable Network Graphics – existiert eine Alternative zu GIF, die ebenfalls mit einer begrenzten Farbpalette arbeitet. Neben vollständiger Transparenz unterstützt PNG auch Teiltransparenzen. Allerdings sollte der Einsatz auf der Internetseite wohlüberlegt sein.

Trotz der Tatsache, dass das PNG-Format schon einige Jährchen auf dem Buckel hat – der erste Standardisierungprozess begann bereits 1995 –, wird dieses Format bis heute längst nicht von jedem Browser vollständig unterstützt. Gerade der auf der „freien Wildbahn” noch recht verbreitete Internet Explorer in Version 6 kann lediglich die normale Volltransparenz darstellen. Dies bedeutet, dass für ein einzelnes Pixel in einer Rastergraphik nur festgelegt werden kann, dass dieses Transparent ist. Ist dies der Fall, so wird das jeweilige Pixel nicht überlagert, sondern behält die Farbe des dahinter gelegenen Elements bei.

PNG-Dateien nutzen, wie auch das GIF-Format, eine feste Farbpalette mit bis zu 256 unterschiedlichen Farbwerten, die auch hier in einer Indextabelle abgelegt sind – vgl. GIF-Farbpalette. Für jeden der drei Farbkanäle – Rot, Grün und Blau – steht wieder ein Bytewert zur Verfügung. Die darstellbaren Farben umfassen also einen 24-Bit-Farbraum.

Anders als beim GIF-Format steht im PNG-Format ein weiterer Kanal zur Verfügung über den sich eine, unter dem GIF-Format nicht umsetzbare, Teiltransparenz realisieren lässt. Dieser sogenannte Alphakanal gibt – ähnlich wie die Farbkomponenten – an, inwieweit ein hinter dem Bild gelegenes Pixel durch scheint. Angaben zum Alphakanal können 1 oder 2 Byte lang sein und sowohl in der Indextabelle, als auch als Zusatz der Pixelindexe angegeben werden. Mittels dieser Teiltransparenz lässt sich also – indirekt über eine bestimmte Transparenz in Kombination mit der Hintergrundfarbe – ein größerer Farbraum vortäuschen.

Aufgrund der bereits angesprochenen Probleme älterer Internet Explorer mit dem PNG-Format sollte man sich gut überlegen, ob der Einsatz wirklich Sinn macht. Leidet die Usability der Website allzu sehr unter den Folgen des unzulänglich gerenderten Bildmaterials, so ist der Einsatz von PNG-Bildern auf keinen Fall angebracht. Bleibt eine Website jedoch vollständig nutzbar und stellen sich nur minimale Darstellungsfehler ein, so kann das PNG-Format aber auch die Wartung einer Internetseite erleichtern. Schließlich müssen bei Änderungen am Layout deutlich weniger Bilddateien angepasst werden.

Nutzt die Zielgruppe eines Internetauftritts – beispielsweise aufgrund des Themenbereichs der Seite – fast ausschließlich moderne Browser oder hat man es mit einer geschlossenen Nutzergruppe zu tun, die bestimmte Vorgaben bzgl. der zu verwendenden Browseranwendung haben – etwa in einem Intranet –, dann ist der Einsatz des PNG-Formats auf jeden Fall angebracht. Eine Bewertung, ob und wieviele Nutzer mit welchen Browsern auf einer Seite aufschlägt sollte man sich allerdings nicht zu einfach machen. Beispielsweise sind die von Logfile-Analyseprogrammen gelieferten Ergebnisse oft mit Vorsicht zu genießen.

Bleibt zu hoffen, dass die Nutzergemeinde des Internet Explorer möglichst bald auf die Version 8 umsteigt, der in vielerlei Hinsicht Verbesserungen mitbringt. Neben der besseren Einhaltung geltender Webstandards (Cascading-Stylesheets und (X)HTML) kommt dieser auch mit dem PNG-Format bestens zurecht und auch das Einbetten von Rastergraphiken in CSS- oder HTML-Dateien ist möglich. Die sowohl eleganteste, als auch kompateste Möglichkeit qualitativ hochwertige Vektorgraphiken im Internet zu verbreiten bietet übrigens das SVG-Format (Scalable Vector Graphics). Aber leider hapert es auch hier wieder mit der breiten Browserunterstützung – der Internet Explorer benötigt gar ein Plugin damit er derartige Inhalte darstellen kann.

Auf den folgenden Seiten werden Beispiele zum Einbinden von PNG-Rastergraphiken auf Internetseiten gezeigt. Dabei werden auch die Unterschiede zwischen den Transparenz-Fähigkeiten von GIF- und PNG-Bildern demonstriert.

Seite 1 von 4 | « [1] • [2][3][4] »
  
© 2009-2017 Möglichkeiten zur Steigerung von Geschwindigkeit und Usability Ihrer eigenen Website