Digitalisierung / Bildbearbeitung

für das Internet

WBLMed

mit Photoshop 5.5

Digitalisierung / Bildbearbeitung

für das Internet

WBLMed

mit Photoshop 5.5

Inhaltsverzeichnis

VorwortBildgröße, AuflösungBildschirmauflösung Ausgabeauflösung, DateigrößeDateiformate GIF, JPGScannen von BildernArbeitsoberfläche Adobe Photoshop 5.5Scannen in Adobe Photoshop 5.5BildgrößeWechsel in ein anderes DateiformatKonvertierung in ein anderes BildformatKonvertierung für das InternetWerkzeug-PaletteBilder zuschneidenHelligkeit/KontrastFarbvariationenSelektive FarbkorrekturFilterLinien, PfeileTextEbenenHinweis

Folie 3Folie 4Folie 5Folie 6Folie 7Folie 8Folie 9Folie 10Folie 11Folie 12Folie 13-14Folie 15Folie 15Folie 16Folie 17Folie 18Folie 19Folie 20-24Folie 25Folie 26Folie 27Folie 28

Vorwort

Um Bildmaterial für das Projekt WBLMed in die gewünschte

internettaugliche Form zu bringen, stehen mehrere Möglichkeiten

zur Verfügung. Digitalisierte Bilder können auf verschiedene

Weise erzeugt werden.

Dieses Tutorium beschäftigt sich allgemein mit dem einscannen

von Bildern und Dias, deren Abspeicherung, den geeigneten

Dateiformaten, Maßeinheiten, Dateigröße (= Datenmenge),

Auflösung (= Datendichte), Scanner-Beispiel usw.

Weiters werden anhand des Programmes Photoshop 5.5 die

wichtigsten Bildbearbeitungstechniken demonstriert.

Bildgrösse / AuflösungBildmaße:

Die Anzahl von Pixeln, die die Breite und Höhe eines Bildes ergeben,

bezeichnet man als Bildmaße. Die Anzeigegrösse eines Bildes auf dem

Bildschirm ist abhängig von den Bildmaßen des Bildes sowie der Grösse und

Pixel-Einstellung des Monitors.

17 Zoll-Monitor: 823 x 624 Pixel

20 Zoll-Monitor: 1024 x 768 Pixel

Die Anzahl von Pixeln pro Längeneinheit auf dem Monitor bezeichnet man

als dpi (dots per inch – Punkte pro Zoll). Die normale Auflösung eines PC-

Monitors beträgt 96 dpi (Mac 72 dpi)

Bildauflösung:

Die tatsächliche Größe des Bildes wird exakt dargestellt, wenn die

Einstellungen des Bildschirms mit der Auflösung des Bildes übereinstimmt.

Die meisten Bildschirme können über die Systemsteuerung auf eine Vielzahl

von Pixel-Auflösungen eingestellt werden.

Bildschirmauflösung

Beispiel:

72 dpi (entspricht der Bildschirmauflösung)

553 x 369 Pixel

132 KB (Dateigrösse)

19,81 x 13,21 cm

Ein Bild mit einer hohen Bildauflösung enthält mehr – und damit kleinere

Pixel – als ein Bild mit den gleichen Maßen bei niedrigerer Auflösung.

20 dpi (schlechteres Ergebnis)

156 x 104 Pixel

19 KB (Dateigrösse)

19,81 x 13,21 cm

Ausgabeauflösung, Dateigröße

Für den Ausdruck ist die Bildschirmauflösung qualitativ nicht ausreichend.

Die meisten Laserdrucker können mit einer Auflösung von 600-1200 dpi

drucken. Dies würde aber sehr große Dateigrössen ergeben, die für die

Publizierung im Internet viel zu groß sind. Wir empfehlen einen Mittelweg

von 72-300 dpi für eine ansprechende Qualität.

Als maximale Dateigröße eines Bildes wird für das Internet allgemein 50 KB

empfohlen.

Es ergeben sich also 3 Anhaltspunkte für das Scannen von Bildern:

1. Bildmaße in Pixel

2. Bildauflösung in dpi

3. Dateigröße in KB

Diese Werte sind stets proportional zueinander. Sie sind für das Scannen

maßgeblich und in allen Scannertypen frei wählbar.

Dateiformate

In Webseiten werden im Allgemeinen drei Grafikdateiformate verwendet:

GIF, JPG, und PNG.

GIF und JPG werden von den meisten Browsern unterstützt.

GIF-Dateien (Graphic Interchange Format) verwenden maximal 256 Farben:

Sind besonders gut für Bilder geeignet, die nicht kontinuierliche Farbtöne oder

große Bereiche mit flache Farben enthalten (Schaltflächen, Navigationsleisten,

Symbole, Logos. GIF-Bilder können mit einem transparentem Hintergrund

erstellt werden.

JPG-Dateien (Joint Photographic Experts Group) eignet sich am besten für

Fotos und Bilder mit kontinuierlichen Farbtönen, da JPG-Dateien Millionen von

Farben enthalten können. Sie sind im allgemeinen grösser als GIF-Dateien, es

kann aber durch die richtige Komprimierung ein sehr guter Ausgleich zwischen

Bildqualität und Dateigröße erzielt werden (z.B. in Photoshop).

Scannen von Bildern

Zum Scannen eines Bildes muß die entsprechende Scanner-Software

installiert sein, diese werden direkt vom Scanner über ein zu Adobe

Photoshop kompatibles Zusatzmodul oder die TWAIN-Schnittstelle

importiert.

Sie können natürlich auch ein anderes Bildbearbeitungsprogramm wie Corel

Photo Paint, Picture Publisher, Paint Shop Pro, Photo Draw etc. verwenden.

Wir empfehlen Photoshop, da es sich im jahrelangen Einsatz bestens

bewährt hat und sehr viele Möglichkeiten bietet. Nur die wichtigsten

Programmfunktionen sollen hier vorgestellt werden.

Die anderen erwähnten Programme weisen ähnliche Werkzeuge und Filter

auf. Die Bildgröße, Auflösung und Dateigröße lassen sich aber in allen

Programmen für den Scan auswählen, und können in der Definition

abweichen.

Arbeitsoberfläche Adobe Photoshop 5.5

Menüleiste

Werkzeuge

Bild-Titelleiste

Arbeits-

bereich

Statusleiste

Ebenenfenster Werkzeugspitzenfenster gescanntes Bild

Scannen in Adobe Photoshop

Menüleiste

Beispiel für einen 35 mm Diascanner:

Datei importieren Nikon....(je nach installiertem Scannertyp)

Dateigröße DPIAusgabegröße Bildausschnitt vordefinieren

Hier werden vor dem eigentlichen Scanvor dem eigentlichen Scan alle wichtigen Werte zumindest vorgewählt !

Bildgröße

Menüleiste Bild Bildgröße...

Dateigröße

Auflösung in DPI

Ausgabegröße

Größe in Pixel

Jetzt folgt die eigentliche Feinjustierung der Bildmaße.

In ein anderes Dateiformat wechselnMenüleiste Datei Speichern unter... Photos als JPG

Bilder als GIF

Konvertierung für das Internet (1)Für das Internet sollte man die Pixelgröße beachten. Da Bilder möglichst vom Browser

nicht skaliert werden sollten, werden Bilder gleich in der Richtigen Pixelgröße und einer

angemessenen DPI-Auflösung abgespeichert.

Menüleiste Für Web speichern

Für diese Beispiel wurde das Bild von ursprünglich 1145 x 905 Pixel, 2.96 MB, 250 dpi

auf ein kleineres Maß von 400 x 315 Pixel, 370 K und 300 dpi verkleinert.

Nun erfolgt der „Feinschliff“:

Dateigröße, Bildqualität,

und Ladezeiten lassen

sich je nach Wunsch

einstellen.

Bilder für das Internet

sollten nicht größer als

50 KB werden, da der

Browser sonst beim

Laden der Bilder zu

lange braucht.

Konvertierung für das Internet (2)

Endergebnis:

Fertig konvertiertes Bild für das Internet:

400 x 315 Pixel,

38,15 KB Dateigröße

300 dpi (um auch für den Druck ein akzeptables Ergebnis zu bieten)

8 Sekunden Ladezeit (56,6 Kbps Ladegeschwindigkeit)

Werkzeug-Palette

FreistellungswerkzeugLasso (Auswahlwerkzeug)...

AirbrushStempel...

Radiergummi...Weichzeichner...

Zeichenstift...Meßwerkzeug

Füllwerkzeug

Hand-Werkzeug

Vordergrundfarbe

Standardfarben

Bildschirm-Standard-Modus

BewegenZauberstab (Auswahlwerkzeug)

PinselProtokoll-Pinsel,Kunstprotokoll-Pinsel

Linien, BuntstiftAbwedler...

Textwerkzeug...versch. Verlaufsmöglichkeiten....

Pipette...

Zoom-Werkzeug

Hintergrundfarbe

Maskierungs-Modus

Standardfarben

Adobe Online

Standard-Grafikeditor starten

Menüleiste Fenster Werkzeuge einblenden

Bilder zuschneiden

Klicken Sie mit dem Mauszeiger auf das Freistellungswerkzeug in der

Werkzeugpalette. Wählen sie einen Ausschnitt und bestätigen Sie mit einem

Doppelklick auf die linke Maustaste.

Helligkeit / KontrastMenüleiste Bild Einstellen Helligkeit/Kontrast

Farbvariationen

Menüleiste Bild Einstellen Variationen

Für eine einfache, schnelle Farbkorrektur, Helligkeit, Farbsättigung etc....

Selektive Farbkorrektur

Menüleiste Bild Einstellen Selektive Farbkorrektur..

Für eine genaue Farbkorrektur:

Filter

Menüleiste Filter Scharfzeichnungsfilter Unscharf Maskieren

Photoshop bietet eine große Anzahl von Filtern. Bsp. spezieller Scharfzeichner-Filter:

Original angeschärfte Version

Korrekturfilter (Anti-Moiré-Effekt)

Menüleiste Filter Störungsfilter Störungen entfernen

Beim Einscannen von gerastertem Bildmaterial (aus Zeitungen, Magazinen etc.) kann ein

störender Moiré-Effekt entstehen, der mit dem Filter „Störungen entfernen“ behoben oder

abgeschwächt werden kann, um eine einheitliche Farbgebung zu erzielen.

Original korrigierte Version mit deutlich

verringertem Raster

Kombination verschiedener Filter

1. Änderung des Bildes : Menüleiste Bild Modus Graustufen

2. Filter: Störungen entfernen

3. Menüleiste: Bild Einstellungen AutoTonwertkorrektur

Original korrigierte Version

Durch den Einsatz von Filtern lassen sich Bilder sehr gut optimieren. Bsp. Einsatz

verschiedener Filter.

Retusche (1)

ohne Retusche

Schmutz, Kratzer usw. können mit dem Tool „Radiergummi“ entfernt werden.

Achten Sie bei der Einstellung auf die Auswahl der richtigen Hintergrundfarbe.

Für dieses Bsp. :WEISS

mit Retusche

Retusche (2)

ohne Retusche

Eine weitere Möglichkeit zur Bildretusche bietet das Tool „Stempel“

Sie können durch das Drücken der „ALT“-Taste einen bestimmten Bildbereich definieren

und an anderer Stelle im Bild übertragen.

mit teilweise kopierter Zelle

Linien, Pfeile

Klicken Sie mit dem Mauszeiger auf das Werkzeug „Linienzeichner“ in der

Werkzeugpalette. Über einen Doppelklick auf dieses Werkzeug in der Tool-Leiste

aktivieren sie ein weiteres Fenster für die Einstellung von Linienstärke, Pfeilspitzen,

Pfeilform etc... .

Text

Klicken Sie mit dem Mauszeiger auf das Textwerkzeug in der Werkzeugpalette.

Setzen Sie den Kursor auf die gewünschte Stelle und geben Sie Ihren gewünschten

Text ein. Das Fenster „Textwerkzeug“ erlaubt die Auswahl versch. Schiftarten, Größe,

Farbe usw..

Ebenen

Menüleiste Fenster Ebenen einblenden

Photoshop fügt selbständig eine neue, eigene Ebene ein wenn Sie z.B. Text einsetzen.

Dieser Text ist über das Ebenen-Fenster direkt anwählbar und nachträglich veränderbar,

da er als Vektorgrafik editiert wird. (ab Photoshop Version 5.0)

Textebene

Hintergrundebene

Hinweis

Photoshop ist ein sehr umfangreiches Programm.

Es bietet aber noch sehr viel mehr Möglichkeiten der Bildbearbeitung

als die hier erwähnten.

Dieses Tutorial kann lediglich die allerwichtigsten Funktionen zeigen.

Daher ist es unumgänglich, zur Vertiefung in die Materie das Handbuch

für das Programm genauer zu studieren.

Für Fragen stehen die Mitarbeiter des ZMM gerne zur Verfügung.