www.mit-Bildern-arbeiten.de

Grafikprogramme

Grafikprogramme sind für die produktive Arbeit mit dem World Wide Web unentbehrlich. Spätestens wenn man selbst Seiten ins Netz stellen will, muss man Bilder einsetzen, die dann für den Web-Auftritt bearbeitet werden müssen.

Auch bei den Grafikprogrammen ist das Angebot inzwischen groß und nahezu unüberschaubar. Eine subjektive Auswahl stelle ich im Folgenden vor:

• IrfanView. Fast schon ein richtiges Grafikprogramm, vor allem aber ein unentbehrliches kleines kostenloses Grafik-Utility ist IrfanView. Es sollte auf keinem Computer fehlen und auch jeweils auf die neuste Version überprüft werden, da gerade in letzter Zeit gute Funktionen hinzugekommen sind. Wichtig ist, sich gleich auch die zahlreichen Plug-Ins zu installieren, die IrfanView befähigen, mit nahezu jedem Bildtyp umzugehen.
• Gimp. Eine sehr mächtige, aber gewöhnungsbedürftige Grafiksoftware ist das aus den Linux-Welten bekannte Gimp. Anders als bei anderen Programmen verteilen sich die Werkzeuge hier über verschiedene frei platzierbare Fenster. Dafür kann man aber mit Hilfe des Programms sehr viel an den Bildern verändern.
• PaintShopPro. Lange Zeit war PaintShopPro das Programm für die Bearbeitung von Grafiken fürs Internet (nicht zuletzt deshalb, weil sich die Shareware-Version unbegrenzt nutzen ließ). Inzwischen sind ältere - aber keinesfalls veraltete - Versionen als kostenlose Vollversionen erhältlich (z.B. als Beilage in Computerzeitschriften). Mit diesem Programm kann man alle wesentlichen Aufgaben der Grafikbearbeitung fürs Netz erledigen. Darüber hinaus kann man mit dem zugehörigen Animation Shop auch animierte Grafiken erstellen. Sehr gut ist auch der integrierte Bildbrowser.
• Micrografx Picture Publisher. Auch dieses Programm gibt es als ältere Version kostenlos als Zeitschriftenbeilage. Es verfügt über alle wichtigen Funktionen, die man fürs WWW braucht, einschließlich der Möglichkeit, animierte Grafiken zu erstellen. Hilfreich auch die integrierten Tutorials, die in die Möglichkeiten des Programms einführen.
• Photoshop Elements. Das ist der kleine und gerade noch bezahlbare Bruder des relativ teuren Profiprogramm Photoshop. Es ist für die Bearbeitung von Fotos von Digitalkameras vorgesehen und beinhaltet eine Fülle von Bildmanipulationsmöglichkeiten. Darüber hinaus lassen sich Bilder als Webgrafiken ausgeben. Mit ein wenig Geschick lassen sich mit Hilfe von Photoshop Elements sehr gute Internetauftritte realisieren. Auch Photoshop Elements hat integrierte Tutorials, die einem bei der Arbeit zur Seite stehen.
• Ulead Photo Impact. Schon ein (teures) Profiprogramm ist Photo Impact. Es hat eine besondere Ausrichtung auf Internetgrafiken und hat zudem eine Fülle von Vorlagen für das Web-Design.

Bildformate

Kaum eine Webseite kommt heute ohne Bilder aus. Und dennoch werden selten so viele Fehler gemacht wie gerade hier. Oftmals dauert es Minuten, bis eine Webseite geladen ist, weil die Bilder nicht auf ein dem Internet entsprechenden Format heruntergerechnet wurden. So trifft man nicht selten auf Grafiken, die nur wenige Zentimeter groß sind und doch mehr als 100 Kbyte umfassen. Im Internet ist die maximal sinnvolle Auflösung 92 dpi, mehr können Monitore nicht darstellen (während Drucker mit 300, 600 oder 1200 dpi [= dots per inch] arbeiten). Grundsätzlich sollte der Gesamtumfang an Grafiken einer Seite 60 Kbyte nicht überschreiten. Kommen also vier Grafiken auf einer Seite vor, sollte die einzelne Grafik nicht größer als 15 Kbyte sein. Ausnahmen bestätigen die Regel: Wenn man eine Bildergalerie ankündigt, wird der Nutzer nicht überrascht sein, dass der Ladevorgang vielleicht etwas länger dauert. Aber auch hier sollte man nicht übertreiben.

Wer in bestimmten Fällen den Besuchern seiner Webseite dennoch große Bilder für detaillierte Studien anbieten will, sollte so genannte Thumbnails erstellen, Miniaturansichten, auf die der Nutzer klicken kann, um das Bild in voller Größe betrachten zu können. Freewareprogramme wie das empfehlenswerte IrfanView, aber auch andere Programme bieten eine automatisierte Funktion für Thumbnail-Webseiten.

Gängig sind im Internet zwei Formate (möglich sind drei, aber das PNG-Format hat sich bisher nicht durchgesetzt): JPEG-Dateien und GIF-Dateien.

• GIF (Graphics Interchange Format) ist geeignet für Strichzeichnungen, Logos, Text und Illustrationen mit einfarbigen Flächen. Das Format komprimiert verlustfrei, unterstützt allerdings nur maximal 256 Farben, weshalb es für Fotos und Farbverläufe nicht geeignet ist. GIFs lassen sich im interlaced-Modus abspeichern, dann baut sich das Bild beim Laden nach einer groben Vorschau Schritt für Schritt auf, wird also immer deutlicher. GIFs können zudem mit einer transparenten Farbe gespeichert werden, die dann den Hintergrund der Webseite durchscheinen lässt. Und schließlich lassen sich GIF-Dateien animieren, das heißt es lassen sich auf einfache Art Bewegungseffekte erzielen.
• JPEG (Joint Photographics Experts Group) eignet sich eher für größere Fotos und komprimiert mit Verlusten. Dabei werden ähnliche Flächen zusammengefasst. Der Komprimierungsgrad kann eingestellt werden und man sollte ein wenig experimentieren, um das beste Ergebnis ohne allzu viel Einbußen zu erzielen. Auch JPEGs lassen sich "progressiv" abspeichern, so dass beim Laden zunächst nur eine grobe Vorschau angezeigt wird, die nach und klar deutlich wird.

Beim Einlesen von Bildern sollte man sie zuerst mit 300 dpi scannen und dann die notwendigen Korrekturen vornehmen. Anschließend sollte das Bild auf die Bildgröße und Auflösung heruntergerechnet werden, die auf der Webseite auch wirklich Verwendung findet.

Neben diesen beiden Bildformaten gibt es noch eine unüberschaubare Fülle von Bildformaten, denn fast jeder Programm-Hersteller betreibt auch noch ein eigenes Bildformat. Die bekanntesten sonstigen Bildformate sind:

• BMP (Bitmap, Microsoft) und komprimiert dann RLE: Älteres Bildformat, heute vor allem noch für Windows-Hintergrundbildern verwendet.
  
• TIFF (Tagged Image File Format) ein verbreitetes, farbgetreues Bildformat.
  

Rechtliches

Über den rechtlichen Rahmen der Verwendung von Bildern und Texten im Internet herrscht oftmals Verwirrung. Und vermutlich hat jeder, der eine Homepage betreibt, schon einmal gegen rechtliche Bestimmungen verstoßen. Grundsätzlich gilt in Deutschland: Bis zum 70. Todestag eines Urhebers sind dessen Texte und Bilder geschützt, ihre Verwendung genehmigungs- und entgeltpflichtig. Sofern die Rechte nicht an eine Verwertungsgesellschaft abgetreten wurden, müssen die Erben des Urhebers die Zustimmung geben bzw. erhalten das anfallende Honorar. Wenn der Urheber eines Textes oder eines Bildes aber 70 Jahre tot ist, werden seine Texte und Bilder abgabefrei, das heißt man kann sie im Rahmen einer Webseite verwenden (muss aber natürlich weiterhin den Urheber angeben). Wenn also jemand zum Beispiel ein Werk des Malers Max Slevogt (1868-1932) abbilden wollte, hätte er bis zum 20. September 2002 Urheberrechtsentgelte bezahlen müssen, nun aber nicht mehr.

Auch wenn jemand ein Bild im Internet veröffentlicht hat, darf man es nicht einfach kopieren und selbst verwenden. Auch die beliebte Einbindung in die eigene Seite durch einen externen Link ist eine Verletzung des Urheberrechts.

Kompliziert wird die Situation, wenn zwischenzeitlich durch Dritte Rechte erworben wurden. So ist Martin Luther zwar mehr als 70 Jahre tot, die revidierte Bibelübersetzung von 1984 unterliegt aber dem Urheberrecht, weil hier Autoren das Recht an der Anpassung des Luther-Textes an die aktuelle Sprache erworben haben. Die Revision des Luther-Textes von 1902 dagegen ist rechtefrei. Bei Bildern wird es kompliziert, wenn das Foto eines alten Kunstwerks neu ist. Dann hat u.U. der Fotograf des Bildes ein Recht auf Entgelt.

Für den Schulbereich ist es wichtig, dass jede Person (eingeschränkt bei Personen der Zeitgeschichte) ein Recht auf das eigene Bild hat. Bei den beliebten Klassenfotos auf der Schulhomepage sollte man daher immer vorher(!) die Genehmigung der Eltern zur Veröffentlichung einholen. Anders ist die Situation bei öffentlichen Schulveranstaltungen, da hier die Personen nur als Beiwerk oder als Teil einer Versammlung abgebildet sind.

Grundsätzlich gilt das gerade Beschriebene für den öffentlichen Gebrauch von Bildern und Texten. Wer Bilder und Texte im privaten Raum nutzt, unterliegt keinen Abgabeverpflichtungen.

Bilder finden

Inhalte übernehmen

Oftmals möchte man Grafiken aus dem World Wide Web in das eigene Office-Programm oder die eigene HTML-Seite übernehmen (Achtung: Urheberrecht! Mehr dazu unter Rechtliches).

Bei Grafiken ist es am einfachsten, sie direkt abzuspeichern. Dazu fährt man mit der Maus über das Bild, das man haben will, klickt mit der rechten Maustaste darauf und wählt im Menu: Bild speichern unter ... Nach der Auswahl des Ablage-Ortes (z.B. ein spezieller Bild-Ordner) klickt man auf OK. Im Textverarbeitungsprogramm wählt man dann z.B. bei Word: Einfügen - Grafik - Aus Datei und sucht den Bildordner auf und wählt das gespeicherte Bild aus. Bei HTML-Editoren klickt man in der Regel auf das Bildsymbol und wählt dann das zu integrierende Bild aus.

Wenn man ein Bild nicht abspeichern kann (weil z.B. ein Java-Script die Nutzung der rechten Maustaste unterbindet), dann kann man auf einfache Weise den Bildschirm fotografieren (ein so genannter Screenshot). Dazu drückt man auf der Tastatur einfach die Taste "Print Screen" (in der Regel rechts neben der Taste F12). Dann sollte man ein Grafikprogramm aufrufen und über "Bearbeiten - Einfügen" das Bildschirmfoto aus der Zwischenablage einfügen. Nun muss es noch nachbearbeitet werden, weil man ja nicht den ganzen Bildschirm als Bild haben will. Aber auch hier muss das Urheberrecht gewahrt werden. Screenshots sind nur in einem engen Rahmen erlaubt.

Suchmaschinen

Die für die ganz normale Internetrecherche verwendeten Suchmaschinen eignen sich auch für die Bildersuche. Nehmen wir als Beispiel die Suchmaschine http://www.google.de. Wer sie aufruft, findet oberhalb des Suchfeldes einen Karteireiter "Bilder". Darauf klickt man und kann dann seinen Suchbegriff z.B. einen Künstlernamen oder ein Thema eingeben. Bei den Themen lohnt es sich, neben der Eingabe des deutschen Begriffs z.B. "Abendmahl" auch den entsprechenden englischen "Last Supper" einzugeben, da viele Bilder im Internet in englischsprachigen Datenbanken abgelegt sind und die bloße Suche nach einem deutschen Stichwort das Ergebnis verfälscht. Die Suchmaschine listet dann eine Fülle von Thumbnails von in Frage kommenden Bildern auf. Man sollte das Ergebnis u.U. noch nach Größe der gefundenen Bilder sortieren lassen (unter erweiterte Suchoptionen einstellbar), da kleine Bilder für die Weiterarbeit wenig hilfreich sind (Leonardos Abendmahl ist in einer Bildbreite von 250 Pixeln kaum lesbar). Durch Anklicken der Thumbnails kommt man dann auf eine Vorschau der Originalseite. Da Bilder in der Regel nicht über ihren Inhalt Auskunft geben, findet die Suchmaschine sie, indem sie die Stichwörter des sie umgebenden Textes bzw. den als Bildersatz angegebenen Text analysiert. Aus diesem Grund sind viele der gefundenen Bilder auch nicht verwendbar, da sie mit dem Stichwort nichts oder nur wenig zu tun haben. Dennoch ist das Ergebnis der Recherche für die normale Arbeit in der Regel ausreichend.

Links

Inzwischen gibt es einige spezialisierte Adressen im Netz, die exzellentes Bildmaterial für die Arbeit zusammenstellen. Einige bieten Hintergrundwissen, andere haben zahlreiche Links zusammengestellt und dritte präsentieren gleich eine Datenbank mit Tausenden von Bildern.

http://gallery.euroweb.hu/

Wer auf der Suche nach wichtigen und bekannten Kunstwerken aus der Kunstgeschichte ist, findet bei der Webgallery of Art über 12.000 Gemälde und Skulpturen aus der Zeit zwischen 1100 und 1800. Das ist die umfangreichste, beste und zugleich auch zuverlässigste Adresse im Netz. Herausragend nicht nur die komfortablen Suchmöglichkeiten, die es etwa erlauben, die Suche auf einen bestimmten Stil, ein Land, eine Epoche etc. einzuschränken. Auch die Qualität der Bilder ist gut und über einen Image-Viewer zudem gut zoom- und damit erschließbar. Einziges Manko: die Suchbegriffe müssen in Englisch eingegeben werden (nicht immer weiß man, wie der betreffende Begriff in Englisch lautet).

http://www.kunstunterricht.de

Hintergrundwissen, Links, aktuelle Hinweise und vieles mehr findet man bei dieser Adresse, die von vielen engagierten Institutionen und Personen betrieben wird. U.a. werden auch Hinweise auf interessante Fernsehsendungen gegeben.

http://www.kunstwissen.de

Einem engagierten Kunstlehrer (und Beuysschüler) verdanken wir diese Website mit Infos zum Thema Malerei, Skulptur und Architektur. In vielen Übersichten wird so ein Grundwissen zur Kunst quer durch die Jahrhunderte vermittelt. Gerade auch für Schülerinnen und Schüler zu empfehlen.

https://www.theomag.de/05/index.htm

Im Heft 5 des Magazins für Theologie und Ästhetik hat die Redaktion Linklisten zu den wichtigsten Museen, Galerien und Kunstprojekten der ganzen Welt publiziert. Die Linklisten werden von Zeit zu Zeit aktualisiert. Auch der Blick auf andere Ausgaben des Magazins lohnt, hier kann man viel Material finden.

http://www.uni-leipzig.de/ru

Unter dieser Adresse findet man Bilder zu den Themen eines normalen Lehrplans des Faches Religion sowie Hilfestellungen für den Umgang mit Bildern im Religionsunterricht. Inhaltlich klickt man anhand einer Übersicht auf ein gewünschtes Thema und dann werden entsprechende werke vorgestellt. Die Bilder werden in einer exzellenten Auflösung angeboten, allerdings ist die Bandbreite der verwendeten Künstler etwas schmal (zu viel Rembrandt).

http://witcombe.sbc.edu/ARTHLinks.html

Einen Überblick über die kunstgeschichtlichen Quellen im Netz bietet diese Adresse.

Bilder bearbeiten

Größe / Auflösung ändern

Nur selten wird man die Bilder, mit denen man arbeitet, in der für die Internetarbeit passenden Form und Größe bereits vorfinden. Es macht aber auch keinen Sinn, die Dateien größer zu lassen, als man sie im Internet braucht, da sie dann nur überflüssige Übertragungskapazitäten und -zeit beanspruchen würden. Also sollte man überlegen, wie groß das Bild auf der Webseite sein sollte, und es auf die entsprechende Pixelgröße bringen (achten muss man darauf, dass Höhe und Breite proportional verändert werden). Dabei kann man bei den meisten Grafik-Programmen zugleich auch die Auflösung einstellen. Diese sollte für das Internet nur 72 oder 92 dpi betragen (und nicht 300 bis 1200 dpi, die Drucker benötigen), da Monitore nicht mehr Bildinformationen darstellen können.

Kompression einstellen

Beim Abspeichern von jpg-Dateien sollte man unterschiedliche Kompressionsstufen ausprobieren und kontrollieren, ob das Resultat den eigenen Ansprüchen entspricht. Viele Grafikprogramme lassen schon beim Speichern eine optische Resultatüberprüfung zu.

Transparenz einstellen

Gif-Dateien erlauben es, ihren Bildhintergrund (aber auch jede andere beliebige Farbe des Bildes) transparent zu schalten, so dass der Bildinhalt sich dem Hintergrund der Webseite anpasst. Das ist gerade bei Schaltflächen und Logos empfehlenswert. Dazu wird unter der Funktion "Transparenz setzen" die entsprechende Farbe ausgewählt.

Ausschneiden / Einfügen

Oft braucht man nicht das gesamte Bild, sondern nur einen Bildausschnitt. Dazu gibt es in jedem Grafikprogramm eine entsprechende Ausschnittfunktion. In der Regel kann man die Art des Ausschneidens beeinflussen, also ob man mit einem Kreis, einem Rechteck oder polygonal ausschneiden will. Man kann eine Punkt-zu-Punkt-Linie ziehen, um den Auswahlbereich festzulegen. Über die Funktionen "Bearbeiten - Ausschneiden", "Bearbeiten - Kopieren", "Bearbeiten - Einfügen" lassen sich so Bilder reduzieren, erweitern und manipulieren.

Qualität verbessern

Viele Grafikprogramme besitzen automatisierte Assistenten, die die Bildqualität zu verbessern helfen. Dazu gehört das Entfernen der berüchtigten roten Augen und diverser Kratzer, aber auch der Farb-, Kontrast- und Helligkeitsausgleich. Auch hier muss man immer Bildschirmdarstellung und Druckqualität unterscheiden. Was auf dem Bildschirm gut aussieht, garantiert kein gutes Druckergebnis, eine gute Druckvorlage ist oftmals zu dunkel für den Computermonitor. Hier muss man Kompromisse schließen.

Thumbnails / Vorschauseiten erstellen

Gerade wenn man viele Bilder auf einer Internetseite präsentieren will, z.B. Fotos von der letzten Klassenfahrt oder einen Überblick über die Geschichte der Christusbilder, sollte man die Bilder nicht gleich im Großformat auf der Seite präsentieren, denn spätestens bei mehr als vier oder fünf großen Bildern gerät die Übertragung ins stocken. Besser ist es, dem Betrachter eine Vorschauseite anzubieten, bei der er selbst aussuchen kann, welche Bilder er sich großformatig anschauen will. Programme wie etwa Irfanview ermöglichen auf einfache Art und Weise derartige Vorschauseiten. Man stellt alle in Frage kommenden Bilder in einem Verzeichnis zusammen und lässt dann das Programm automatisch eine Vorschauseite erstellen. Dazu kann man festlegen, wie viele Bilder nebeneinander platziert werden sollen und ob die großen Bilder im, selben oder in einem separaten Browser-Fenster aufgerufen werden sollen. In der Regel wird man die so erstellte Internetseite nachher noch bearbeiten und an das eigene Design anpassen müssen.

Bilder manipulieren

Selbst einfache Grafikprogramme verfügen heute über Funktionen, um Bilder umfassend zu manipulieren und zu verändern. Beginnend mit einfachen Filtern, um Bilder scharf zu zeichnen oder mit einem Nebel zu überziehen, sie in einen Prägedruck oder ein Ölgemälde umzuwandeln, über die Möglichkeit Bilder zu Rahmen oder zu Buttons umzuformen, bis hin zu so genannten Deformationsfiltern, mit denen man Bilder runden, strecken, pressen usw. kann, gibt es unzählige Möglichkeiten. Wer also z.B. eine kleine perspektivische Galerie auf seiner Website einbauen will, kann für das Aufhängen der Bilder die Vorlagen entsprechend perspektivisch verzerren, so dass ein fast perfekter dreidimensionaler Eindruck entsteht.

Mit Ebenen arbeiten

Richtig interessant wird die Arbeit mit Bildern, wenn man mit verschiedenen Ebenen arbeitet. Man kann Objekte auf Bildern platzieren, die vorher nicht dort waren, kann sie verschieben und Bewegungs- und Erzähl-Abläufe veranschaulichen. Die Arbeit mit Ebenen entspricht der mit verschiedenen Folien eines Overheadprojektors, die übereinander gelegt werden. Man definiert zunächst eine Hintergrundebene, eine Skizze oder ein Bild, und legt dann Schicht für Schicht über diesen Hintergrund. Jede Ebene kann eigenständig bearbeitet und verändert werden. So könnte man ein Gemälde als Hintergrund festlegen und es dann Detail für Detail (= Schicht für Schicht) erläutern. Oder man kann eine kleine Galerie einrichten und auf der perspektivischen Hintergrundskizze ein Bild nach dem anderen aufhängen und den Raum selbst sogar mit Skulpturen und Besuchern füllen [ein Beispiel findet man unter http://www.polka.de]. Auf dieselbe Art kann man eine Kapelle oder einen Meditationsraum gestalten. Am Schluss der Bearbeitung erstellt man dann aus der Datei mit den verschiedenen Ebenen eine gif- oder jpg-Datei für das Internet und kann diese dann mit einem HTML-Programm weiter bearbeiten, z.B. als Imagemap.

Mit Bildern arbeiten

Wer auf die bisher beschriebene Art und Weise lernt, Bilder zu gestalten und verändern, kann nun mit Hilfe spezifischer Funktionen der HTML-Sprache und einigen Java-Scripts interessante und lehrreiche Effekte auf Webseiten erzielen.

Hotspot / Imagemap

Die pädagogisch vielleicht interessanteste Form des Bildumgangs im Internet sind die so genannten Imagemaps bzw. Hotspots. Sie ermöglichen, gezielt bestimmte Bereiche eines Bildes als Links zu definieren. Man fährt dann mit der Maus über das Bild und immer, wenn man über bestimmte Bildteile fährt, kann man darauf klicken und gelangt zu einer weiterführenden Internetseite. Auf diese Weise kann man z.B. aus Leonardo da Vincis berühmtem Abendmahl ein Imagemap erstellen, das nach und nach die einzelnen Jünger und Elemente des Bildes erläutert. Oder man kann mit Lukas Cranachs berühmten "Gesetz und Evangelium" - ein Simultanbild, das von der Erschaffung der Erde bis zu Kreuzigung und Auferstehung führt - ein Stück Heilsgeschichte rekonstruieren. In den HTML-Programmen richtet man dazu eine Seite ein, die als zentralen Bestandteil das zu erschließende Bild enthält. Dann definiert man Bildteil für Bildteil als "Hotspot" (das HTML-Programm färbt dazu den definierten Bildteil ein), der beim Klick auf eine andere Seite führt. Der Nutzer sieht zunächst nicht, dass er ein Imagemap vor sich hat, aber er merkt es, wenn er mit der Maus über das Bild fährt.

Rollover-Effekte

Rollover-Effekte sind nichts anderes als zwei nacheinander geladene Bilder, die nach definierten Ereignissen (z.B. Mausklick oder Mausbewegung) aktiviert werden. So kann man zum Beispiel zunächst ein Kunstwerk wie Cranachs "Gesetz und Evangelium" zeigen und dann, wenn der Mauszeiger das Bild "berührt", die Bewegungsdynamik des Bildes visualisieren. Dazu muss man zwei Bilder bereithalten: ein unverändertes Bild des Kunstwerks und ein zweites, auf dem man die Bildbewegungen ein21gezeichnet hat. Beide werden nun über die Roll-over-Funktion miteinander verknüpft. Immer dann, wenn der Mauszeiger das Ursprungsbild berührt, lädt und zeigt das Programm das zweite Bild. Sobald er sich vom Bild entfernt, sieht man wieder das ursprüngliche Bild. Statt Bewegungen könnte man auch die Reihenfolge der Bilderzählung visualisieren oder verwandte Bilder einblenden.