Bilder einbinden
    
 HomeBilder • Bildformate  

 Bildformate

Im Internet werden die Grafikformate GIF und JPEG, als neues Format PNG verwendet. Hier erfahren sie etwas über die wesentlichen Unterschiede.
PNG, JPG oder GIF - das ist die Frage

Zumindest kein BMP-Format. Vermeiden Sie es unbedingt Grafiken im BMP-Format (Bitmap-Format) einzubinden. Der IE mag das Format ja anstandslos anzeigen aber neben diesem Browser gibt's schließlich noch andere. Nach dem WOC ist das bmp-Format nicht vorgesehen!

Immer wieder wird gegen diese Konvention verstoßen. Ganz abgesehen davon, dass die Dateigröße für den Besucher nicht zumutbar ist, würden sie sich als Webmaster disqualifizieren. Die zweite häufig begangene Todsünde: Ein riesiges Bild mit falschen Größenangaben kleiner darzustellen statt es zu verkleinern (behandle ich auf einer separaten Seite).

  • GIF (Graphics Interchange Format) 8-Bit Format
  • JPEG (Joint Photographic Experts Group) 24-Bit Format
  • PNG (Portable Network Graphics) bis zu 48-Bit Format

  Unterschiede GIF / JPG

Im JPG-Bildformat können bis zu 16,7 Mio Farben angezeigt werden.
Im GIF-Bildformat können maximal 256 Farben angezeigt werden.

JPG für photorealistische Grafiken

Fotoberarbeitungsprogramme bieten häufig die Option, die Images (speziell für die Darstellung im Web) in unterschiedlichen Qualitäten abzuspeichern. Bei einer Qualitätsminderung um 40% (Bildqualität 60%) vermindert sich die Dateigröße um beinahe 50%.

Bild rechts:

Dateigröße: 12,39 kB, Bildqualität: 60%
(100% Qualität wäre ca. 35 kB)
   
 


GIF und PNG-8 für Strichzeichnungen und Text

Weniger farbintensive Grafiken (ähnlich Comics) werden im GIF-Format erstellt. Rechts sehen sie eine verfremdete Grafik im GIF-Format. Die Darstellung mit nur wenigen Farben und die zwangsläufige grobe Abstufung ist gewollt. Hier wurde sogar auf die Darstellung von 256 Farben verzichtet. Das Image wurde mit 6 vorgegebenen Farben abgespeichert.



Dateigröße: 5,59 kB, Farben: 6
   



  Besonderheiten bei GIF-Dateien

Ein GIF-Image kann transparent sein.

Mit einem Grafikprogramm kann eine oder mehrere der 256 möglichen Farben als transparent bestimmt werden. In den Bildteilen erscheint das GIF-Image durchsichtig und der Hintergrund der Seite ist zu erkennen.    


Eine GIF-Datei (Format=89a) kann eine Animation enthalten.

Mit einem Animationsprogramm (z.B. Gif-Animator), können mehrere Bilder in einer Gif-Datei gespeichert werden. Diese werden nach dem Prinzip eines Daumenkinos dargestellt, wobei die Anzahl der Durchläufe und die Zeigedauer der einzelnen Bilder beliebig einstellbar ist.

Rechts eine (etwas holprige) Animation. Zur Demo sollte es reichen.

Bilddurchläufe: 9
Dateigröße: 6,79 kB
   




  PNG-Dateien

PNG-Bildformate (Portable Network Graphics) sollen die Eigenschaften von GIF und JPG kombinieren. Wie beim GIF ist hier Transparenz möglich. 8 und 24-Bit Farbtiefe stehen beim Speichern zur Auswahl (PNG-8, PNG-24). Außerdem können mit der Grafik auch Bildinformationen abgespeichert werden.

Bild rechts:

Web-Optimierte Grafik, 8 Bit, 29,2 kB
   


Leider ist eine Darstellung von transparenten PNG Dateien im IE6 standardmäßig nicht möglich. Wer mehr Info dazu herausfinden möchte, sucht bei Google nach 'Alphatransparenz' 'PNG' 'IE'.






NACH OBEN