Schrift / Farbe

• Überlegen Sie selbstkritisch, ob sich überhaupt jemand für Ihre Informationen interessiert. 
• Geben Sie Ihren Lesern Informationen.
• Je spezifischer und genauer die Fakten, umso interessanter wird es für Ihre LeserInnen.
• Geben Sie nur Links zu Web-Seiten an, die zu Ihrem Dokument passen und die nicht jeder kennt.

• Text sparsam einsetzen, prägnant formulieren. Der Bildschirm liest sich nicht wie ein Buch.
• Gliedern Sie jede Bildschirmseite übersichtlich (z.B. durch Listen und durch Schriftauszeichnungen).
• Machen Sie umfangreiche Inhalte übersichtlicher: 
• Sie können den Text  in verschiedene Dateien aufteilen, die Sie durch Links miteinander verbinden.
• Nachteil: Jede Seite muss neu geladen werden.
• Sie können den Text in Abschnitte mit Überschriften gliedern und  innerhalb einer Datei durch Links verbinden.
• Vorteil: Die Datei kann leichter von  Lesern gespeichert und ausgedruckt werden.

• Die Schriftart muß zur Aussage / zum "Produkt" passen.

• Vermeiden Sie eine übermäßige Mischung verschiedener Schriften.
• Wenn Sie Schriften mischen, mischen Sie nur Schriften, die kontrastieren.
• Setzen Sie die vom Editor zur Verfügung gestellten Schriftauszeichnungen ein:
• Schriftgrößen, fett, kursiv.
• Benutzen Sie diese Auszeichnungen in zusammengehörigen Dokumenten einheitlich.
• Am besten zu lesen ist Schrift, die zum Hintergrund einen Kontrast bildet.

• Auf dem Bildschirm ist helle Schrift auf dunklem Hintergrund gut lesbar. 
• Den Background müssen Sie aber immer mitliefern. 
• Nicht alle Browser können die von Ihnen gewünschten grafischen Experimente darstellen. 
• Immer sicher:  dunkle Schrift auf hellem Background.

Links können 

• ein Navigieren durch die hierarchische Struktur des Hypertextdokuments ermöglichen (vor, zurück, Anfang) 

• oder Querverweise darstellen, die auf einer inhaltlichen Beziehung zwischen den Seiten beruhen:

Querverweise

• Webseiten haben eine nichtlineare Textstruktur. LeserInnen können mit Hilfe der "Hyperlinks" (Querverweise) ihre eigenen Wege gehen. 

• Sie kann einfach durchgearbeitet werden.
• Sie ist übersichtlich.
• Logisch zusammenhängende Informationen sollten so aufgeteilt werden, dass sie jeweils in einen Bildschirm passen.
• Kein Dokument sollte mehr als zwei bis drei Bildschirme füllen. Ein Scrollen über viele Bildschirmseiten kann auf diese Weise vermieden werden.

• Angaben zur Autorenschaft 
• Zeitpunkt der letzten Änderung 
• E-Mail-Adresse und/oder Link auf die Seite des Autors.

• müssen auf dem Bildschirm zur Verfügung gestellt werden.
• sollten auf der ganzen Web-Seite einheitlich sein.
• sollten eindeutig und klar sein:
• Intuitive Benutzerführung ist für Ihre LeserInnen am hilfreichsten.
• Benutzen Sie bekannte Steuerelemente, z.B. die Video-Rekorder-Tasten.
• können sprachlich oder grafisch ( durch Icons/Symbole) erfolgen.
• Gags, die der eigentlichen Funktion nicht dienen, verwirren nur.
• Symbole sollten auch als Text verfügbar sein, falls im Browser das Laden von Grafik deaktiviert ist.

• Zu viele Interaktionsmöglichkeiten
• Zu große Datenmenge
• Zu viele Links
• Unübersichtlicher Aufbau
• Ratespiel. Der Benutzer gelangt nur unter Umwegen und nach langem Suchen zum Ziel.

Dem Benutzer wird abverlangt, daß er die Systematik der Seite im Kopf hat.

• Der Kopfteil enthält Informationen über die Seite, die zur Identifikation des Dokuments dienen.
• Der Tag <Title> beschreibt den Text, der nach Aufruf der Seite in der Titelleiste des Browsers angezeigt wird. 
• Wird die Seite den Lesezeichen hinzugefügt, erscheint der Text in der Lesezeichenliste.
• Wenn Sie unter <Title> keinen Eintrag machen, erscheint in Titelleiste und Bookmarks das nichtssagende "untitled".

 

 
 
 

Meta-Informationen sind Elemente, die vom Browser nicht dargestellt, von Suchmaschinen aber gelesen werden. Sie dienen also dazu, dem Browser nicht darstellbare Informationen zum Zwecke der Identifikation, Indizierung und Katalogisierung von Dokumenten zu übergeben. Wenn Sie Wert darauf legen, daß Ihre Dokumente durch Suchmaschinen eindeutig klassifiziert werden können, dann sollten Sie auf die Erstellung dieser Elemente (Meta-Tags) nicht verzichten. 

"Properties" -> "Document" -> Tragen Sie einen möglichst aussagekräftigen und kurzen Titel (und am besten noch den Verfassernamen) ein.

• kleine und wenige Bilder vermeiden lange Übertragungszeiten Ihrer Web-Seiten.
• Viele Standard-PCs zeigen lediglich 256 Farben an.
• GIF- und JPEG-Formate können von allen Browsern angezeigt werden.

• 3-D-Effekte verleihen dem flachen Medium räumliche "Tiefe".
• Methoden:
• Schatten,
• Glanzlichter
• Beleuchtungseffekte
• Perspektive

• sollte auf die Funktion, die die Seite erfüllen soll, abgestimmt sein.
• darf das Lesen nicht erschweren, sondern soll es erleichtern.
• Ein im Grafikprogramm kontrastarm aussehendes Bild kann im Browser stärker stören als vorgesehen.
• Am besten verwenden Sie dunkle Schrift auf hellem Grund.
• kann Ihr persönliches Erkennungszeichen im Internet sein.

• Eine Grafik wird als Hintergrund ausgesucht und gespeichert.
• Es reicht eine Größe von 200 mal 200 Pixel.
• Grafikformat Gif oder JPG.
• Netscape-Editor: "Eigenschaften" -> "Dokument" -> "Gesamtbild" - Hintergrundgrafik aufrufen und öffnen ->"Ok".

• Mauszeiger auf den gewünschten Hintergrund einer HTML-Seite einstellen.
• Rechte Maustaste anklicken ->"Hintergrund speichern unter" -> Der Dateiname erscheint. -> Speichern im gewünschten Verzeichnis.

• http://home.netscape.com/assist/net_sites/bg/backgrounds.html
• http:/www.meat.com/textures/textures.html
• http://www.everyicon.com/backgrounds/default.html
• http://the_tech.mit.edu/KPT/bgs.html
• http://www.vnet.com/users/deee/backgrnd.html

• Die Farbwahl muß zur Aussage passen.
• Wählen Sie harmonische Farbkombinationen.
• Arbeiten Sie mit Kontrasten!
• Hell-Dunkel-Kontraste
• Farbkontraste
• Schatten verstärken die Kontrastwirkung.

Achten Sie auf eine ausgewogene Seitenaufteilung. Als ausgewogen gilt immer noch der Goldene Schnitt.

• Aufteilung der Seiten und der Bilder im Verhältnis 3 : 5 : 8. 
• Auch Leerräume können als Gestaltungsmittel eingesetzt werden.

• Gestaltungsaspekte
• Dr. Web und Know-how für Webworker
• Screen Design  unter ergonomischen Gesichtspunkten:
• http://www.sozialnetz.de/ergo-online/ergo_frame1.htm

 
• Goldene Regeln für schlechtes HTML: 
  http://www.karzauninkat.com/Goldhtml