Diese Anleitung zeigt Dir, wie Du Fotos mit Photoshop 7.01 für's Web optimierst. Sie wurde aus verschiedensten Quellen erarbeitet. Die Anleitung kann auch für Photoshop CS und Elements verwendet werden. Einige Befehle heissen dort ein wenig anders.

Für Pixelbilder eignet sich üblicherweise das JPG-Format. Das ebenfalls im Web verbreitete GIF-Format ist eher sinnvoll für flächig eingefärbte, comicartige Grafiken, z.B. Logoabbildungen.

Bilder werden im Web immer mit der Monitorauflösung, also mit 72 dpi dargestellt (manche Monitore haben eine etwas feinere Auflösung).

Wir müssen uns also nur um die richtige Anzahl der Pixel in horizontaler und vertikaler Richtung kümmern. In der Praxis sollte man sich an 800 Pixel Breite und 600 Pixel Höhe orientieren, um auch Benutzern mit kleinerem Monitor die Chance zu geben, die Bilder anzusehen mit wenig scrollen.

In Photoshop 7.01 wählst Du über Bild > Bildgrösse > Auflösung = 72 Pixel/Zoll die für die Monitordarstellung richtige Grösse.

Innerhalb des RGB-Modus gibt es zwei weit verbreitete Farbrräume: Adobe-RGB und sRGB.

Der Adobe-Farbraum hat den Vorteil, dass er grösser ist, es lassen sich also mehr Farben in ihm darstellen. Er eignet sich zudem besser für die spätere Umwandlung in den CMYK-Modus, wenn das Bild z.B. im Offsetdruck erscheinen soll (Zeitschrift, Prospekt o.ä.).

 

Der Farbraum sRGB hingegen ist deutlich kleiner, sorgt aber für eine relativ gleiche Darstellung der Farben in den gängigen Internetbrowsern. Für die Verwendung im WWW ist es also ratsam, in der Bildbearbeitung auf diesen Farbraum zu wechseln um einen möglichst genauen Eindruck davon zu haben, wie sich das jeweilige Bild auf anderen Rechnern darstellt.

 

Unschöner Effekt - Wieso?

Arbeitet man mit Adobe-RGB in Adobe-Photoshop und exportiert dann die Bilder mit > Datei > Für Web speichern, so werden die Farben nach sRGB konvertiert. Das Bild wirkt dann heller und die Farben leuchten nicht mehr so kräftig. Um solche bösen Überraschungen zu vermeiden, sollte schon bei der Bearbeitung von Bildern für das Web sRGB in Photoshop Verwendung finden.

Lösung

Unter >Ansicht wählen wir > Proof einrichten und dann >Windows-RGB.

Jetzt müssen wir nur noch darauf achten, dass im "Ansicht"-Menü die Option "Farb-Proof" angewählt ist. Nun werden unsere Farben schon innerhalb von Photoshop so dargestellt, wie sie nach dem "Für Web speichern" aussehen und können gegebenenfalls von uns nachgesteuert werden.

Alternative (weniger empfohlen, da die Bilder wahrscheinlich nicht nur für Webdarstellung Verwendung finden sollen)

Eine weitere Möglichkeit, um unschöne Farbänderungen nach der Aufbereitung von Bildern für das WWW zu vermeiden, besteht darin, von Anfang an im sRGB-Farbraum zu arbeiten. Dies macht jedoch nur dann Sinn, wenn man die Daten nicht später im Offset-Druck, oder auf profilierten Belichtern ausgeben möchte. Dazu wählt man im "Photoshop"-Menü wählt man die "Farbeinstellungen". Dort legt man als Arbeitsfarbraum "sRGB" fest. In den Farbmanagement-Richtlinien wählt man die Option "In RGB-Arbeitsfarbraum konvertieren". Nun arbeitet man generell in sRGB und erlebt beim "für Web speichern" keine bösen Überraschungen mehr.

Meine anderen Tipps und Tricks findest Du hier: