+++ Digitale Bildbearbeitung mit Adobe Photoshop +++
| Was ist mit der digitalen
Bildverarbeitung "DBB" möglich? |
- Wie können ein Gegenstand, eine Papiervorlage oder ein Dia digitalisiert werden?
Ein Foto, ein bedrucktes Blatt, ein Diapositiv oder Negativ
können mit Hilfe eines Scanners digitalisiert werden.
Es ist ebenfalls möglich, mit einer Digitalkamera eine
digitale Vorlage herzustellen.
|
- Die Möglichkeiten der digitalen Bildbearbeitung "DBB":
Die Möglichkeiten der digitalen Bildbearbeitung können wie folgt
umrissen werden:
- Eine digitale Vorlage kann ohne Qualitätsverlust beliebig oft
dupliziert werden.
- Eine digitale Vorlage kann temporär verändert werden.
- Eine kleine Vorlage, z.B. ein Kleinbilddia, kann mit Hilfe einer
entsprechenden Software bis zu einem A0-Poster oder grösser
vergrössert werden.
- Abhängig von der verwendeten Software können einzelne
Schritte der Bearbeitung rückgängig gemacht oder zwecks
Anwendung auf andere Vorlagen aufgezeichnet werden.
- Abhängig von der verwendeten Software können einzelne
Schritte der Bearbeitung als sog. Schnappschuss festgehalten werden.
- Mit Hilfe einer sog. Auswahl können Teilbereiche einer Vorlage
bearbeitet werden.
- Der Tonwert, die Gradation, die Farbbalance, der Kontrast und
Helligkeit einer Vorlage können verändert werden.
- Es ist mit geringstem Aufwand möglich, aus einer Farbvorlage eine
Schwarzweissvorlage herzustellen.
- Digitale Vorlagen lassen sich sehr einfach retuschieren und von
Störungen befreien.
- Digitale Vorlagen lassen sich bis zu einem gewissen Grad nachschärfen.
- Digitale Vorlagen lassen sich sehr einfach spiegeln, drehen oder neigen.
- Digitale Vorlagen lassen sich als sog. Ebenen übereinander positionieren.
Die Ebenen lassen sich ein- und ausblenden. Mit Hilfe von Masken
können einzelne Ebenen transparent gemacht werden.
Einzelne Ebenen und Masken können auf andere Vorlagen
übertragen werden.
- Digitale Vorlagen lassen sich sehr einfach manipulieren.
- Effekte wie Verzerren oder Aquarellieren einer Vorlage sind sehr
leicht durchführbar.
- Eine der Stärken der DBB ist die Montage von mehreren Vorlagen
zu einem Bild, z.B. einem Poster.
- DBB ist der grösste Antrieb für das Internet.
Die sog. animierten GIF-Bilder sind zu einem unverzichtbaren Mittel der
Werbung im Web geworden.
|
Bevor Sie beginnen 1... |
- Die aktuellen Daten der Vorlage
-
Bevor Sie mit der Bearbeitung einer digitalen Vorlage beginnen, überprüfen Sie
die folgenden Daten:
- Die Bildgrösse
- Die Auflösung
- Den Farbmodus
- Das Dateiformat
|
Bevor Sie beginnen 2... |
- Legen Sie die Daten der Zielvorlage fest
-
Bevor Sie mit der Bearbeitung einer digitalen Vorlage beginnen, legen Sie
die folgenden Daten der Zielvorlage fest. Diese hängen entschieden davon ab,
ob die Vorlage "gedruckt" oder ins "Web"
gestellt werden soll, zumal nicht jedes Dateiformat für das Internet geeignet ist:
- Der Bildausschnitt
- Die Bildgrösse
- Die Auflösung
- Der Farbmodus
- Das Dateiformat
|
Die Reihenfolge 1... |
- Sie sollten bei der Bearbeitung Ihrer Vorlage so vorgehen:
-
Bei Bearbeitung und Optimierung Ihrer Vorlage ist die Reihenfolge der einzelnen
Schritte sehr wichtig:
- Duplizieren Sie die Vorlage, schliessen Sie das Original, sichern Sie
die Kopie, mit der Sie dann arbeiten.
- Sichern Sie die Datei nach wichtigen Schritten.
- Den Bildauschnitt festlegen.
- Die Bildgrösse festlegen.
- Die Auflösung festlegen.
- Den Farbmodus festlegen.
- Das Dateiformat festlegen.
|
Die Reihenfolge 2... |
- Sie sollten bei der Bearbeitung Ihrer Vorlage so vorgehen:
Bei Bearbeitung Ihrer Vorlage ist die Reihenfolge der einzelnen
Schritte sehr wichtig. Einzelne Schritte können rückgängig gemacht
oder zwecks Anwendung auf andere Vorlagen als sog. Aktionen aufgezeichnet werden.
Mit Hilfe eines sog. Schnappschusses kann der jeweilige Zustand der Vorlage
festgehalten werden:
- Einzelne Schritte, falls erforderlich, als Aktionen aufzeichnen.
- Einen Schnappschuss, falls erforderlich, von einem Zwischenschritt
anfertigen. Im Photoshop können die von einer Vorlage erstellten
Schnappschüsse leider nicht mitgespeichert werden.
- Den Tonwert korrigieren.
- Die Gradation korrigieren.
- Die Farbbalance korrigieren.
- Die Helligkeit und den Kontrast korrigieren.
- Störungen beseitigen.
- Fehler retuschieren.
- Nachschärfen, falls nötig.
- Spiegeln, drehen, neigen, falls nötig.
- Mit Ebenen, Masken und Kanälen arbeiten.
- Manipulationen vornehmen.
- Effekte anwenden.
- Montagen vornehmen.
- Eventuell für das Web vorbereiten.
- Eventuell für Animationen vorbereiten.
|
Web-Design mit Photoshop und ImageReady
Themen:
Für Web speichern... Nach GIF89a-Format exportieren... Web Photo Gallery...
Animierte GIF-Dateien mit ImageReady... Slices... Rollovers... ImageMaps...
|
-
Das sollten Sie beim Web-Design wissen:
Für das Web gelten nur die drei Grafikformate
gif, jpg und png
Für das Web-Design mit Hilfe von Photoshop und ImageReady
benötigen Sie Kenntnisse über den Umgang mit der Seitengestaltungssprache
HTML
(Hypertext Markup Language).
Nützlich dafür sind auch HTML-Editoren wie Macromedia Dreamweaver,
Netscape Composer oder MS FrontPage. Sehr hilfreich für das
Web-Design sind ebenfalls
die sogenannten WYSIWYG-Editoren. Das Kürzel
WYSIWYG steht für:
"What You See Is What You Get".
Das bedeutet in etwa: Das Ergebnis sieht so aus wie das, was Sie gerade sehen.
Photoshop und ImageReady bieten die folgenden Möglichkeiten
für das Web-Design:
- Für Web speichern...
Mit diesem Kommando können Dateien in den Web-Grafikformaten
jpg, gif und png gespeichert werden.
Hierbei wird die Grafik in einem gesonderten Fenster
mit Vorschau für verschiedene Optimierungsstufen gezeigt.
Das Format Joint Photographic Experts Group (mit Dateiendung jpg)
ist das gebräuchliche Format für die
Darstellung von Fotos und anderen Halbtonbildern in HTML-Dateien im World Wide Web
und anderen Online-Diensten. Das JPEG-Format unterstützt CMYK-, RGB- und Graustufen-
Farbmodi. Es unterstützt keine Alpha-Kanäle. Im Gegensatz zu GIF erhält JPEG sämtliche
Farbinformationen eines RGB-Bildes. JPEG wendet eine Komprimierung an, mit der die
Dateigröße reduziert wird, indem Daten, die zur Darstellung des Bildes nicht notwendig sind, erkannt und gelöscht werden.
Wenn Sie ein JPEG-Bild öffnen, wird es automatisch dekomprimiert. Je höher die
Komprimierung, desto niedriger wird die Bildqualität; je niedriger die Komprimierung, desto
höher ist die Bildqualität. In den meisten Fällen erzeugt eine Komprimierung mit der
maximalen Qualitätsstufe ein Bild, das sich praktisch nicht vom Original unterscheidet.
Das PNG-8-Format verwendet 8-Bit-Farbe. Wie im GIF-Format werden im PNG-8-Format
Farbflächen effizient komprimiert, wobei Details, wie beispielsweise in Strichgrafiken, Logos
und Abbildungen mit Text, erhalten bleiben.
Da PNG-8 nicht von allen Browsern unterstützt wird, sollten Sie dieses Format vermeiden,
wenn Ihr Bild im Internet die größtmögliche Verbreitung finden soll. Weitere Informationen
zur Browser-Unterstützung für PNG finden Sie in der Dokumentation Ihres Browsers.
Das PNG-8-Format verwendet eine verlustfreie Komprimierungsmethode, bei der während
der Komprimierung keine Daten gelöscht werden. Da PNG-8-Dateien jedoch 8-Bit-Farbe
enthalten, kann die Optimierung eines 24-Bit-Originalbilds als PNG-8 zu einer geringeren
Bildqualität führen. PNG-8-Dateien verwenden komplexere Komprimierungsschemata als
GIF-Dateien und können 10 bis 30 % kleiner als GIF-Dateien desselben Bilds sein, je nach
den Farbmustern des Bilds.
Hinweis: Bei bestimmten Bildern, insbesondere solchen mit sehr wenigen Farben und
einfachen Mustern, können mit der GIF-Komprimierung kleinere Dateien als mit der PNG-8-
Komprimierung erstellt werden. Zeigen Sie optimierte Bilder im GIF- und PNG-8-Format an,
um die Dateigrößen zu vergleichen.
Wie beim GIF-Format können Sie die Anzahl der Farben im Bild verringern und Optionen
zum Steuern des Ditherings der Farben in der Anwendung oder einem Browser wählen. Das
PNG-8-Format unterstützt Hintergrundtransparenz und Hintergrundfarbe, bei der die
Bildkanten an die Hintergrundfarbe einer Webseite angepaßt werden.
Das PNG-24-Format unterstützt 24-Bit-Farbe. Wie das JPEG-Format bewahrt PNG-24 die
umfangreiche Skala und feinen Unterschiede in Helligkeit und Farbton, die ein Foto aufweist.
Details, z. B. in Strichgrafiken, Logos oder Abbildungen mit Text, bleiben wie im GIF- und PNG-8-Format auch im PNG-24-Format erhalten.
Das PNG-24-Format verwendet dieselbe verlustfreie Komprimierungsmethode wie das PNG-
8-Format, bei der keine Daten gelöscht werden. Aus diesem Grund sind PNG-24-Dateien
meist größer als JPEG-Dateien desselben Bilds. Die Browser-Unterstützung für PNG-24
entspricht der für PNG-8.
Wie beim PNG-8-Format werden auch vom PNG-24-Format Hintergrundtransparenz und
Hintergrundfarbe unterstützt, bei der die Bildkanten an die Hintergrundfarbe einer Webseite
angepaßt werden. Darüber hinaus unterstützt das PNG-24-Format abgestufte
Transparenzeffekte. Mit bis zu 256 Transparenzabstufungen können Sie weiche Übergänge
von den Bildrändern zu einer beliebigen Hintergrundfarbe erzielen. Abgestufte Transparenz
wird jedoch nicht von allen Browsern unterstützt.
- Nach GIF89a-Format exportieren...
Mit diesem Kommando ist es möglich, Dateien mit transparentem Hintergrund
im sog. Compuserve-GIF89a-Format herzustellen.
Das Graphics Interchange Format (GIF) ist das gebräuchliche Format
für die Darstellung von indizierten Farbbildern in
HTML-Dateien (Hypertext Markup Language) im World Wide Web
und anderen Online-Diensten. GIF ist ein LZW-komprimiertes Format,
das entwickelt wurde, um die Dateigröße und die Übertragungszeit
per Telefonleitungen so weit wie möglich zu reduzieren.
Das GIF-Format unterstützt keine Alpha-Kanäle.
Sie können Dateien unter Verwendung einer der folgenden
Methoden in das GIF-Format konvertieren:
Sie können Bitmap-, Graustufen- oder indizierte Farbbilder
über den Befehl "Datei: Speichern unter" im GIF-Format speichern
und eine Interlaced-Darstellung festlegen, um das Bild beim Laden
in mehreren Durchgängen mit zunehmend mehr Details anzuzeigen,
wodurch die Dateigröße erhöht wird. Sie können keine Alpha-Kanäle
mit dem Bild speichern.
Mit dem Befehl "GIF89a exportieren" können Sie ein RGB- oder
indiziertes Farbbild ins Format GIF89a konvertieren,
Interlaced-Darstellung festlegen und die Anzeige von transparenten
Bereichen im Bild festlegen. (Siehe Befehl: Exportieren von Bildern.)
Das GIF89a-Format unterstützt einzelne Alpha-Kanäle.
- Web Photo Gallery...
Der Befehl "Web Photo Gallery" ermöglicht Ihnen das Exportieren
von Bildern als Gallery-Website, einschließlich einer Miniaturen-Indexseite,
individuellen JPEG-Bildseiten und navigierbaren Links.
Dabei bereitet Photoshop die Bilder und den HTML-Code automatisch auf,
wodurch sich das Publizieren von Bildern im Internet vereinfacht.
- Animierte GIF-Dateien mit ImageReady...
Mit ImageReady lassen sich auf sehr einfache Weise Animationen herstellen:
Führen Sie folgende Schritte durch, um eine animierte GIF-Datei in ImageReady zu erstellen:
Öffnen oder erstellen Sie ein Bild mit mehreren Ebenen als Grundlage für die Animation.
Erstellen Sie mit der Animation-Palette Animationsframes aus dem Originalbild.
Nehmen Sie mit der Ebenen-Palette Änderungen an einzelnen Frames, Gruppen von Frames oder der ganzen Animation vor.
Verwenden Sie ggf. den Befehl "Dazwischen einfügen", um automatisch für mehrere neue oder vorhandene Frames die Einstellungen für Ebenendeckkraft, -position oder -effekte graduell zu ändern.
Zeigen Sie eine Vorschau der Animation in ImageReady an.
Optimieren Sie die Animation mit der Optimieren- und Farbtabelle-Palette.
Zeigen Sie eine Vorschau der Animation in einem Browser an (das Timing ist im Vergleich zur Vorschau in ImageReady genauer).
Speichern Sie die Animation mit dem Befehl "Optimiert-Version speichern".
Speichern Sie das Originalbild zur späteren Weiterbearbeitung.
Animationen werden in der Original-Ansicht erstellt und bearbeitet.
Sie können eine Animation auch in der Optimiert-Ansicht ansehen,
allerdings sind die Bearbeitungsmöglichkeiten für Animationen in
optimierten Ansichten sehr gering. Optimierte Animationsdateien werden
nur als GIF-Dateien ausgegeben. Sie können keine JPEG- oder PNG-Animation erstellen.
- Slices...
Slices ermöglichen die Erstellung komplexer Bilder für das Web. Bei Slices handelt es sich
um rechteckige Bildbereiche, die in der HTML-Tabelle der HTML-Bilddatei zu Zellen
werden. Wenn Sie Slices in einem Bild erstellen, erstellt ImageReady automatisch bei Bedarf
zusätzliche Slices, so daß alle Bildbereiche als Zellen in der HTML-Tabelle angegeben
werden.
Beim Unterteilen eines Bilds in Slices können Sie jedes Slice im Bild mit unterschiedlichen
Einstellungen optimieren. Außerdem können Sie Rollover-Effekte erstellen, bei denen
verschiedene Stadien eines Bilds aktiviert werden, wenn der Web-Besucher eine Maus-Aktion
auf dem Slice ausführt.
- Rollovers...
Mit dem Rollover erstellen Sie Effekte, bei denen unterschiedliche Stadien eines Bildes
aktiviert werden, sobald ein Betrachter über einem Slice eine Mausaktion (z. B. Rollen oder
Klicken) durchführt. Als Rollover-Status können Sie eine Animation anzeigen.
- ImageMaps...
Image Maps sind Bilder auf einer Website, die mehrere Verknüpfungen zu anderen Dateien
haben. Bestimmte Bereiche einer Image Map, die aktiven Punkte, stellen Verknüpfungen zu
unterschiedlichen URLs dar. Image Maps können Verknüpfungen mit Textdateien, anderen
Bildern, Audio-, Video- oder Multimedia-Dateien, anderen Seiten der Website oder anderen
Websites enthalten. Die aktiven Punkte reichen nicht über die Kanten des Bilds hinaus.
Image Maps sind insofern mit Slices vergleichbar, als man mit ihnen einen Bildbereich mit
einer URL verknüpfen kann. Image Maps haben jedoch den Vorteil, daß sie die Erstellung
von runden, vieleckigen oder rechteckigen Bereichen in einem Bild ermöglichen, während mit
Slices nur rechteckige Bereiche verbunden werden können. (Wenn nur rechteckige Bereiche
verbunden werden müssen, sind Slices u. U. Image Maps vorzuziehen, da sie die Möglichkeit
bieten, die Optimierung für einzelne Bildbereiche getrennt einzustellen.
|
Digitale Bildbearbeitung
Allgemeine Begriffe
Die digitale Bildbearbeitung wird in den RRZN-Kursen ausschliesslich
mit dem Programm "Adobe Photoshop 5.5" durchgeführt. Die Kurse
über Photoshop am RRZN finden Sie HIER.
Sie lernen in einem 5tägigen "Learning-by-Doing"-Seminar den Einsatz
von Photoshop kennen.
Fahren Sie mit der Maus über das Bild, um die Kursthemen kennenzu-
lernen. Alle hier besprochene Punkte werden dort behandelt.

Grundsätzliches über die Digitale Bildbearbeitung

Die Bearbeitung eines digital vorliegenden Bildes hängt entscheidend davon ab,
ob es ausgedruckt oder im Web veröffentlicht werden soll. Dabei spielen die
Auflösung und das Format des Bildes eine wichtige Rolle.
- Die Auflösung
-
Ein digitales Bild setzt sich aus einzelnen Bildpunkten (Pixeln, Dots) zusammen.
Jedes Pixel ist durch seine Koordinaten und seinen Farbwert eindeutig definiert.
Z. B. ein Bild im Postkartenformat (13.55cm X 10.6cm bzw. 5.333inch X 4.00inch),
das in der Breite aus 1600 und in der Höhe aus 1200 Pixeln besteht, hätte somit eine
Auflösung von 1200/4=300 pixel/inch.
Die Auflösung eines Bildes wird in pixel per inch bzw. dpi (dot per inch) angegeben.
- Das Dateiformat
- Die Daten, die ein digitales Bild beschreiben, werden in einer bestimmten Struktur, genannt
das Dateiformat, angelegt. Das Format wird in der Regel durch das Gerät (Scanner, Digitalkamera)
bzw. die Software ( z.B. Photoshop) vorgegeben, womit das Bild erstellt wird. Bei Scannern und
Bildbearbeitungsprogrammen hat der Anwender, soweit sinnvoll, auch selbst die Möglichkeit, das Format
vorzugeben.
- Wofür welches Dateiformat
- Die Wahl eines bestimmtes Dateiformats hängt davon ab, wofür das Bild verwendet werden soll.
Allein Photoshop kennt 15 verschiedene Formate. Im folgenden einige wichtige davon und ihr Einsatzgebiet:
- PSD Im Web NICHT anwendbar
Das interne Photoshopformat wird für Montagen und andere Spezialanwendung verwendet.
- TIF Im Web NICHT anwendbar
Tagged Image File Format, verlustfreie Kompression, geeignet zum Austausch mit anderen
Programmen und Rechnerplattformen, z.B. Unix- und Mac-Welt.
- EPS Im Web NICHT anwendbar
Encapsulated Post Script, das Dateiformat für Druckvorstufen und Postererstellung.
- JPG Im Web anwendbar
Joint Photographic Experts Group, das Dateiformat für hochwirksame Kompression mit
kalkulierbarem Datenverlust, 16,7 Mio Farben, 24-Bit Farbtiefe, die Auflösung für das Web
ist mit 70 bis 100 pixel/inch völlig ausreichend.
- GIF Im Web anwendbar
Graphics Interchange Format, das Dateiformat für verlustfreie Kompression, geeignet
für Web-Animationen und Bilder mit transparentem Hintergrund, 256 Farben, 8-Bit Farbtiefe,
die Auflösung für das Web ist mit 70 bis 100 pixel/inch völlig ausreichend.
- PNG Im Web anwendbar
Portable Network Graphic, das Dateiformat für verlustfreie Kompression, geeignet
für Web-Animationen und Bilder mit transparentem Hintergrund, 16,7 Farben, 24-Bit Farbtiefe,
die Auflösung für das Web ist mit 70 bis 100 pixel/inch völlig ausreichend. Das Format ist ein Versuch,
die Nachteile von JPG (verlustbehaftete Kompression) und GIF (nur 256 Farben) zu vermeiden.
PNG wird erst ab Netscape Communicater 4.04 und MS Explorer 4.0 unterstützt.
- Gegenüberstellung von JPG- und GIF-Format im Web
- Diese beiden Formate lassen sich im Photoshop sehr gut optimieren. Das GIF-Format benötigt in der Regel
erheblich weniger Platz als das JPG. Für die Darstellung von Grafiken sollte auf jeden Fall dieses
Format verwendet werden, während JPG bei farbintensiven Images zum Einsatz kommen sollte.
-
JPG und GIF-Vergleich im WEB
Die Bilder sind hier um 50% kleiner dargestellt
|
|
|
JPG: (425x272)Pixel (15x9,6)cm (5,9x3,8)inch
72dpi 339KB 16,7Mio Farben
|
GIF: (425x272)Pixel (15x9,6)cm (5,9x3,8)inch
72dpi 113KB 256 Farben
|
Wie der oberen Tabelle zu entnehmen ist, benötigt das JPG-Bild 3mal mehr Platz als das GIF-Bild.
Bezüglich der Einzelheiten ist kein Unterschied zwischen den Bildern auszumachen.
|