Benutzerhandbuch Abbrechen

Optimieren von Bildern für das GIF- oder PNG-8-Format

Suchen

Zuletzt aktualisiert am 30. April 2021

GIF-Format

Das GIF-Format verwendet 8-Bit-Farbe und komprimiert Farbflächen effizient, wobei scharfe Details in Strichgrafiken, Logos oder Text erhalten bleiben. Darüber hinaus können Sie im GIF-Format animierte Bilder erstellen und Transparenz in Bildern beibehalten. GIF wird von den meisten Browsern unterstützt.

Das GIF-Format verwendet LZW-Komprimierung, eine verlustfreie („lossless“) Komprimierungsmethode. Da GIF-Dateien allerdings auf 256 Farben begrenzt sind, kann die Optimierung eines 24-Bit-Originalbilds als 8-Bit-GIF-Datei zum Verlust von Farbdaten führen.

GIF-Bild mit selektiver Farbkorrektur und Webfarbe — GIF-Bild mit Farbtabelle „Selektiv“ (links) und mit Farbtabelle „Web“ (rechts)

Sie können die Zahl der Farben im GIF-Bild wählen und das Dithering der Farben im Browser steuern. Das GIF-Format unterstützt Hintergrundtransparenz und -farbe, wobei die Bildkanten an den Hintergrund einer Webseite angeglichen werden.

PNG-8-Format

Das PNG-8-Format verwendet 8-Bit-Farbe. Wie das GIF-Format komprimiert auch das PNG-8-Format Farbflächen auf effiziente Weise und erhält dabei scharfe Details in Strichgrafiken, Logos oder Text.

Da PNG-8 nicht von allen Browsern unterstützt wird, sollten Sie dieses Format nicht verwenden, wenn Sie das Bild einem breiten Publikum zugänglich machen möchten.

Beim PNG-8-Format werden komplexere Komprimierungsschemata als bei GIF-Dateien verwendet. Die Dateien können daher je nach den Farbmustern des Bildes 10 % bis 30 % kleiner sein als GIF-Dateien desselben Bildes. Obwohl PNG-8 eine Methode zur Lossless-Komprimierung, also verlustfrei ist, kann die Optimierung eines 8-Bit-Originalbilds als 24-Bit-PNG-Datei zum Verlust von Farbinformationen führen.

Hinweis:

Vor allem bei Bildern mit wenigen Farben und einfachen Mustern kann durch GIF-Komprimierung eine kleinere Datei erstellt werden als durch PNG-8-Komprimierung. Zeigen Sie optimierte Bilder im GIF- und PNG-8-Format an, um die Dateigröße zu vergleichen.

Wie beim GIF-Format können Sie die Zahl der Farben im Bild wählen und das Dithering der Farben im Browser steuern. Das PNG-8-Format unterstützt Hintergrundtransparenz und Hintergrundfarbe, wobei Sie die Bildkanten an die Hintergrundfarbe einer Webseite angleichen.

we_04 — PNG-8 mit 256 Farben und ohne Dithering (links) und PNG-8 mit 16 Farben und mit Dithering (rechts)

Optimieren von Bildern im GIF- oder PNG-8-Format

GIF ist das Standardformat für das Komprimieren von Bildern mit großen Farbflächen und scharfen Details in Strichgrafiken, Logos oder Text. Wie das GIF-Format unterstützt auch PNG-8 Transparenz und komprimiert Farbflächen, wobei Details erhalten bleiben. Nicht alle Webbrowser können jedoch PNG-8-Dateien anzeigen.

Öffnen Sie ein Bild und wählen Sie „Datei“ > „Für Web speichern“.
Wählen Sie „GIF“ oder „PNG-8“ als Optimierungsformat.
Aktivieren Sie die Option „Interlaced“, um ein Bild während des Ladens im Browser in niedriger Auflösung anzuzeigen. Bei dieser Methode erscheint die Ladezeit kürzer und die Besucher Ihrer Website sehen, dass tatsächlich ein Ladevorgang stattfindet.
Wählen Sie unter dem Menü für das Optimierungsformat einen Farbreduzierungsalgorithmus zum Erstellen der Farbtabelle:

Perzeptiv

Erstellt eine eigene Farbtabelle, indem Farben, auf die das menschliche Auge sensibler reagiert, Priorität erhalten.

Selektiv

Erstellt eine der perzeptiven Farbtabelle ähnliche Farbtabelle, wobei jedoch breite Farbbereiche und die Erhaltung von Webfarben Vorrang haben. Aus dieser Farbtabelle werden normalerweise Bilder mit der höchsten Farbintegrität erzeugt. („Selektiv“ ist die Standardoption.)

Adaptiv

Erstellt eine eigene Farbtabelle durch Aufnehmen von Farben aus dem Spektrum, das im Bild am häufigsten vorkommt. Für ein Bild, das z. B. nur Grün- und Blauschattierungen enthält, wird eine Tabelle erstellt, die hauptsächlich aus Grün- und Blautönen besteht. Bei den meisten Bildern sind Farben in bestimmten Bereichen des Spektrums konzentriert.

Restriktiv (Web)

Verwendet die Standardtabelle mit 216 websicheren Farben, die für die 8-Bit-Paletten (256 Farben) von Windows und Mac OS gültig ist. Durch diese Option wird sichergestellt, dass beim Anzeigen des Bildes mit 8-Bit-Farbe kein Browser-Dithering auf Farben angewendet wird. Enthält Ihr Bild weniger als 216 Farben, werden nicht verwendete Farben aus der Tabelle entfernt.
Wählen Sie zum Einstellen der maximalen Anzahl von Farben eine Zahl aus dem Menü „Farben“ des Farbbedienfelds, geben Sie einen Wert in das Textfeld ein oder ändern Sie die Zahl der Farben mit den Pfeilen. Enthält das Bild weniger Farben als das Bedienfeld, so spiegelt die Farbtabelle nur die kleinere Anzahl der Farben im Bild wider.
Wenn Sie als Farbreduzierungsalgorithmus „Restriktiv (Web)“ einstellen, können Sie aus dem Menü „Farben“ die Option „Auto“ wählen. Wählen Sie „Auto“, wenn die optimale Anzahl der Farben in der Farbtabelle von Photoshop Elements auf der Grundlage der Farbhäufigkeit im Bild bestimmt werden soll.
Wählen Sie einen Dither-Prozentwert, indem Sie einen Wert im Textfeld „Dither“ eingeben oder indem Sie auf den Pfeil an dem Feld klicken und den daraufhin eingeblendeten Regler ziehen.
Wenn das Bild Transparenz enthält, aktivieren Sie „Transparenz“, um transparente Pixel zu erhalten. Deaktivieren Sie die Option, wenn vollständig und teilweise transparente Pixel mit der Hintergrundfarbe gefüllt werden sollen.
Wenn Sie eine animierte GIF-Datei erstellen möchten, aktivieren Sie „Animieren“.
Wenn Sie das optimierte Bild speichern möchten, klicken Sie auf „OK“. Geben Sie im Dialogfeld „Optimierte Version speichern unter“ einen Dateinamen ein und klicken Sie auf „Speichern“.

Erstellen einer animierten GIF-Datei

Platzieren Sie die Bilder, die in den Frames der Animation angezeigt werden sollen, auf separaten Ebenen des Ebenenbedienfelds. Wenn Sie z. B. die Animation eines zwinkernden Auges erstellen möchten, legen Sie ein Bild des geöffneten Auges auf einer Ebene ab, ein Bild des geschlossenen Auges auf einer anderen.
Wählen Sie „Datei“ > „Für Web speichern“.

Hinweis:

Befinden sich mehrere Ebenen im Bild, können Sie das Dialogfeld „Für Web speichern“ auch über das Dialogfeld „Speichern unter“ öffnen. Wählen Sie dazu das Format „CompuServe GIF“ und aktivieren Sie „Ebenen als Frames“.
Optimieren Sie das Bild im GIF-Format.
Aktivieren Sie „Animieren“.
Legen Sie im Abschnitt „Animation“ des Dialogfelds weitere Optionen fest:

Wiederholungsoptionen

Wiederholen Sie die Animation in einer Schleife in einem Webbrowser oder animieren Sie nur einmal. Sie können auch „Andere“ wählen, um die Anzahl der Schleifen für die Animation festzulegen.

Frameverzögerung

Legt die Zahl der Sekunden fest, für die jeder Frame im Webbrowser angezeigt wird. Sekundenbruchteile können Sie durch Dezimalwerte angeben, z. B. 0,5 für eine halbe Sekunde.