Bildbearbeitungs-Lehrgang


Hans-Peter Zimmermanns Kurz-Lehrgang

Bildbearbeitung für Webmaster

In wenigen Minuten vollständig im Bild sein über Bildformate, Datei-Arten, Farbkorrekturen und Bilderschärfen…


 

An meinem Seminar Internet-Power habe ich immer wieder festgestellt, wie wenig die künftigen Webmaster über Bildbearbeitung wissen. Na ja, woher sollten sie diese Informationen auch bekommen? Einmal mehr habe ich beschlossen, die Informationslücke zu füllen.

In diesem Lehrgang erfahren Sie:

Bildbearbeitung Welche Farbsysteme es gibt und was sie bedeuten
Bildbearbeitung  Welches Farbsystem Sie für welchen Zweck wählen sollten
Bildbearbeitung  Mit welcher Auflösung Sie scannen sollten
Bildbearbeitung  Welche Bilddatei-Formate es gibt und warum Sie sie kennen sollten
Bildbearbeitung  Wie man eine einfache Farbkorrektur vornimmt

Sind Sie bereit? Dann nichts wie los…

 

Welche Farbsysteme gibt es?


1. Das HSB-Modell

HSB steht für die englischen Wörter Hue, Saturation, Brightness. Zu deutsch: Farbton, Farbsättigung, Helligkeit.
Der Farbton zeigt die Grundfarbe an. Orange ist zum Beispiel ein Farbton, grün ein anderer. Die Sättigung zeigt an, wie kräftig eine Farbe ist. Grundfarben haben eine hohe Sättigung, Pastelltöne eine geringere, und Grautöne sind gänzlich ungesättigt. Die Helligkeit schließlich zeigt an, wieviel Weiß- oder Schwarzanteile eine Farbe besitzt.

bildformate-fuers-internet-picker

Das HSB-Modell ist wohl dasjenige, das unserem natürlichen Farb-Empfinden am nächsten kommt. Computer verwenden daher bei Farbauswahl-Menüs in der Regel dieses Modell.

 

2. Das RGB-Modell

RGB steht für Red, Green und Blue. Zu deutsch: Rot, Grün und Blau. Die gängigen Computer-Monitore wie auch die Fernseh-Bildschirme funktionieren nach diesem System.

was-bedeutet-gif-rgb

Bei einem Monitor schießt eine Elektronenkanone unterschiedlich starke Ströme auf rote, grüne und blaue “Phosphorpünktchen”. Diese Pünktchen können Sie übrigens sehen, wenn Sie Ihren Monitor mit einer Lupe betrachten. Die Kombination dieser winzig kleinen farbigen Lichtpunkte bewirkt im menschlichen Auge die Illusion eines Bildes.

Die Kombination von 100 Prozent Rot, 100 Prozent Grün und 100 Prozent Blau ergibt Weiß. Dieses System nennt sich daher ein “additives” Farbsystem.

 

3. Das CMY-Modell

CMY steht für Cyan, Magenta und Yellow. Zu deutsch: Cyan, Magenta und Gelb. Erfunden wurde dieses Modell für die Druck-Industrie. “Warum?” werden Sie sich fragen. “Wo es doch bereits RGB gab?” Gute Frage. Um die Antwort zu verstehen, müssen Sie zuerst wissen, dass es zwei Sorten von Farben gibt: Transparente Farben und reflektierte Farben. Bei einem Diapositiv zum Beispiel leuchtet eine Lichtquelle durch das Bild hindurch. Der Profi spricht hier von einer Durchsicht-Vorlage. Bei einem Papierbild wird die Farbe vom Papier reflektiert. Der Profi nennt das eine Aufsicht-Vorlage.

Nun das Problem: Das RGB-Modell funktioniert tadellos bei Durchsicht; bei Aufsicht jedoch versagt es kläglich. Beispiel: Die Kombination “Rot und Grün” bewirkt auf Ihrem Monitor ein leuchtendes Gelb, auf Papier jedoch ein matschiges Braun.

bildbearbeitung-cmyNull Prozent von Cyan, Magenta und Gelb ergibt Weiß. Das CMY-System wird daher ein subtraktives Farbsystem genannt. Subtrahieren heißt wegnehmen. Je mehr man wegnimmt von jeder Farbe, desto heller wird das Resultat.

bildbearbeitung-cmy2100 Prozent Cyan, 100 Prozent Magenta und 100 Prozent Gelb müssten theoretisch schwarz ergeben. In Wirklichkeit ergeben sie jedoch ein matschiges Braun-Violett. Der Grund liegt in der Unreinheit der Druckerfarben. Vor allem Cyan ist ein echtes Problem. Cyan-Druckerfarbe ist oftmals nur zu 70 Prozent effektiv, das heißt zu 30 Prozent mit anderen Farben verunreinigt. Magenta und Gelb bringen es dagegen wenigstens auf 97 Prozent Effektivität.

Daraus ergeben sich weitreichende Konsequenzen:

  • Erstens: Eine Farbseparation für den Druck verlangt immer eine Korrektur des Cyan-Kanals.
  • Zweitens: Um beim Druck ein sauberes Schwarz hinzukriegen, müssen wir nicht mit drei, sondern mit vier Farben drucken. Als vierte “Farbe” wird Schwarz hinzugefügt. Daraus entsteht dann das CMYK-Modell…

 

4. Das CMYK-Modell

Was CMY bedeutet wissen wir ja schon. “K” steht für “Keine Ahnung, warum K für Schwarz steht”. Spaß beiseite: Die Amerikaner (oder waren es die Briten?) haben “K” gewählt, damit man das “B” von “Black” nicht mit dem “Blue” des RGB-Systems verwechselt.

bildbearbeitung-cmykMit CMYK haben wir zwar nicht ein perfektes Farb-System für die Druck-Industrie, aber immerhin ein brauchbares und verhältnismäßig wirtschaftliches.

 

 

Was sind die Unterschiede zwischen den einzelnen Farbsystemen?



welche-bildformate-gibt-es-range

Die Grafik macht es deutlich: Photographischer Film kann etwa die Hälfte der Farbnuancen abbilden, die das menschliche Auge wahrnehmen kann. Ein RGB-Monitor ist fast so gut wie photographischer Film. Am schlechtesten jedoch ist das CMYK-System des Vierfarben-Drucks.

Das ist übrigens der Grund, warum der Farbwähler von Adobe Photoshop bei vielen Farben (besonders bei Blautönen) ein Warnzeichen liefert

wie-schaerfe-ich-ein-bild-warn

Dieses “Pannendreieck” bedeutet: “Achtung. Beim Druck ist diese Farbe nicht sauber reproduzierbar!”

 

Warum verwendet man nicht mehr als vier Druckfarben?

 

Antwort: Manchmal tut man das. Zum Beispiel könnte die Firma IBM ihren Firmenprospekt mit fünf Farben drucken lassen: Cyan, Magenta, Gelb, Schwarz und als Zusatzfarbe ihr IBM-Blau. So eine Zusatzfarbe nennt sich im Englischen “Spot Color”, im Vergleich zu den “Process Colors” des Vierfarben-Prozesses.

Es gibt auch einen Sechsfarben-Prozess, zum Beispiel das von Pantone entwickelte Hexachrome. Der Nachteil: Ziemlich teuer und wirklich nur dann zu empfehlen, wenn Farbtreue sehr wichtig ist.
Kunst-Reproduktionen werden mit bis zu 17 Prozess-Farben durchgeführt. Auch hier liegt der Nachteil auf der Hand: Nicht nur relativ teuer, sondern saumäßig!

 

Das CIE-Farbmodell

 

Ein großer Nachteil aller bisher diskutierten Farbmodelle ist der, dass sie abhängig sind vom Gerät, auf dem die Farben reproduziert werden. Beispiel: Eine Kombination von RGB-Werten produziert auf unterschiedlichen Monitoren unterschiedliche Farbnuancen.

Um dieses Problem zu lösen, entwickelte 1931 die “Commission Internationale de l’Eclairage” (CIE) das XYZ-Modell, das die Farben in drei Achsen darstellte. In den 60er und 70er Jahren wurde dieses Modell weiterentwickelt, und das Populärste davon ist heute “CIE Lab”, das auch als Farbmodell in der PostScript-Sprache und in den heutigen Bildbearbeitungs-Programmen wie z.B. Photoshop zur Anwendung kommt.

LAB steht für:

  • Luminanz (Helligkeit)
  • Farbkanal A
  • Farbkanal B

Die Tatsache, dass in einem Kanal nur die Schwarzweiß-Information gespeichert ist, hat Vorteile: Wenn man beispielsweise ein Farbbild schärfen will, ohne die Farben zu verfälschen, wählt man “LAB-Farbe” und schärft lediglich den Luminanz-Kanal.

 

Wie geht das mit dem Schärfen?

 

Zunächst einmal gilt: Jedes gescannte Bild muss geschärft werden, da es beim Scannen an Schärfe verliert! Profi-Scanner können das Schärfen auf Wunsch schon während des Scannens übernehmen; bei Desktop-Scannern muss im Bildbearbeitungs-Programm nachgeschärft werden.

In Photoshop sollte man immer den Befehl “unscharf maskieren” wählen, weil man hier Einfluss nehmen kann auf verschiedene Parameter:

wie-schaerfe-ich-ein-bild-unscharf Ein Bild direkt nach dem Scannen…
was-bedeutet-jpg-scharf …und nach der Anwendung von “Auto-Tonwertkorrektur” und “Unscharf maskieren”

Also, ich habe nichts anderes getan als:

wie-schaerfe-ich-ein-bild-tonkorr

und:

bildformate-fuers-internet-mask

Das zweite Bild ist zwar immer noch nicht das Gelbe vom Ei (wir sprechen hier nicht von dem schmucken Jüngling, sondern von der Bildqualität!), aber immerhin besser als das erste.

Der Profi unterteilt ein Bild grob in “Lichter” (helle Töne), Mitteltöne und “Tiefen” (dunkle Töne). Wenn sie also in Zukunft einen Experten sagen hören “Das Bild säuft in den Tiefen etwas ab”, dann können Sie ganz klug dreinschauen und nicken 😉
Der Profi würde jetzt messen, ob in den Tiefen noch Farb-Informationen vorhanden sind, die man durch einen besseren Kontrast zum Vorschein bringen könnte. Das habe ich für Sie getan, und ich muss Sie enttäuschen: Das Bild gibt nicht mehr her.

 

Welche Auflösung und welches Farbsystem muss ich wählen?

 

Damit Sie es gleich wissen: Fürs Internet benötigen Sie lediglich eine Auflösung von 72 dpi. Wenn Sie Bilder von höherer Auflösung ins Netz legen, benötigen sie nur unnötig lange Ladezeiten.

Falls Sie ein Bild nicht nur fürs Internet, sondern auch für Drucksachen benötigen, kommt es drauf an, ob Sie Fotos oder Strichgrafiken bearbeiten. Bei Fotos gilt: 1,8 mal die Auflösung des Endgerätes. Drucken Sie beispielsweise auf einem 600 dpi Laser, scannen Sie mit 1,8 x 600 = 1080 dpi. Wenn Sie dasselbe Bild nur in der halben Größe benötigen, dann halbieren Sie auch die Auflösung. Wenn Sie es doppelt so groß haben wollen, verdoppeln Sie die Auflösung. Alles klar?

Bei Strichgrafiken scannen Sie mit 1000 dpi mal den Vergrößerungs-Faktor Wenn Sie das Bild also nur halb so groß brauchen wie die Vorlage, scannen Sie mit 500 dpi, wenn Sie es doppelt so groß brauchen, mit 2000 dpi.
Falls Sie Ihre Strichgrafik nur auf einem Desktop-Printer ausdrucken wollen, genügt das Scannen mit der Drucker-Auflösung. Für einen 600-dpi-Drucker scannen Sie also mit 600 dpi. Auch hier gilt: Immer mal den Vergrößerungsfaktor rechnen. Wenn Sie die Strichgrafik also nur halb so groß brauchen, genügen in unserem Beispiel 300 dpi.

Legen Sie dann eine geschärfte RGB-Version des Bildes ab für spätere Anwendungen und specken Sie eine Kopie des Bildes auf 72 dpi ab fürs Internet:

bildbearbeitung-72

ACHTUNG: Sie können nicht beliebig zwischen RGB- und CMYK-Farben hin- und her klicken! Denken Sie daran: CMYK enthält viel weniger Farbinformationen und gibt erst noch die größeren Dateien, weil es sich um vier anstatt nur um drei Kanäle handelt. CMYK dürfen Sie also nur für den Vierfarbendruck verwenden.
Wenn Sie eine RGB-Datei einmal umgewandelt haben in CMYK, können Sie zwar wieder zurück klicken auf RGB. Die ursprüngliche Farb-Information bleibt jedoch ein- für allemal verloren.

Wenn Sie Ihr Bild ins Internet hochladen wollen, müssen Sie nicht nur entscheiden zwischen Farb-Systemen, sondern auch zwischen den verschiedenen Dateiformaten. Dazu kommen wir jetzt gleich…

 

Bilddatei-Formate, und warum wir sie kennen sollten…

JPEG

Bilddateien, vor allem wenn sie qualitativ hochstehend sind, können riesengroß sein. Es wundert daher nicht, dass sich die Experten aller Länder seit Jahren mit der Kompression von Bildern auseinandersetzen. So auch die Joint Photographic Experts Group (JPEG).
Die JPEG-Kompression kann die Größe einer Bilddatei bis zu 10 mal kleiner machen, ohne dass die Qualität darunter leidet. Wer geringe Qualitätseinbussen in Kauf nehmen will, kann sogar mit dem Faktor 20:1 arbeiten.
Der Nachteil von JPEG: Die Kompression sollte nur einmal angewendet werden. Mehrfache Kompressions-Dekompressions-Zyklen bewirken eine deutliche Verschlechterung der Bildqualität.
JPEG kann plattformunabhängig von allen Web-Browsern gelesen werden.

TIFF

TIFF oder “Tag Image File Format” ist eines der wichtigsten Bilddatei-Formate, da es praktisch von allen Scannern, Digital-Kameras und Layout-Programmen plattformunabhängig gelesen werden kann und jedes Pixelchen auch nach dem hundertsten Öffnen detailgenau reproduziert.
Die Kompressionsrate beträgt allerdings nur etwa 50 Prozent. Für das Internet ist das zu wenig, und daher wird TIFF online nicht verwendet, und die Browser können das Format auch nicht lesen.

EPS

EPS steht für “Encapsulated PostScript”. Ein EPS-File besteht aus zwei Teilen: Der Grafik selbst und einer niedrig auflösenden Vorschau (Preview) für den Bildschirm.
EPS wird in der Regel für das Speichern von Vektor-Grafiken verwendet.
Auch EPS-Files sind relativ groß und daher fürs Internet ungeeignet.

DCS

Desktop Color Separations ist eine Variation des EPS-Formats und wurde früher oft in der Druck-Industrie verwendet. Heute kommt es beispielsweise noch zum Zug bei Hexachrome-Druck, weil die heutige Version von DCS die Informationen von bis zu acht Farbkanälen speichern kann.
Für das Internet ist dieses Format irrelevant.

PICT

Das PICT-Format war einmal ein Mac-Standard für Bitmap- und Vektor-Bilder und funktionierte hervorragend in Multimedia-Applikationen für den Mac. Leider unterstützt es keine Farbseparationen und ist auch nicht Windows-kompatibel.

BMP

Bitmap, ein ähnlicher Exot wie PICT, nur diesmal aus der Windows-Welt.

Image Pac

Wurde von Kodak für ihr Photo-CD-System entwickelt und enthält fünf verschiedene Auflösungen desselben Bildes nach dem PhotoYCC-System.

FlashPix

Der langsame Bildschirm-Aufbau früherer Computer brachte die Entwickler auf die Idee, ein Bilddatei-Format zu kreieren, das mit einer niedrig auflösenden und schnell ladenden Bildschirm-Version arbeitet und im Hintergrund die hochauflösenden Bilddaten errechnet.
Eines dieser Systeme ist FlashPix, von Live Picture entwickelt, von Kodak, Hewlett-Packard und Microsoft unterstützt.

PNG

PNG steht für “Progressive Network Graphics”. Es handelt sich um ein Format, das speziell für die elektronische Verbreitung von Grafiken entwickelt wurde: Eine niedrig auflösende Version des Bildes wird sofort auf dem Bildschirm angezeigt und anschließend bis zur hochauflösenden Qualität verbessert. Der Vorteil des PNG-Formats: Der Alphakanal, also die Information über die Transparenz von Farben, wird mitgespeichert. Das ist wichtig, wenn man eine Grafik freistellen will.

GIF

GIF oder “Graphics Interchange Format” ist eine komprimierte Bitmap-Datei. GIF hatte sich eine Zeitlang neben JPEG als Standard im World Wide Web etabliert. Die Browser können das Format immer noch lesen, aber bei Grafiken wählt man heute am besten PNG.

 

Welches Bildformat für welchen Zweck?

Da dies ein Lehrgang für Webmaster ist, beschränke ich mich auf die Anwendung im Internet:
Durchgesetzt haben sich bis heute JPEG, GIF und PNG.
JPEG kann bis zu 16,7 Millionen Farben pro Bild speichern und ist daher überall dort angebracht, wo Farbtreue wichtig ist.
GIF kann zwar nur 256 Farben pro Bild speichern, ist aber für Multimedia-Anwendungen, wo Farbtreue eher im Hintergrund steht, ein sehr attraktives Format, vor allem auch mit seinen Variationen “Interlaced”, “Animated” und “Transparent”.
Heute wird bei Grafiken meistens PNG verwendet.
Mehr darüber finden Sie im HTML-Wiki.

Übrigens, falls Photoshop Ihnen zu teuer ist und zu viel kann, gibt es mit dem GraphicConverter eine preisgünstige Alternative.

 

Einfache Bildkorrekturen, die auch ein Laie vornehmen kann…

Wer mit Photoshop arbeitet, sollte zunächst einmal den Menü-Befehl “Auto-Tonwertkorrektur” ausprobieren:

wie-schaerfe-ich-ein-bild-tonkorr

Wenn er keine Verbesserung bringt, machen Sie ihn gleich wieder rückgängig.
Etwas mehr Verständnis verlangt das Arbeiten mit Gradationskurven.
was-bedeutet-tiff-rosa

Auch ein Laie erkennt den eindeutigen Rotstich in diesem Bild, der sich vor allem in den Lichtern bemerkbar macht.

was-bedeutet-png-rokorr

Zur dieser Version gelange ich, indem ich im Menü Gradationskurven nur den Kanal “rot” anwähle und die Kurve in den Lichtern ein wenig korrigiere, zum Beispiel so:

bildformate-fuers-internet-grad

 

Ein weiteres Beispiel: Dieser Cowboy…

bildbearbeitung-cowboy

…ist entweder schwer krank, oder aber sein Bild wurde nicht richtig reproduziert. Dazu braucht man nicht einmal einen farbtreuen Monitor; ein Blick auf die CMYK-Werte genügt:

bildformate-fuers-internet-inf

Die Hauttöne von uns Westlern sollten ungefähr die folgenden Werte aufweisen:

  • 15 cyan
  • 50 magenta
  • 55 yellow

Eine bleiche Person kann auch mal folgende Werte haben:

  • 10 cyan
  • 40 magenta
  • 40 yellow

Eine gebräunte Person bringt es möglicherweise auf:

  • 20 cyan
  • 55 magenta
  • 60 yellow

Unser Cowboy mit 76 Prozent Magenta ist jedoch definitiv zu hoch. Indem man die Gradationskurven der einzelnen Farbkanäle korrigiert, kommt man auf gesündere Werte, und das könnte dann beispielsweise so aussehen:

bildformate-fuers-internet-cowboyk

Ist er Ihnen jetzt zu bleich? Dann pröbeln Sie doch selber ein wenig mit Gradationskurven rum. Solange Sie Ihr Originalbild irgendwo unversehrt aufbewahren, können Sie an Bildkopien herumbasteln, so viel Sie mögen.

 

That’s it, folks…

 

Damit ist unser Kurz-Lehrgang zum Thema Bildbearbeitung zu Ende. Wenn Sie Fragen haben, schicken Sie mir eine E-Mail. Wenn ich die Frage als intelligent beurteile, werde ich sie in einer zukünftigen Version dieses Lehrgangs beantworten.

Übrigens… Sie haben recht: Wenn das die Informationen sind, die ich Ihnen gratis liefere, was wird wohl erst die Information wert sein, für die ich Geld verlange?

Viel Spaß mit Ihrem neu gewonnenen Wissen!