Das Graphics Interchange Format (GIF), ist ein Bitmap-Bildformat, das von einem Team des Online-Dienstleisters CompuServe unter der Leitung des amerikanischen Informatikers Steve Wilhite am 1987 entwickelt wurde. Es hat sich aufgrund seiner breiten Unterstützung und Übertragbarkeit zwischen vielen Anwendungen und Betriebssystemen im World Wide Web weit verbreitet.

Das Format unterstützt bis zu 8 Bit pro Pixel für jedes Bild, so dass ein einzelnes Bild auf seine eigene Palette von bis zu 256 verschiedenen Farben verweisen kann, die aus dem 24-Bit-RGB-Farbraum ausgewählt werden. Es unterstützt auch Animationen und ermöglicht eine separate Palette von bis zu 256 Farben für jeden Frame. Diese Paletten-Beschränkungen machen GIF weniger geeignet für die Wiedergabe von Farbfotos und anderen Bildern mit Farbverläufen, aber es eignet sich gut für einfachere Bilder wie Grafiken oder Logos mit einfarbigen Bereichen.

GIF-Bilder werden mit der verlustfreien Datenkompressionstechnik Lempel-Ziv-Welch (LZW) komprimiert, um die Dateigröße zu reduzieren, ohne die Bildqualität zu beeinträchtigen. Diese Kompressionstechnik wurde 1985 patentiert. Die Kontroverse über den Lizenzvertrag zwischen dem Softwarepatentinhaber Unisys und CompuServe im Jahr 1994 hat die Entwicklung des Standards Portable Network Graphics (PNG) vorangetrieben.

Grafik: Transparenz in ein GIF einbauen

Frage:
Wie machst Du aus einem Gif mit Hintergrund z.b. weiss
einen transparenten Hintergrund?

Antwort:
Im Prinzip erzeugt man einen transparenten (durchscheinenden) Hintergrund bei einem GIF-Bild, indem eine Farbe des Bildes als "transparente Farbe" bestimmt wird. Fertig!

Vorgehen zum Erstellen eines Bildes mit transparentem Hintergund:

  • Ein Grafikprogramm nutzen, das das GIF-Format mit transparenter Farbe bearbeiten kann (können die meisten Grafikprogramme, wie z.B. PaintShopPro).
  • Von der Festplatte das zu bearbeitende Bild laden oder ein neues Bild erstellen.
  • Eine der maximal 256 Farben als Transparenzfarbe festlegen.
    Damit man die transparenten Bereiche beim Bearbeiten gut erkennen kann, definiere ich die Farbe, die transparent werden soll immer als "bilduntypische" Farbe. Also eine "krasse" Farbe, die im Bild normalerweise nicht vorkommt. Bsp.: Bei dem netten lächelnden Herrn mit der Brille links oben wäre grün sehr bilduntypisch.
  • Beim Erstellen des Bildes die Transparenzfarbe zunächst nicht verwenden.
  • Ist das Bild fertig, dann die entsprechenden Bereiche mit der transparenten Farbe füllen.
  • Das Bild im GIF-Format speichern und darauf achten, dass das Grafikprogramm das Bild mit der Tranzparenzinformation abspeichert (einstell- und überprüfbar im "save" oder "save as"-Fenster des Grafikprogramms oder bei den Farboptionen).
  • Prüfen, ob's geklappt hat, durch Einbau des Bildes auf einer HTML-Seite per <img> -Tag. Wird der Hintergrund der HTML-Seite im transparenten Teil des GIF-Bildes dargestellt, dann hat's funktioniert.

Hinweis:
Bei einer GIF-Animation muss der Hintergrund bei JEDEM Einzelbild festgelegt werden.

Grafik: GIFs optimieren

Frage:
Verrätst Du mir, durch welche "Daten-komprimierungs-Mühle"
Du die Grafiken jagst? Oder ob es ein bestimmtes Pack-Programm gibt,
mit welchem sich die Grafiken komprimieren lassen?!

Antwort:
Ein bestimmtes Komprimier-Programm gibt es nicht, weil die Problematik beim Datenreduzieren immer wieder andersartig ist. Aber ich versuche einmal in Stichpunkten zu erläutern, durch welche "Mühle" die GIFs bei mir gehen müssen.

  • Viele GIFs im Web haben unnötige Ränder (ein mehrere Pixel breiter Streifen für Distanz zum Text). Diese entferne ich und das GIF hat weniger Pixelbreite und/oder -höhe.
  • Häufig haben GIFs mehrere ähnliche dunkle Farben. (In den Farbanteilen Rot/Grün/Blau gesprochen sind das Farben mit Werten unter hexadezimal 30/30/30.) Diese fasse ich zu einer Farbe (00/00/00 = schwarz) zusammen. Das (mein) menschliches Auge erkennt den Unterschied nicht und das GIF hat weniger Farben.
  • Dann versuche ich ähnliche Farben zusammenzufassen, also Farben, deren RGB-Werte sehr eng beieinander liegen (bei photorealistischen Bildern gelingt dies meist nur bei dunklen Farben). Durch immer weiteres Reduzieren der Farben werden die Gifs immer kleiner. Ich vergleiche nach jeder Farbzusammenfassung das reduzierte GIF mit dem Original, um zu erkennen, ob es sichtbare Farbverluste gibt und ich "zu weit" komprimiert habe.
  • Bei Animationen kommt es gelegentlich vor, daß Einzelbilder oder komplette Einzelbildfolgen doppelt vorhanden sind. Hier lösche ich die doppelten Bilder/Folgen, optisch ändert sich nichts, die Dateigröße halbiert sich.
  • Gut reduzieren kann man Animationen, wenn sie aus vielen Bildern bestehen die nur gering von vorhergehenden Bildern abweichen. Hier lösche ich jedes zweite Bild. Dadurch wird der Ablauf der Animation schneller. Ich erhöhe die Darstellungsdauer der Einzelbilder etwas, damit die Animation wieder etwas langsamer läuft. Dadurch halbiert sich die Dateigröße.
  • Bei Animationen kann man noch die "Übergangsart" zwischen den Bildern geschickt ausnutzen, um die Datei weiter zu verkleinern. Häufig ändert sich beim Übergang von einem zum nächsten Bild nämlich nur ein kleiner Teil der optischen Darstellung. Also kann man hier das erste Bild "ungelöscht" stehen lassen und beim zweiten Bild nur die Pixel anzeigen lassen, die sich im Vergleich zum vorhergehenden Bild tatsächlich ändern. Hier kann bytemäßig kräftig gespart werden.

Zum Erstellen und Bearbeiten von GIF-Bildern benutze ich die (ältere) Version 5 von Paint Shop Pro. Für Farbreduktion und "Restarbeiten" nehme ich die (ältere) Version 1.5 des GIF-Animators von ULEAD. Beide Progs sind vollkommen ausreichend und sicherlich günstig bei Ebay zu bekommen.

Beim Erstellen von GIFs nutze ich die oben beschriebenen "Erfahrungen" und verzichte auf unnötigen GIF-SchnickSchnack. Das hält die GIF-Dateien klein und sie können schnell nachgelesen und auf Homepages angezeigt werden.

"Auf Festplatte werden Bilder angezeigt, im Internet nicht..."

Frage:
Nach der Übertragung immer wieder dasselbe. Ein Rahmen jedoch kein Bild darin sondern ein rotes X.
Antwort:
Wie funktioniert das Anzeigen von Bildern über das Web?:
Man tippt eine URL im Browser ein und dieser fordert die entsprechende HTML-Datei vom Internet-Webserver an. Sobald der Browser die HTML-Datei empfangen hat zeigt er den Text der Datei an. Danach fordert der Browser alle in der HTML-Datei enthaltenen Objekte (Grafiken, Sounds,...) vom Webserver an. Sobald ein Grafikobjekt ankommt wird es angezeigt. Findet der Webserver eine Grafik nicht, dann sagt er es dem Browser und dieser zeigt statt dessen einen leeren Rahmen mit einem roten Kreuz an.

Warum wird ein Objekt wie z.B. eine Grafikdatei nicht gefunden?
  • Weil sie nicht im angegebenen Verzeichnis steht?
  • Weil sie nicht unter dem angegebenen Namen existiert (Groß-/Kleinschreibung beachten)?

Beispiel:
In einer HTML-Datei steht <img src="abc.gif"...>. Der Browser fordert hier also ein Bild aus dem aktuellen Verzeichnis mit dem Namen "abc.gif" an. Kommt statt dessen ein rotes Kreuz, dann kann es folgende Fehlerursachen geben:
  • Das Bild liegt nicht im aktuellen Verzeichnis, sondern in einem Unterverzeichnis (also z.B. <img src="images/abc.gif"...>).
  • Der Dateiname ist anders, beachte besonders die Groß-/Kleinschreibung, also statt "abc.gif" heißt es "ABC.gif" oder "abc.GIF" oder "Abc.gif").
  • Der Dateiname enthält Umlaute? Das kann eine Fehlerursache sein, ich würde keine Umlaute in Dateinamen benutzen.
  • Das Bild ist überhaupt nicht vorhanden, weil es vergessen wurde, es per FTP auf den Webserver zu kopieren.
  • Der Webspace ist voll und es kann nichts mehr übertragen werden.
  • Nach dem Übertragen dauert es ein paar Minuten, bis Objekte zur Verfügung stehen. Hab ich früher mal bei meinem T...-Hoster erlebt.

Tipp:
Am besten schreibst Du die Namen aller Bilder komplett klein. Also statt "Bild.GIF" besser "bild.gif". Dann sind Groß-/Kleinschreibfehler schon mal ausgeschlossen.

Frage:
beim erstellen einer Homepage mit Frontpage aber zeigt er die grafiken nicht an , hast du vielleicht einen Tip?
Antwort:
Es könnte sich um das alte Problem handeln, dass Frontpage manchmal die Groß-/Kleinschreibung von Homepagedateien ändert ohne zu fragen! Prüf nach, ob nach dem Upload der Dateien auf den Server die Pfadangaben und die Groß-/Kleinschreibungen stimmen.

Animationen kann ich nur als BMP speichern statt als GIF...

Frage:
Ich möchte gerne eine Deiner Animation abspeichern, aber immer wenn ich das GIF anklicke und "speichern unter" wähle, kann ich es nur als "bmp" speichern. Ist das ein Kopierschutz von Dir?
Antwort:
Nein, hier gibt es keinen Kopierschutz.
Wenn Du mit der rechten Maustaste auf ein GIF klickst und es per "Bild speichern unter" auf der Festplatte speichern möchtest und Dein Browser nur das Format BMP zum Speichern anbietet, dann handelt es sich um ein Problem Deines Browsers. Du nutzt den Internet Explorer und dieser hat gelegentlich das Problem, dass sein Cache-Speicher voll ist. Dann bietet er interessanterweise nur noch das BMP-Format zum Speichern an.

Leere einfach den Cache Deines Browser per [Extras] [Internetoptionen] [Temporäre Dateien Löschen] und schliesse dann alle Browserfenster. Eventuell musst Du sogar Deinen Rechner einmal neu starten. Anschließend sollte das Speichern der GIFs als GIFs wieder funktionieren.
Alternativ kannst Du auch einen anderen Browser nutzen (Netscape, Firefox, Opera...), dort gibt es das Probelm nicht.

"Wieso bewegen sich die kopierten Animationen nicht?"

Frage:
... Dann speicherte ich das GIF auf Festplatte und wenn ich es wieder aufrufe, wackelt nichts!!!!!! Das kann doch nicht richtig sein!
Antwort:
Also, zum Wackeln -äh- Anzeigen von Animationen brauchst Du ein Programm, das diese auch anzeigen kann.
BILDER (Nichtwackler :-) können mit jedem beliebigen Grafikprogramm angezeigt werden, aber für ANIMATIONEN brauchst Du ein Animationsprogramm. Oder Du nutzt Deinen Browser und gibst oben als URL statt "http://irgendwas..." den Festplattenpfad zu dem gespeicherten GIF an, also z.B. "C:/temp/anim123.gif". Nicht animationsfähige Grafikprogramme zeigen von einer Animation nur das erste Bild an, und das wackelt dann nicht.

Frage:
das downloaden von gif-animationen funktioniert nicht bitte können sie mir helfen danke
Antwort:
Wenn Du in meiner GIF-Galerie eine Animation mit der rechten Maustaste anklickst und per "Bild speichern unter" als GIF-Datei auf deiner Festplatte ablegst, dann hast Du die Animation korrekt auf deine Festplatte kopiert. Zum Anzeigen von Animationen brauchst Du nun ein Programm, das diese auch darstellen kann. Also einen GIF-Animator, einen "GIF-Viewer" oder einfach einen Browser (dort in der URL statt "http://irgendwas..." den Festplattenpfad angeben, Bsp.: "D:/gifs/anim123.gif").


Hinweise zu GIFs:
In einer GIF-Datei kann mit jedem gängigen Grafikprogramm eine Farbe als transparente Farbe festgelegt werden. Die Bildteile mit der Transparnezfarbe sind durchsichtig und der Hintergrund (das Hintergrundbild) der Homepage ist zu erkennen.
Eine GIF-Datei kann eine Animation enthalten. Dazu mehrere Einzelbilder mit einem Animationsprogramm in einer Gif-Datei speichern. Diese werden nach dem Prinzip des Daumenkinos dargestellt, wobei die Anzahl der Durchläufe und die Anzeigedauer der einzelnen Bilder einstellbar ist. Auch eine Animation kann eine transparente Farbe beinhalten.