ASVZweb_08/ Bildhilfe

Transkript

1 ASVZweb_08/ Bildhilfe Version David Trmal Die Bildhilfe soll dich bei der Auswahl und Erstellung von Bildern auf deinen Seiten unterstützen. Rechtliches Bezahle kostenpflichtige Bilder bevor du sie verwendest. Bilderrechte gehören immer dem Fotografen oder einer Bildagentur. Wenn du Bilder benutzen willst, musst du den Halter der Bilderrechte um Erlaubnis zur Verwendung fragen. Bilder unter e pics.ethz.ch, die im ASVZ Bereich sind, kannst du auch ohne zu fragen verwenden. Hier sind die Bilderrechte beim ASVZ. Bilder, die du selber gemacht hast, kannst du bedenkenlos verwenden, achte aber auf den Inhalt (Personen!) Bei Darstellung von bekannt Personen deren Zustimmung einholen. Bei Bildern unter Google > Bilder ist Vorsicht geboten! Hier werden sämtliche Bilder von Privatpersonen, Agenturen, Fotografen etc. nur nach Begriff sortiert aufgelistet. Vergewissere dich, wem das Bild gehört und hole dir eine schriftliche Verwendungs Erlaubnis ein. Falle in deinen Bereichen und Sportarten nicht aus dem Rahmen. Unsere Kunden sollen immer wissen, dass sie sich in einem ASVZ Bereich befinden und stets die ASVZ Umgebung wiedererkennen. Ein wenig Einheit hilft dabei: Nur Farbbilder auf Übersichtsseiten verwenden. Bei allen Bildern immer die volle Bildbreite und volle Bildhöhe verwenden (588x160 Pixel, bzw. 270x168 Pixel) Themenbilder im Format.jpg statt Grafiken im Format.gif verwenden Bilder auswählen Erstelle auf deinem Gerät auf dem Desktop 2 Ordner: Bilder_roh und Bilder_hochladen Sammle im Ordner Bilder_roh alle Bilder zusammen, die du auf deinen Pages einfügen willst. Wichtig: Dieser Ordner muss jedesmal geleert werden, bevor du den PC runterfährst Bilder, die du im Original sichern willst, kannst du Kurt für die Ablage ins Bilderarchiv geben. Bitte kein eigenes Bildarchiv erstellen, sonst wird der Speicherplatz schnell wieder ein Problem.

2 Bildausschnitt wählen und auf richtiges Format zuschneiden mit Image Ready Vorher : Nachher: Anleitung : Öffnen via Programme > Adobe > Adobe Image Ready CS2 Image Ready ist das Tool von Photoshop speziell für die Bildbearbeitung von Webbildern. Vor dir liegt eine graue Fläche und auf der linken Seite der Werkzeugbereich, den du schon vom Photoshop oder Illustrator her kennst.

3 Arbeitsfläche : Ein oder mehrere Bilder via Drag and Drop * direkt aus dem Ordner Bilder_roh auf die Arbeitsfläche ziehen. *Bild/Dokument mit der Maus verschieben Unter Ansicht Bild auf 100% einzoomen, für grössengenaue Ansicht Anzeige der Bilddarstellung in %, 100% = Detailgetreu Visuelle Kontrolle der bestehenden Bildqualität, vor allem bei Absicht, nur einen Bidausschnitt zu verwenden Bildausschnitt wählen und freistellen: 1. Schritt: Werkzeug für Wahl des Ausschnittes (oben links, schraffiertes Rechteck) 2. Schritt: Mauszeiger in der linken oberen Ecke ansetzen, linke Maustaste drücken, halten und Mauszeiger zum gewünschten unter Rand rechts des Bildausschnittes ziehen. Linke Maustaste loslassen: Der gewählte Ausschnitt ist jetzt schraffiert umrahmt. Hinweis: schraffierte Auswahl aufheben, drücke Ctrl + D

4 3. Schritt: Menupunkt Bild die Funktion Freistellen wählen. Tipp: Wenn du mit dem ausgeschnittenen Resultat nicht zufrieden bist, kannst du immer mit Ctrl + Z jeweils 1 Schritt zurück Bild ist jetzt freigestellt und kann auf die genaue ASVZweb Grösse angepasst werden: 2 Formate: 588x160 Pixel, bzw. 270x168 Pixel Bildgrössen für ASVZweb zuschneiden, Schritt für Schritt: Menupunkt Bild die Funktion Bildgrösse wählen. Es öffnet sich ein Kontrollfenster für die Festlegung der Bildgrösse

5 Im Kontrollfenster die gewünschte Breite eingeben: Kleine Bilder 270 Pixel, Grosse Bilder 588 Pixel Die Höhe verändert sich mit der Breite automatisch. Mit OK Taste bestätigen Dieser Haken muss gesetzt sein, damit die Proportionen des Bildes erhalten bleiben. Menupunkt Bild die Funktion Arbeitsfläche wählen. Es öffnet sich ein Kontrollfenster für die Festlegung der Bildgrösse Im Kontrollfenster die gewünschte Höhe eingeben: Kleine und grosse Bilder: 168 Pixel Die Breite darf sich hier nicht verändern, sonst stimmt dein Bildausschnitt nicht mehr! Mit OK Taste bestätigen Dieser Haken darf nicht gesetzt sein. Mit der Positionierung setzt du fest, welchen Bildbereich du behalten willst. Du kannst auf alle 9 Felder klicken, entsprechend wird an der gegenüberliegenden Seite abgeschnitten. Mittleres Feld: reduziert die Höhe gleichmässig an allen Aussenkanten. In unserem Beispiel muss die Höhe von 203 Pixeln noch auf 168 Pixel geschnitten werden. Mit Feld unten links wird nur im oberen Bildbereich abgeschnitten.

6 Das Bild ist fertig zugeschnitten, Breite 588 Pixel, Höhe 168 Pixel. Bild für ASVZweb speichern: Hinweis: Spezielles Speichern für das Web ist notwendig, damit das Bild nicht zu schwer ist und lange Ladezeiten verursacht. Menupunkt Datei die Auswahl Optimiert Version speichern unter wählen. Tipp: Bild in deinem Ordner Bilder hochladen auf dem Desktop speichern. Gratuliere! Dein Bild hat den gewünschten Ausschnitt, ist im richtigen Format zugeschnitten und bereit zum Hochladen. Es kann gleich auf deiner erstellten Page eingefügt werden und wird so dargestellt, wie du es vorbereitet hast. Nicht vergessen: Vor dem Runterfahren des PC die Bilder aus dem Ordner Bilder_roh löschen.

7 Bilder bearbeiten mit Image Ready Öffnen via Programme > Adobe > Adobe Image Ready CS2 Image Ready ist ein umfangreiches Bildbearbeitungsprogramm. Hier wird nur auf die Tonwertkorrektur und die Schärfezeichnung eingegangen. Mit diesen beiden Massnahmen erreichen wir für das Web eine wirkungsvolle Bildverbesserung. Über Bildbearbeitung in Adobes Image Ready gibt es ganze Bücher. Mit Ausprobieren kommt man aber sehr schnell sehr weit. Mit wenigen Handgriffen kannst du die Qualität deiner Bilder optimieren. Tonwertkorrektur: Tonwertkorrektur: von Hand ergibt immer das beste Resultat! Kleine dreieckige Schieber: Position leicht verändern und Tonwert auf gewünschtes Resultat bringen. Tipp: keine Auto Kontrast oder Auto Tonwerkorrektur verwenden. Jedes Bild sollte durch das Auge beurteilt und individuell korrigiert werden. Automatisierte Abläufe gehen immer nach dem gleichen Muster vor. Tipp: zuerst mit dem mittleren Schieber arbeiten. Die äusseren Schieber nur zur Nachbesserung gegen die Mitte ziehen. Hinweis: während du die Schieber bewegst, kannst du die Veränderung gleich sehen.

8 Schärfekorrektur: 1. Schritt: Mit Ausschnittwerkzeug einzelne Bereiche oder ganzes Bild auswählen (schraffierte Umrandung für gewählten Bereich) 2. Schritt: Menupunkt Filter die Funktion Scharfzeichnungsfilter > Scharfzeichnen wählen. 1x anklicken ergibt für die gewählte Fläche 1x Scharfzeichnen. Dieser Vorgang kann solange wiederholt werden, bis Resultat stimmt. Tipp: Mit Ctrl + Z kannst du wieder 1 Schritt zurück. Dieser Vorgang ist auch mehrfach wiederholbar. Hinweis: Die Bildgrössenansicht sollte bei dieser Korrektur immer 100% sein, damit hast du eine Kontrolle bezüglich Verpixelung. Nicht vergessen: Vor dem Runterfahren des PC die Bilder aus dem Ordner Bilder_roh löschen.