Yale C/AIM Web Style Guide

Überblick

Page Design

Einführung

Grafikgestaltung 100

Ausgewogenheit der Seiten

Design-Gitternetze für Seiten

Sicherheitsbereiche für Grafiken

Kopfzeilen

Typographie I

Typographie II

Schriftarten

Einheitlichkeit

Grundlegendes zu Tabellen

Länge der Seiten

Plattform-
übergreifende Fragen


Frames

Komplexe Tabellen

Visueller Kontrast und Seitengestaltung
Die Typografie hängt vom visuellen Kontrast zwischen den verwendeten Schriften sowie vom Kontrast zwischen den Textblöcken und dem sie umgebenden leeren Raum ab. Nichts spricht Auge und Gehirn des Betrachters wirkungsvoller an als starke Kontraste und charakteristische Muster. Diese Merkmale kann man nur dann bieten, wenn man sie sorgfältig bedacht in seine Seiten einbaut. Wenn alles hervorsticht, hebt sich nichts wirklich ab und Sie erwecken den Eindruck, als würden Sie Ihre Leser visuell anbrüllen. Wenn Sie jede Seite mit Text überfrachten, haben die Leser das Gefühl, eine graue Wand vor sich zu haben, und ihr Gehirn wird den mangelnden visuellen Kontrast sofort zurückweisen. Alles einheitlich größer zu machen, bringt hier überhaupt nichts. Sogar fett gedruckte Buchstaben werden schnell monoton, denn wenn alles fett ist, hebt sich letzten Endes nichts ab.
Gehen Sie mit den großen HTML-Überschriften sparsam um. Eine Alternative zu übermäßig fetten HTML-Überschriften ist die Verwendung der physischen Style Controls von HTML, mit denen Sie Text fett oder kursiv darstellen können, ohne die Schrift zu vergrößern. Es sollte Ihnen jedoch bewußt sein, daß die Verwendung dieser Art von Typografiesteuerung auch einige Nachteile hat. Die HTML-Heading-Tags (H1, H2 etc.) sind dazu angelegt, wichtige Titel und Subtitel in Ihrem Text zu identifizieren und sollen nur nebenbei den visuellen Eindruck verändern. Wenn Sie die FONT SIZE-Tags (Schriftgröße) in Netscape verwenden und mit physischen Styles wie BOLD arbeiten, werden die automatischen Index- und Textanalyseprogramme Schwierigkeiten haben, Ihre Webdokumente zu analysieren.

Visuelle im Gegensatz zu struktureller Logik
Die Urheber der ursprünglichen HTML-Normen waren Physiker. Sie waren auf der Suche nach einer Standardmethode, um Dokumente mit minimalen Auszeichnungen weiterzugeben, die lediglich darauf abzielten, die logische Struktur der Information offenzulegen. Da sie sich für die visuelle Form des Dokuments nicht besonders interessierten, ist bei den derzeitigen HTML-Implementierungen keine präzise Typografie und Seitenformatierung möglich. Sie ignorierten durch ihre ausschließliche Konzentration auf die strukturelle Logik des HTML-Dokuments die Notwendigkeit einer Visualisierung komplexer Grafik- und Typografiestrukturen.
Die für die Kodifizierung der HTML-Sprache zuständige Normierungsinstitution beginnt nun auf die häufigen Klagen von Grafikdesignern, daß die Heading Tags in Web-Dokumenten oft sperrige, übergroße Titel und Subtitel hervorbringen zu reagieren. Durch Stylesheets und neue Schriftsteuerungs-Tags werden künftige HTML-Versionen es bald möglich machen, genau anzugeben, welche Schriftgrößen die einzelnen Header-Niveaus auf jeder Web-Seite produzieren. Damit kann man dann eine verfeinerte Typografie produzieren können, ohne die erheblichen Vorteile aufzugeben, die die Verwendung der konventionellen HTML-Heading Tags mit sich bringt..

Schriftbild und Lesbarkeit
Wir lesen hauptsächlich, indem wir die Gesamtform der Wörter erkennen und nicht, indem wir jeden einzelnen Buchstaben analysieren und dann aus diesen Buchstaben ein erkennbares Wort zusammenstellen:

Diagram shows distinctive word shapes.

Vermeiden Sie auf jeden Fall nur aus Großbuchstaben bestehende Titel, denn diese sind besonders schwer zu lesen. Aus Großbuchstaben gebildete Wörter erscheinen als monotone Rechtecke, die nur wenige charakteristische Formen bilden, die dem Leser ins Auge fallen können:

Diagram shows lowercase word shapes versus uppercase word shapes.

Die Lesbarkeit hängt vom oberen Rand der Wörter ab
Ob Sie sich für Groß- oder Kleinbuchstaben entscheiden, kann also erhebliche Auswirkungen auf die Lesbarkeit haben. Allgemein gilt, daß Sie für Ihre Überschriften und Subtitel Downstyle verwenden sollten. Dabei werden nur das erste Wort und Eigennamen groß geschrieben. Downstyle-Titel sind besser lesbar, weil wir beim Lesen vor allem den oberen Rand der Wörter abtasten:

Example shows a sentence where only the tops of letters are visible.

Beachten Sie, um wieviel schwieriger es ist, die untere Hälfte desselben Satzes zu lesen:

Example shows the bottom half of the preceding example sentence.

Wenn Sie in Ihren Überschriften den ersten Buchstaben jedes Wortes groß schreiben, unterbrechen Sie das Abtasten der Wortformen durch den Leser:

Example shows the disadvantages of headlines with initial capitlas.

Referenzen

Bringhurst, R. 1992. The elements of typographic style. Washington: Hartley and Marks.

Siegel, D. 1996. Creating killer web sites. Indianapolis: Hayden Books.

www.killersites.com

Spiekermann, E., and E. M. Ginger. 1993. Stop stealing sheep & find out how type works. Mountain View, CA: Adobe Press.

typoGRAPHIC  A concise, elegant essay on typography and letterforms from razorfish/bluedot.
Copyright 1997 P. Lynch and S. Horton,
   all rights reserved. Yale University   Revised January 1997.