Bilder für das Netz
„Bei Bildern ist der Betrachter nur dann bereit, lange Wartezeiten in Kauf zu nehmen, wenn es entweder Nackte oder Tote zu sehen gibt."
aus dem Internet
Was ist ein Bild?
Beim Gestalten für das Internet ist jedes Element ein Bild, das nicht Text, Tabelle oder einfarbiger Hintergrund ist. Eine Internet-Seite besteht aus dem html-Code, in dem der Text, die Formatierungen und die Plätze und Dateinamen der Bilder festgelegt sind, und allen Bilddateien. Jedes Bildelement - egal ob Button oder Foto, hat eine eigene Datei. Wenn Bilder mehrmals auf der Site vorkommen, muß die Bilddatei nur einmal vorhanden sein. Eine Internet-Seite ist erst dann vollständig im Web zu sehen, wenn alle zu einer Seite gehörenden Dateien - Code und Bilddateien - auf den Server übertragen sind.
Das wichtigste Ziel
Das wichtigste Ziel ist, daß Bilddateien im Web möglichst klein sind (gemeint
ist die Dateigröße und nicht die tatsächlichen Abmessungen auf
der Site). Je kleiner eine Bilddatei ist, desto schneller wird sie übertragen,
je früher sieht sie also der Surfer.
Die Maßeinheit des Internets, also der
Bildschirmdarstellung, ist Pixel (Bildpunkte). Jeder Bildschirm
kann nur eine begrenzte Anzahl von Bildpunkten darstellen. Je größer die
Auflösung eines Bildes ist, desto „schärfer" erscheint es uns, weil wir die
Punkte, aus denen das Bild besteht, nicht mehr erkennen können, sondern Bilder
so aussehen, als würden sie aus tatsächlich ausgefüllten Flächen bestehen. Die
Auflösung eines Bildes fürs Web sollte so groß sein, daß die Surfer es gerade
noch als „scharf" empfinden.
Im Internet verwendet man sog.
Pixelgraphiken. Im Gegensatz zu Vektorgrafiken
können Pixelgrafiken nicht vergrößert werden, ohne daß sie „pixeln", also die
einzelnen Bildpunkte sichtbar werden. Die gängigen Browser können im
wesentlichen zwei Bildformate wiedergeben: *.gif und
*.jpg. Jedes Bild, das im Web veröffentlicht wird, sollte eines
dieser beiden Formate haben.
Die einfachste Möglichkeit, auf die Dateigröße
eines Bildes Einfluß zu nehmen, ist, die Auflösung, also die
Anzahl der Bildpunkte zu verändern. Verringert sich die Auflösung, wird das Bild
auch auf dem Bildschirm kleiner. Am besten verringert man die Auflösung so
lange, bis das Bild so klein ist, wie es auch tatsächlich auf der Web-Seite
erscheinen soll. Es empfiehlt sich nicht, Bilder im html-Editor kleinzuziehen.
Dabei wird nicht die Auflösung sondern nur die Abmessungen verändert, d.h. die
Dateigröße ändert sich nicht. Die Veränderung der Auflösung läßt sich mit jedem
gängigen Grafikprogramm vornehmen. Da einige Grafikprogramme das
Rückgängigmachen dieses Befehls nicht gestatten, empfiehlt es sich, vorher eine
Kopie des Bildes zu machen, bevor man Veränderungen an der Auflösung
vornimmt.
Eine weitere Möglichkeit, die Dateigröße zu reduzieren, ist, die
Anzahl der Farben zu verändern. Eine s/w Grafik ist verständlicherweise kleiner
als ein Bild mit 16 Millionen Farben. Es empfiehlt sich, Farbeinstellungen zu
verwenden, die dei Browser unterstützen. So ist die "Netscape" Farbpalette
optimiert auf die gute Darstellung von Bildern mit möglichst wenigen
Farben.
Man kann sich am schnellsten an die Pixel-Maßzahl gewöhnen, wenn man
sich die Größe eines Bildes in Relation zum Bildschirm vorstellt. Die meisten
Bildschirme haben eine Auflösung von 800x600 Pixel. Ein 400 Pixel breites Bild
nimmt hier also den halben Bildschirm ein.
Die Formate
Dateiformate erkennt man bei Windows an den - in der Regel - dreistelligen Dateiendungen wie *.doc oder *.txt. Diese Endungen sagen dem System, mit welchem Programm die Datei geöffnet werden soll.
Gif
Das Graphics Interchange Format (GIF) wurde für den Bildtransfer innerhalb von Compuserve entwickelt. Ein wichtiges Merkmal ist die besondere Kompressionsmethode, mit der die Dateigröße verringert werden kann. Gifs sind im Schnitt zwanzig- bis dreißigmal kleiner als die gleichen Bitmaps. Gifs können maximal 256 Farben pro Bild enthalten. Gifs eignen sich für Symbole, Buttons und Zeichnungen und weniger für fotorealistische Bilder. Gifs können auch transparent sein, beim Konvertieren in gif kann man die Farbe des Bildes festlegen, die transparent sein soll. Mit dem Spezialeffekt „Interlance" erscheint ein Bild scheinbar langsam auf dem Bildschirm anstatt sich Zeile für Zeile von oben nach unten aufzubauen.
JP(E)G
Die Joint Photographic Experts Group hat das JP(E)G-Bildformat für Hochgeschwindigkeitstransfer über digitale Kommunikationsnetze entwickelt. JPG ermöglicht fotorealistische Digitalbilder. JPEG kann bis zu 16,7 Millionen Farben darstellen. Bei JPG kann man zusätzlich zur Auflösung noch über den Kompressionsfaktor die Dateigröße beeinflussen. Je höher der Kompressionsfaktor desto schlechter ist allerdings auch die Bildqualität (ausprobieren).
Die Bilder können kommen ...
aus einer Digitalkamera
Die meisten Digitalkameras speichern die Daten bereits im *.jpg-Format ab, so daß keine Konvertierung mehr notwendig ist. Man muß meistens nur noch die Auflösung verändern und kann das Bild dann sofort einsetzen.
aus dem Web
Bilder aus dem Web können - abgesehen von der evtl auftretenden Urheberrechtsproblematik - technisch problemlos in eigenen Seiten verwandt werden, da sie in der Regel schon im richtigen Format vorliegen. Möglicherweise sind nur noch Änderungen der Auflösung notwendig. Bilder aus dem Internet kann man in der Regel nicht vergrößern, weil sie sonst pixeln.
aus dem Scanner
Beim Scannen von Bildern für das Web reicht eine Auflösung von 72dpi (dots per inch), da Monitore nicht mehr als 72dpi darstellen können. Eine größere dpi-Zahl würde also allenfalls zu einer größeren Datei und in der Regel nicht zu einer verbesserten Darstellung führen.
aus Grafikprogrammen
Für selbstgemachte Grafiken gilt das gleiche wie für andere auch. Beim Exportieren/Konvertieren in die Web-Formate sollte man daran denken, daß die Bilder danach nicht mehr skalierbar sind.
Hintergrund
Ein einfarbiger Hintergrund ist völlig unproblematisch und kann mithilfe
eines html-Befehls hergestellt werden.
Nimmt man als Hintergrund ein Bild,
„kachelt" der Browser das so oft, bis die Seite voll ist. Das heißt, habe ich
ein Hintergrundbild, das 200x100 Pixel groß ist, wird es entsprechend der
Auflösung des Monitos mehrmals neben- und untereinander eingefügt. Dieses
„Kacheln" kann zum Beispiel bei einem immer wiederkehrenden Muster gewollt
sein.
Soll das Hintergrundbild tatsächlich nur einmal zu sehen sein, muß man
die Auflösung des Hintergrundbildes so groß machen (1200 Pixel), daß der Browser
selbst bei großen Bildschirmen nicht mehr als ein Bild nebeneinander bekommt.
Nachteil ist allerdings, daß Nutzer mit kleineren Bildschirmen möglicherweise
nicht alles von dem Hintergrundbild sehen können, weil ihnen ja bis zu 400 Pixel
fehlen können. Besonderes Augenmerk sollte man dabei auf die Dateigröße richten,
da Hintergrundgrafiken in der Regel keine unverzichtbaren Informationen
enthalten und wenig Surfer bereit sein werden, darauf zu warten. Bei jpg also
Kompression erhöhen und bei gif Farben verringern.
Gif-Animationen
Das gif-Format unterstützt die Möglichkeit, mehrere Grafiken in einer
Grafikdatei zusammenzufassen. Die einzelnen Bilder werden dann nacheinander
gezeigt, es entsteht der Eindruck einer Bewegung etwa wie bei einem Daumenkino.
Die Bilder für eine gif-Animation sollten gleich hoch und breit sein. In
sog. Gif-Animatoren kann man die Einzelbilder zu der Animation zusammensetzen.
Gif-Animationen haben den Nachteil, daß sie schnell sehr groß
werden.