HTML-Dateien selbst erstellen

Grafiken in HTML

 Das richtige Dateiformat
 Transparente Hintergrundfarben
 Wallpapers, Cliparts und Icons

Das richtige Dateiformat

 Wenn keine besonderen Gründe dagegen sprechen, sollten Sie auf jeden Fall ein Dateiformat für Ihre Grafiken wählen, das (fast) alle WWW-Browser inline (d.h. direkt im Anzeigefenster) anzeigen können. Dies sind die beiden Formate GIF und JPEG.

Grafiken, die in anderen Dateiformaten vorliegen, sollten Sie konvertieren.

Beim GIF-Format gibt es eine 87er-Version und eine 89er-Version. Verwenden Sie möglichst immer die 89er-Version. Viele Grafikprogramme, die GIF-Dateien abspeichern können, bieten ohnehin keine Unterscheidung zwischen 87er- und 89er-Format an, sondern speichern automatisch im 89er-Format ab.

Ferner gibt es beim GIF-Format die Option "interlaced" bzw. "non-interlaced". Stellen Sie, wenn Ihr Grafikprogramm die Möglichkeit dazu anbietet, "interlaced" ein. Dadurch kann der WWW-Browser die Grafik "schichtweise" am Bildschirm aufbauen (bei Netscape können Sie das bei größeren Grafiken sehr gut beobachten). Wenn die Grafike "non-interlaced" abgespeichert ist, muß der Browser erst die gesamte Grafikdatei einlesen, bevor er mit der Bildschirmanzeige der Grafik beginnen kann.

Verwenden Sie das JPEG-Format anstelle des GIF-Formats vor allem dann, wenn Sie Fotos oder andere, nuancenreiche Bilder darstellen wollen. Denn JPEG unterstützt auch 32.000 und 64.000 Farben, während GIF maximal 256 Farben speichern kann.

 HTML-Dateien selbst erstellen
 Grafiken in HTML

Transparente Hintergrundfarben

 Die meisten modernen WWW-Browser bieten dem Anwender per Voreinstellung einen hellgrauen oder weißen Hintergrund für das Anzeigefenster an, sehen jedoch die Möglichkeit vor, die Hintergrundfarbe dem eigenen Geschmack anzupassen. Wenn Sie nun eine Grafik mit hellgrauem Hintergrund haben, wirkt diese Grafik auf einem weißen oder bunten Fensterhintergrund wie ein "häßlicher" grauer Fleck. Ideal wäre eine Grafik, die einen unsichtbaren (transparenten) Hintergrund hat, damit sie auf jedem Fensterhintergrund wirkt.

Das Dateiformat GIF, in dem die meisten Grafiken des WWW vorliegen, sieht die Möglichkeit vor, eine Farbe (hier: die Farbe für den Hintergrund) als unsichtbar zu definieren. Dies ist jedoch erst mit dem neuen, 89er-Format von GIF möglich. Im älteren, 87er Format ist das noch nicht möglich.

Unter MS-Windows gibt es mittlerweile zwei Grafikprogramme, mit denen Sie eine transparente Farbe bei GIF-Grafiken einstellen können: LView und Paintshop Pro (ab Version 3.11, nicht vorher!). Angesichts der umfangreichen übrigen Möglichkeiten zur Grafikbearbeitung ist Paintshop Pro wohl die ideale Wahl. Beide Programme sind Shareware und in vielen Mailboxen oder CompuServe-Foren zu haben. Achten Sie bei Paintshop Pro aber unbedingt darauf, daß die Versionsnummer 3.11 oder höher beträgt.

Transparente Hintergrundfarbe mit Paintshop Pro erzeugen

  1. Laden Sie die gewünschte Grafik mit "File/Open"
  2. Reduzieren Sie ggfs. die Farbanzahl auf 256 oder 16 mit "Colors/Decrease Color Depth"
  3. Klicken Sie in der Werkzeugleiste "Select" unten auf eines der beiden Farbquadrate. Am Bildschirm erscheint die Dialogbox "Color Palette".
  4. Klicken Sie in der angebotenen Palette auf die Farbe, die in Ihrer Grafik transparent sein soll. Die Farbe muß in der Grafik vorkommen und sollte sinnvollerweise den Bildhintergrund darstellen. Unten in der Dialogbox wird die Indexnummer der Farbe als erste Zahl hinter "Index" angezeigt. Merken Sie sich diese Zahl.
  5. Schließen Sie die Dialogbox. Speichern Sie die Grafik nun mit "File/Save As". Wählen Sie bei "List Files of types" GIF aus. Bei "File Sub-Format" stellen Sie am besten version 89a interlaced ein. Vergeben Sie bei "File Name" einen Dateinamen. Klicken Sie dann auf "Options" Am Bildschirm erscheint die Dialogbox "GIF Transparency Options"
  6. Wählen Sie den letzten Button "Set the Transparency value to" aus. Geben Sie in dem Eingabefeld dahinter die gemerkte Index-Zahl ein. Klicken Sie dann auf "OK".
  7. Klicken Sie nun noch in der Dialogbox "File/Save As" auf "OK".

 HTML-Dateien selbst erstellen
 Grafiken in HTML

Wallpapers, Cliparts und Icons

 Um Ihre WWW-Seiten attraktiv zu gestalten, brauchen Sie vor allem drei Typen von Grafiken: Wallpapers, Cliparts und Icons. Wallpapers sind Texturen bzw. tapetenmusterartige Flächen, die Sie benötigen, wenn Sie  Hintergrundbilder einsetzen wollen. Cliparts sind sinnreiche, oft humorvolle Grafiken, die Sie zur Auflockerung und zu Illustrationszwecken verwenden können. Icons sind kleine, symbolisierende Grafiken, die Sie für Corporate-Identity-Effekte und zur Anwenderorientierung einsetzen können, z.B. für Warnungen, bestimmte Verweistypen usw.

Solche Grafiken in befriedigender Qualität selbst zu erstellen ist für Nicht-Grafiker eine kaum lösbare Aufgabe. Auf CD-ROM, in Mailboxen, besonders auch in CompuServe und im WWW gibt es daher viele Bibliotheken mit Wallpapers, Cliparts und Icons. Doch Vorsicht: viele davon sind mit ausdrücklichem Urheberrecht versehen, d.h. Sie dürfen solche Grafiken entweder gar nicht oder nur gegen Kauf der Bibliothek für eigene Publikationen verwenden. Nur bei Sammlungen, die keine Urheberrechte ausweisen bzw. ausdrücklich als Freeware gekennzeichnet sind, können Sie sich bedenkenlos bedienen. Für professionelle Ansprüche ist aber in jedem Fall der Kauf einer Bibliothek mit Wallpapers bzw. Cliparts bzw. Icons zu erwägen.

Im WWW finden Sie Bibliotheken:

 Sandra's Clipart-Server -
 Arrows, Buttons, Lines, Words usw - (Netscape 2.0 - Frames!)

 HTML-Dateien selbst erstellen
 Grafiken in HTML