13
Bilder für Web-Bildschirmpräsentation/Druck aufbereiten Bildbearbeitung Dagmar Serb V.02 1 Bilder für Web / Bildschirmpräsentation aufbereiten ........................................................ 1 1.1 Pixelgröße anpassen [STRG] + [R]................................................................................ 2 1.1.1 Bildausschnitt erstellen [UMSCHALT] + [C] .......................................................... 3 1.2 Bildkorrekturen............................................................................................................ 4 1.2.1 Schärfen [STRG] + [E]............................................................................................ 4 1.2.2 Helligkeit/Kontrast/Farbe bearbeiten [UMSCHALT] + [G] ................................... 4 1.3 Komprimieren .............................................................................................................. 5 1.4 Batch/Stapel-Konvertierung ........................................................................................ 6 2 Bilder für den Druck ........................................................................................................... 9 2.1 Druckauflösung ............................................................................................................ 9 2.1.1 dpi (dots per inch) ................................................................................................ 9 2.1.2 Wie viele dpi brauche ich? ................................................................................. 10 2.1.2.1 Art des Ausdrucks ........................................................................................... 10 2.1.2.2 Abstand zum Druckwerk................................................................................. 10 2.1.3 Wie groß kann mein Bild in optimaler Qualität ausgedruckt werden? ............. 10 2.1.4 Welches Pixelmaß brauche ich für mein Wunschformat? ................................. 11 3 Das Urheberrecht ............................................................................................................. 11 4 Kostenfreie Bilder ............................................................................................................. 12

Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

Bilder für Web-Bildschirmpräsentation/Druck aufbereiten Bildbearbeitung Dagmar Serb V.02 1 Bilder für Web / Bildschirmpräsentation aufbereiten ........................................................ 1

1.1 Pixelgröße anpassen [STRG] + [R] ................................................................................ 2

1.1.1 Bildausschnitt erstellen [UMSCHALT] + [C] .......................................................... 3

1.2 Bildkorrekturen ............................................................................................................ 4

1.2.1 Schärfen [STRG] + [E] ............................................................................................ 4

1.2.2 Helligkeit/Kontrast/Farbe bearbeiten [UMSCHALT] + [G] ................................... 4

1.3 Komprimieren .............................................................................................................. 5

1.4 Batch/Stapel-Konvertierung ........................................................................................ 6

2 Bilder für den Druck ........................................................................................................... 9

2.1 Druckauflösung ............................................................................................................ 9

2.1.1 dpi (dots per inch) ................................................................................................ 9

2.1.2 Wie viele dpi brauche ich? ................................................................................. 10

2.1.2.1 Art des Ausdrucks ........................................................................................... 10

2.1.2.2 Abstand zum Druckwerk ................................................................................. 10

2.1.3 Wie groß kann mein Bild in optimaler Qualität ausgedruckt werden? ............. 10

2.1.4 Welches Pixelmaß brauche ich für mein Wunschformat? ................................. 11

3 Das Urheberrecht ............................................................................................................. 11

4 Kostenfreie Bilder ............................................................................................................. 12

Page 2: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

Bildbearbeitung • Bilder für Web / Bildschirmpräsentation aufbereiten

www.schulung.unileoben.ac.at SEITE 1

1 Bilder für Web / Bildschirmpräsentation aufbereiten Ihr Arbeitsplatzrechner ist mit dem Freeware-Programm IrfanView ausgestattet. Damit können Sie Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen Sie stets eine Kopie von Ihrem Foto und arbeiten Sie mit der Kopie weiter. So können Sie jederzeit auf das Originalfoto zurückgreifen!

1. Klicken Sie das Bild zum Öffnen per Rechtsklick im Dateiexplorer an und wählen Sie

aus dem Kontextmenü die Option „ÖFFNEN MIT...“ → „IRFANVIEW“.

Das geöffnete Bild in IrfanView:

[UMSCHALT] + [W] = Bild an Fenster anpassen

[UMSCHALT] + [O] = Fenster an Bild anpassen

Page 3: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

SEITE 2 ZID • SCHULUNGEN

1.1 Pixelgröße anpassen [STRG] + [R] 1. Klicken Sie im Menü von IrfanView auf „BILD“ und wählen Sie die Option „GRÖSSE

ÄNDERN“ aus.

2. Legen Sie die neue Bildgröße fest. Dazu stehen Ihnen mehrere Optionen zur Auswahl: • Tragen Sie unter „NEUE GRÖSSE“ die gewünschte Breite ein. Ist „Proportional“

aktiviert, wird das Bild nicht verzerrt und „Höhe“ wird automatisch eingetragen.

o d e r • Geben Sie unter PROZENTSATZ VON ORIGINAL den gewünschten Wert ein.

o d e r • Wählen Sie aus „STANDARD-DIMENSIONEN“ die gewünschte Größe aus.

Page 4: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

Bildbearbeitung • Bilder für Web / Bildschirmpräsentation aufbereiten

www.schulung.unileoben.ac.at SEITE 3

3. Bestätigen Sie abschließend mit „OK“. Vielleicht möchten Sie nicht das gesamte Bild, sondern nur einen bestimmten Bildausschnitt auf die passende Pixelgröße bringen:

1.1.1 Bildausschnitt erstellen [UMSCHALT] + [C] Methode 1:

1. Ziehen Sie mit gedrückter linker Maustaste einen Rahmen um den gewünschten Bildausschnitt.

a. An den Kanten des Rahmens können Sie ziehen, sobald sich der Mauszeiger beim darüber Navigieren in einen Doppelpfeil verwandelt hat.

b. Mit gedrückter rechter Maustaste innerhalb der Auswahl lässt sich der gesamte Rahmen verschieben.

Das aktuelle Pixelmaß wird in der Statusleiste angezeigt:

2. Um die Auswahl zu bestätigen, klicken Sie im Menü auf „BEARBEITEN“ → „FREISTELLEN“, oder einfach die Tastenkombination [STRG] + [Y].

Methode 2:

1. Klicken Sie im Menü auf „BEARBEITEN“ → „SPEZIELLE MARKIERUNG ERSTELLEN“. 2. Geben Sie die gewünschten Maße ein und legen Sie bei Bedarf ein Seitenverhältnis

fest. Bestätigen Sie mit „SPEICHERN & ANWENDEN“.

b. a.

Page 5: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

SEITE 4 ZID • SCHULUNGEN

3. Sie erhalten einen Ausschnittrahmen, den Sie wie in Methode 1 bearbeiten können. 4. Um die Auswahl zu bestätigen, klicken Sie im Menü auf „BEARBEITEN“ →

„FREISTELLEN“, oder einfach die Tastenkombination [STRG] + [Y].

1.2 Bildkorrekturen 1.2.1 Schärfen [STRG] + [E] Wird die Pixelanzahl beim Verkleinern des Bildes stark heruntergerechnet kann es nicht schaden, das Bild nachzuschärfen:

1. Klicken Sie im Menü auf „BILD“ → „EFFEKTE → EINSTELLUNGEN/VORSCHAU...“. Stellen Sie unter „SHARPEN“ einen passenden Wert ein.

Gehen Sie behutsam vor, eine zu starke Einstellung wirkt sich negativ auf das Erscheinungsbild aus!

Wie Sie sehen, gibt es in diesem Menü noch viele weitere Korrekturmöglichkeiten und Effekte!

1.2.2 Helligkeit/Kontrast/Farbe bearbeiten [UMSCHALT] + [G] 1. Klicken Sie im Menü auf „BILD“ → „FARBEN ÄNDERN...“ und optimieren Sie bei Bedarf

die Helligkeit, den Kontrast oder die Farbe.

Page 6: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

Bildbearbeitung • Bilder für Web / Bildschirmpräsentation aufbereiten

www.schulung.unileoben.ac.at SEITE 5

1.3 Komprimieren Methode 1:

1. Klicken Sie im Menü auf „DATEI“ → „BILD SPEICHERN UNTER ...“ 2. Neben dem gewohnten Dialogfeld fürs Speichern erhalten Sie ein zusätzliches

Dialogfenster, in dem Sie die Kompressionsstufe einstellen können.

Ein Wert um die 80% ergibt meist sehr gute Ergebnisse. Werte unter 60% sind nicht mehr empfehlenswert. Unter „DATEIGRÖSSE SETZTEN“ können Sie alternativ die von Ihnen gewünschte maximale Dateigröße festlegen.

3. Bestätigen Sie beide Dialogfelder mit „SPEICHERN“. Methode 2:

1. Klicken Sie im Menü auf „DATEI“ → „SPEICHERN FÜRS WEB...“.

b. a. 2.

Page 7: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

SEITE 6 ZID • SCHULUNGEN

2. Wählen Sie das gewünschte Dateiformat aus. 3. Stellen Sie die Kompressionsstärke ein:

a. Komprimieren Sie mit „COMPRESS TO SIZE“, wird das Bild entsprechend der gewünschten maximalen Dateigröße komprimiert o d e r

b. Arbeiten Sie mit dem SCHIEBEREGLER: Ein Wert um die 80% ergibt meist sehr gute Ergebnisse. Werte unter 60% sind nicht mehr empfehlenswert.

4. Klicken Sie auf „SAVE“ und speichern Sie das Bild wie gewünscht ab.

Tipp: Wählen Sie einen aussagekräftigen Speichernamen in Kleinbuchstaben, ohne Umlaute, Sonderzeichen und Leerstellen, dafür mit Suffix, um die Kopie vom Original zu unterscheiden!

Schispaß Sölden 2019.jpg schispass-soelden-2019_web.jpg

1.4 Batch/Stapel-Konvertierung Haben Sie mehrere Bilder auf ein- und dieselbe Weise aufzubereiten, müssen Sie nicht jedes Bild einzeln bearbeiten – benutzen Sie stattdessen das Batch(Stapel)-Verfahren. Im folgenden Beispiel werden Bilder im Batchverfahren in ihrer Pixelgröße geändert, komprimiert und mit einem Wasserzeichen versehen. Benutzen Sie für diese Übung den Folder „animals“, in dem sich die Ausgangsbilder befinden:

1. Legen Sie einen neuen Ordner an, in dem die konvertierten Bilder gespeichert werden sollen (z.B. „animals-small“).

2. Öffnen Sie mit IrvanView aus dem Ausgangsfolder ein beliebiges Bild und wählen Sie im Menü „DATEI“ → „BATCH(STAPEL)-KONVERTIERUNG/UMBENENNUNG...“ aus.

3. Folgendes Dialogfeld öffnet sich:

4.

5. 6.

Page 8: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

Bildbearbeitung • Bilder für Web / Bildschirmpräsentation aufbereiten

www.schulung.unileoben.ac.at SEITE 7

4. Aktivieren Sie bei „ARBEITE ALS“ die Option „BATCH-KONVERTIERUNG“. 5. Klicken Sie bei „ZIELFORMAT“ auf die SCHALTFLÄCHE „OPTIONEN“. 6. Stellen Sie im daraufhin erhaltenen Dialogfenster die gewünschte

Kompressionsstufe ein. Ein Wert um die 80% ergibt meist sehr gute Ergebnisse. Werte unter 60% sind nicht mehr empfehlenswert. Bestätigen Sie dieses Dialogfenster mit „OK“.

7. Aktivieren Sie die „SPEZIAL-OPTIONEN“ und klicken Sie dann auf die SCHALTFLÄCHE „SETZEN“.

8. Das nun geöffnete Dialogfeld bietet sehr viele Möglichkeiten – Größe ändern, Farbkorrekturen, Helligkeit/Kontrast, Schärfe, Text einfügen, ... Im aktuellen Beispiel legen wir die Breite der Bilder auf 600 px fest und fügen das MUL-Logo als Wasserzeichen ein:

• Geben Sie bei „GRÖSSE ÄNDERN“ → „NEUE GRÖSSE“ → „BREITE“ den Wert

„600“ ein. • Bei aktivierter Option „PROPORTIONAL“ ergibt sich die Höhe automatisch. • Die „RESAMPLE-FUNKTION“ verbessert die Qualität beim Ändern der

Pixelgröße. • Aktivieren Sie „WASSERZEICHEN EINF.“ und klicken Sie auf die

SCHALTFLÄCHE „OPTIONEN“.

Page 9: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

SEITE 8 ZID • SCHULUNGEN

• Wählen Sie das gewünschte Bild aus (in unserer Übung MU logo.png) und definieren Sie unter „START-ECKE“ die Position „RECHTS UNTEN“.

• Bestätigen Sie beide Dialogfelder mit „OK“.

9. Zurück im DIALOGFENSTER „BATCH/STAPEL-KONVERTIERUNG“ klicken Sie auf die SCHALTFLÄCHE „ALLE HINZUFÜGEN“, um die Änderungen auf alle Bilder anzuwenden.

10. Wählen Sie unter ZIELVERZEICHNIS den neu angelegten Ordner „animals-small“ aus. 11. Klicken Sie auf die die SCHALTFLÄCHE „STARTEN“- die Konvertierung beginnt.

Dieses Dialogfenster informiert Sie über den Verlauf der Konvertierung:

Page 10: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

Bildbearbeitung • Bilder für den Druck

www.schulung.unileoben.ac.at SEITE 9

Alle Bilder im Zielfolder sind jetzt 600 Pixel breit, weisen ein Wasserzeichen auf und wurden in ihrer Dateigröße erheblich verkleinert:

Nun zu Bildern, die für den Ausdruck bestimmt sind:

2 Bilder für den Druck Auf Papier gedruckte Bilder besitzen im Gegensatz zu digitalen Bildern eine physikalische Größe (A3, A4 ,10 x 15 cm ...). Daher hängt die Qualität des Ausdrucks wesentlich davon ab, wie viele Druckpunkte pro Zoll gedruckt werden. Beim Drucken sprechen wir von „Druckpunkten“ dpi = dots per inch = Druckpunkten pro Zoll, nicht von Bildpunkten wie am Monitor (ppi = pixel per inch = Bildpunkte pro Zoll).

2.1 Druckauflösung Die Druckauflösung gibt an, wie viele Druckpunkte pro Zoll gedruckt werden. Je mehr Punkte der Drucker innerhalb eines Zolls drucken kann, desto genauer und feiner wird der Ausdruck. Die Maßeinheit für die Druckauflösung ist „dpi“ und wird in Zoll angegeben:

2.1.1 dpi (dots per inch) Der Wert dpi bezeichnet die Anzahl der dots (Druckpunkte) pro Inch (Zoll). Bildlänge in Pixeln durch Bildlänge in cm × 2,54cm (1 Inch) = Auflösung in dpi

21 cm

Page 11: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

SEITE 10 ZID • SCHULUNGEN

2.1.2 Wie viele dpi brauche ich? 2.1.2.1 Art des Ausdrucks Als Standardwert für qualitativ hochwertige Ausdrucke (z.B. Fotoausdruck) hat sich irgendwann einmal der Wert von 300 dpi durchgesetzt. Es ist ein sehr grober Richtwert, aber in der Praxis erreicht man damit recht gute Ergebnisse. Dennoch - riskieren Sie ruhig einmal auch etwas niedrigere Auflösungen. Ein Bild in einer Broschüre kann z.B. auch mit 96 dpi sehr gut aussehen und schont den Tonerberbrauch!

2.1.2.2 Abstand zum Druckwerk Bei der Wahl der passenden Druckauflösung muss auch der Abstand des Betrachter zum Bild mit einbezogen werden: Blättern Sie im Abstand von ca. 30 cm eine Broschüre durch, oder blicken Sie Meterweit weg auf ein Großflächenplakat? In letzterem Fall genügt eine Auflösung von nur 20 dpi! Warum das so ist? Betrachten Sie ein Plakat aus direkter Nähe, dann erkennen Sie ohne Mühe die einzelnen Bildpunkte. Je weiter Sie weggehen, desto mehr „verschmelzen“ die Punkte zu einem Gesamtbild. Nachdem ein Plakat für gewöhnlich aus weiter Entfernung angeschaut wird, reicht eine niedrige Auflösung völlig aus! Nachfolgende Tabelle soll Ihnen einen kleinen Überblick verschaffen:

DRUCKWERK BETRACHTUNGS-ABSTAND

DRUCK-AUFLÖSUNG

Foto, Flyer, Folder, Broschüre 30 cm ca. 300 dpi

Poster, Plakate bis DIN A2 (59,4 x 42 cm) 1 m ca. 100 dpi

Plakate DIN A1 (84,1 x 59,4 cm), A0 (118,9 x 84,1 cm) 2 m und mehr ca. 50 dpi

Großflächenplakate 5 m und mehr ca. 20 dpi

2.1.3 Wie groß kann mein Bild in optimaler Qualität ausgedruckt werden? Um die maximal mögliche Druckgröße zu ermitteln, dividiert man die Seitenlängen des Bildes jeweils durch die gewünschte Auflösung. Ein Beispiel: Ein digitales Foto, 1600 x 1200 Pixel, soll in hoher Qualität ausgedruckt werden. Dazu benötigt man eine Druckauflösung von 300 dpi: 1600 px : 300 dpi = 5,33 Zoll x 2,54 cm = 13,54 cm 1200 px : 300 dpi = 4,00 Zoll x 2,54 cm = 10,16 cm Das Foto lässt sich also im Format 9 x 13 cm optimal ausdrucken, aber auch 10 x 15 cm ist noch in guter Qualität möglich. Sie können auch IrfanView für Sie rechnen lassen:

1. Öffnen Sie in IrfanView das DIALOGFELD „GRÖSSE ÄNDERN“ ([STRG]+ [R]). 2. Geben Sie den gewünschten dpi-Wert ein.

Page 12: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

Bildbearbeitung • Das Urheberrecht

www.schulung.unileoben.ac.at SEITE 11

3. Stellen Sie die Einheit auf „cm“ um. 4. Lesen Sie unter „Neue Größe“ die Druckgröße ab.

2.1.4 Welches Pixelmaß brauche ich für mein Wunschformat? Gehen wir nun den umgekehrten Weg: Wir möchten ein digitales Foto im Wunschformat 10 x 15 cm ausdrucken. Wie groß muss das Pixelmaß des Bildes sein? 10 cm : 2,54 Zoll x 300 dpi = 1179 px 15 cm : 2,54 Zoll x 300 dpi = 1770 px Für einen Ausdruck im Format von 10 x 15 cm muss das Foto mindestens 1770 x 1179 px groß sein. Noch ein Beispiel: Wir möchten unser Beispielbild mit 4128 x 3096 Pixel als DIN A1 Plakat (84,1 x 59,4 cm) ausdrucken. Dazu benötigen wir eine Auflösung von 50 dpi. 84,1 cm : 2,54 Zoll x 50 dpi = 1656 px 59,4 cm : 2,54 Zoll x 50 dpi = 1169 px Unser Beispielbild lässt sich ohne weiteres als DIN A1 Plakat ausdrucken! Abschließend sei noch auf ein sehr wichtiges Thema hingewiesen:

3 Das Urheberrecht Das Urheberrecht besagt, dass die Urheberin/der Urheber das alleinige Recht hat, ihr/sein Werk öffentlich zugänglich zu machen, zu vervielfältigen, zu verbreiten, zu senden, zu verleihen und aufzuführen (Quelle: help.gv.at).

2.

3.

4.

Page 13: Bilder für Web-Bildschirmpräsentation/Druck aufbereiten ... · Bilder betrachten und bearbeiten. Nachfolgende Übungen wurden mit diesem Programm durchgeführt. Tipp: Erstellen

SEITE 12 ZID • SCHULUNGEN

Seien Sie sich also darüber bewusst, dass alle veröffentlichten Texte, Fotos, Bilder, Videos etc., dem Urheberrecht unterliegen (Es muss nicht extra darauf hingewiesen werden!) und nur mit Erlaubnis vom Urheber für eigene Zwecke verwendet werden dürfen!

4 Kostenfreie Bilder Es gibt viele Anbieter im Internet, die ihre Werke ausdrücklich (und auch gratis) zur Weiterverwendung freigeben, wie z. B. Pixabay. Das Urheberrecht bleibt dabei weiterhin bestehen, jedoch gibt der Urheber das Recht der Nutzung weiter. Tipp: Um dennoch keine bösen Überraschungen zu erleben, lesen Sie immer genau die Nutzungs- und allgemeinen Geschäftsbedingungen des jeweiligen Anbieters durch!