SELFHTML Forums-Auslese Grafik
	Forums-Auslese Grafik-Dateiformate, Dokumentationen und Tipps
	Grafiken für Webseiten erstellen  Wie vermeide ich lange Ladezeiten?  Diagramme und mathematische Formeln darstellen  Schatteneffekte für Texte und Grafiken erzeugen

Grafiken für Webseiten erstellen

Basierend auf einem Forums-Beitrag vom 31.07.1998 von:
 Stefan Münz, muenz@csi.com

Eine interessante Seite zum Thema Grafik für Webseiten finden Sie auf  http://www.lemontree.de/seminare/gdbint/. Dort werden die Grundlagen der Computergrafik und das Erstellen web-gerechter Grafiken im Rahmen eines Seminars erklärt. Die Einführung ist sehr anschaulich und mit vielen Abbildungen ergänzt. Als Beispielprogramm für einzelne Bearbeitungsvorgänge wird Paint Shop Pro ( http://www.jasc.com/) verwendet, aber da die Vorgänge in der Verarbeitung von Pixelgrafiken im Grunde immer die gleichen sind, lässt sich das Wissen auch gut auf den Umgang mit anderen Programmen übertragen.

Wie vermeide ich lange Ladezeiten?

Basierend auf Forums-Beiträgen vom 24.08.1998 von:
 Hans-Peter Auer, earth.tirol@gmx.net
 Christian Weissengruber, c.weissengruber@visa-austria.com
 Michael Schmidhuber, Michael.Schmidhuber@dlr.de
 Roland Koch, koch@ganymed.de
 Stefan Karzauninkat, stefan@karzauninkat.com
 Stefan Münz, muenz@csi.com
und einem Forums-Beitrag vom 11.11.1998 von:
 Wolfgang Bund, wolfgang.bund@usa.net

Lange Ladezeiten sind für die meisten Besucher das größte Ärgernis im WWW. Viele von ihnen brechen bereits bei Grafiken von über 15-20 KB Dateigröße den Ladevorgang ab. Aus diesem Grund sollten nur optimierte Bilder eingesetzt werden. Die meisten Grafikprogramme wie Paint Shop Pro ( http://www.jasc.com/) oder Microgangelo GIFted ( http://www.impactsoft.com/, zum Erstellen von GIF-Animationen im kleineren Format) bieten eine "Save optimized"-Option im "Speichern unter"-Dialog an. Dort können Sie beispielsweise bei JPG-Bildern die gewünschte Kompressionsrate einstellen. Die Farbpalette der GIF-Grafiken wird auf die in dem Bild vorkommenden Farben reduziert. Ferner reicht für die Darstellung am Bildschirm eine Auflösung von 72 dpi (dpi= dots per inch - Bildpunkte pro Zoll).

Durch den Einsatz von ansprechenden Thumbnails, die Sie mit der Originalgrafik verlinken, können Sie die Übertragungszeiten ebenfalls niedrig halten. Ein praktisches Programm für die Erstellung von Thumbnails ist ThumbsPlus ( http://www.cerious.com/, Shareware).

Lesen Sie hierzu auch das Kapitel  WWW-gerechte Grafiken in SELFHTML und den Abschnitt Grafiken für Webseiten erstellen.

Diagramme und mathematische Formeln darstellen

Basierend auf Forums-Beiträgen vom 30.09.98 und 01.10.1998 von:
 Thomas Hieck, hkt@gmx.net
 Andre Steffens, steffens@terminus.de
 Olaf Groenemann, olaf_groenemann@compuserve.com
 Patrick Andrieu, PAF@atomic-eggs.com

MathHTML, mittlerweile vom W3C verabschiedet, ist in noch keinen der gängigen Browser implementiert worden. Wer vor der Aufgabe steht, auf seinen Webseiten mathematische Formeln darstellen zu müssen, wird daher auf den Einsatz entsprechender Grafiken nicht verzichten können. Zwar bietet die Schriftart "Symbol" einige mathematische und griechische Zeichen. Doch die Besucher, die diese Schriftart nicht installiert haben, werden die Formeln nicht zu sehen bekommen.

Eine Möglichkeit bietet der Einsatz von Grafiken. Diese können durch Verzicht auf viele Farben und Hintergründe in Bezug auf die Dateigröße klein gehalten werden. Schreiben Sie Ihre Formeln oder erstellen Sie Ihre Diagramme in Ihrer gewohnten Office-Anwendung (StarOffice, Lotus Smart Suite oder Microsoft Office). Machen Sie von dem Anwendungsfenster einen Screenshot (ein Bildschirmphoto): durch gleichzeitiges Drücken der Tasten [ALT] und [DRUCK] erstellen Sie ein Bild des aktiven Fensters, das in der Zwischenablage gespeichert wird. Von dort aus können Sie Ihr "Photo" in jedes Bildverarbeitungsprogramm einfügen und als GIF oder JPG abspeichern. Mit den Werkzeugen für Selektieren und Ausschneiden können Sie auf diese Weise von jeder Formel eine eigene Grafik in gewünschter Größe erstellen.

Hinweis:

Durch Screenshots lassen sich auch aus Cliparts und anderen Vektorgrafiken gute Bilder für Webseiten erstellen: oft werden bessere Ergebnisse erzielt als durch eine "interne" Konvertierung der Cliparts ins Format GIF oder JPG.

Schatteneffekte für Texte und Grafiken erzeugen

Basierend auf Forums-Beiträgen vom 17.12.1998 von:
 Thomas J.Sebestyen, a9105535@unet.univie.ac.at
 André Laugks, Andre.Laugks@netcologne.de
 Sebastian Martschat, sebhm@aol.com

Eine Möglichkeit, Schatteneffekte für Text zu erzeugen, wird in SELFHTML im Kapitel  Style-Sheet-Angaben: Schriftformatierung beschrieben. Jedoch wird der Befehl text-shadow:, der zur Version 2.0 der CSS Style-Sheets gehört, weder von Netscape noch vom MS Internet Explorer in den Versionen 4.x interpretiert.

Die weiteren, in SELFHTML unter  Style-Sheet-Angaben: Cursor und Microsoft-Spezialfilter gezeigten Möglichkeiten werden nur vom Internet Explorer 4.x interpretiert.

Für Schatteneffekte lassen sich ebenfalls, beispielsweise für Überschriften, Grafiken einsetzen. Wenn Ihr Bildverarbeitungsprogramm keine entsprechende Funktion besitzt ("Schatten zuweisen" oder "Drop Shadow"), lassen sich einfache Schatteneffekte durch Überlappen erzeugen: Sie schreiben einmal den Text in der gewünschten Schattenfarbe, schreiben dann den gleichen Text noch einmal, jedoch in einer anderen Farbe. Anschließend bringen Sie beide Textteile mit dem gewünschten Abstand leicht versetzt übereinander. Verfahren Sie genauso, um einen Schatten um eine Grafik zu erzeugen.

weiter:	Animierte GIFs
zurück:	Grafikprogramme und Tools
SELFHTML Forums-Auslese Grafik

© 2000  das Redaktionsteam