Abstand
Home Gestaltung Nachhaltigkeit Lernszenarien Kommunikation & Kooperation Evaluation & Feedback Content-Design

Typografie

Im Netz sind typographische Freiheiten sehr stark eingeschränkt. Es gibt trotzdem und deswegen einiges zu beachten.

In Lexika sind unter dem Begriff Typografie, der sich aus dem Griechischen als "Schreiben mit Drucktypen" übersetzen läßt, Definitionen wie "Buchdruckkunst mit beweglichen Lettern", "Gestaltung des Schriftsatzes" oder "ästhetische Formgebung eines Druckerzeugnisses" zu finden. Zwei zentrale Aufgaben der Typografie sind die Vermittlung schriftlicher Informationen und das Formen eines gut lesbaren, zweckmäsig gestalteten Kommunikationsmittels.

Der Druck mit beweglichen Lettern geht auf Johannes Gutenberg (1400 - 1468) zurück. Der technische Vorläufer war dabei das Stempeln von Schriftzeichen, das ästhetische Vorbild die mittelalterlichen Handschriften.

Das Lesen von gedruckten Texten fällt uns vergleichsweise leicht. Und dies hat nicht zuletzt mit der langen Tradition von Textdesign im Printbereich zu tun. Im Screendesign gibt es eine solche Tradition nicht, und im Netz sind lange Texte in aller Regel nahezu unlesbar. Dies liegt von allem an der geringen Auflösung des Monitor im Vergleich zu einem gedruckten Dokument und an der mangelnden Qualität der Bildschirme. Daher ist man häufig dazu übergegangen, lange Texte als PDF-Dokument zur Verfügung zu stellen, so dass Benutzer sich die Texte unkompliziert ausdrucken können. So kann man sich auf die Erkenntnisse der Textgestaltung für gedruckte Texte berufen. Wie aber können wir die Lesbarkeit von Texten ,die auf dem Bildschirm gelesen werden sollen, optimieren?

Unter Lesbarkeit versteht man die Geschwindigkeit, mit der sich das genaue Aufnehmen des Inhaltes ohne besonderes Ermüden vollzieht.

Die wichtigsten Parameter sind hierbei:

  • Schriftgröße
  • Zeilenlänge (60 bis 80 Zeichen)
  • Zeilenabstand (in Relation zum Schriftgrad 1 - 1 1/2)
  • Linksbündiger Flattersatz
  • Verwendung von speziellen Bildschirmschriftarten wie Verdana oder Georgia, die auf die Verwendung in einem Pixelraster hin optimiert wurden
  • Serifenschriften unter 16 p sollten am Bildschirm vermieden werden

Neben der Gestaltung der Schriften selbst steht bei der traditionellen Typografie die harmoische Anordnung der Schrift auf der Seite im Mittelpunkt. Hierbei richtet sich das Verhältnis der Elemente einer Seite (Seitenränder, Spaltenbreite, etc) meist nach bestimmten Proportionen, wie etwa dem Goldenen Schnitt. Diese Herangehensweise ist jedoch bei der Bildschirmtypografie - insbesondere im Web - nicht zuletzt wegen der verschiedenen Monitorgrößen der Benutzer kaum oder nur in Ansätzen umsetzbar.

Da HTML bekanntlich eine Textauszeichnungssprache ist, deren Grundidee in der logisch-strukturellen Auszeichnung von Texten besteht, ist eine Kontrolle der Textgestaltung mit ihren Mitteln nur in bescheidenem Ausmaß möglich. Hierfür wurden HTML die Cascading Style Sheets (CSS) zur Seite gestellt, die es erlauben, das Erscheinungsbild von Texten auf dem Bildschirm genau festzulegen. Es lassen sich zu jedem HTML-Element eine Vielzahl vom Parametern für dessen Darstellung und Positionierung angeben. Leider ist die Umsetzung der CSS-Spezifikationen selbst in den verschiedenen Browserversionen noch sehr lückenhaft und fehlerbehaftet. Daher verbringen Entwickler momentan beim praktischen Einsatz von CSS einen großen Teil der Arbeit noch damit, ihre Stylesheets an die Unzulänglichkeiten der gängigen Browserversionen anzupassen.

Einige Hinweise zur typographischen Fragen:

Schriftart: Eine Möglichkeit die Schriftart festzulegen ist das Font-Tag. Die Verwendung des Font-Tags wird allerdings vom W3C nicht mehr empfohlen. Daher ist die Schriftformatierung mit Hilfe von CSS um so dringender zu raten. Zu beachten ist, dass die verwendetet Schriftart auf dem Rechner des Benutzers installiert sein muss. Somit ist der Webdesigner auf wenige Schriften, die auf allen Plattformen verfügbar sind und zum Standard gehören, festgelegt. Mit Hilfe voc CSS können mehrere Schriftarten angegeben werden, deren Vorhandensein in der Reihenfolge ihrer Angabe geprüft wird. Für die meisten Standardschriften auf dem Mac gibt es ein äquivalent auf dem PC.

Schriftgrösse: Zunächst muss eine Entscheidung darüber getroffen werden, ob eine absolute oder relative Festlegung der Schriftgrösse gewollt ist. Bei einer absoluten Festlegung kann der Benutzer die Schriftgrösse nicht mit Hilfe der Browserfunktionen verändern. PCs und Macintosh-Rechner verwenden unterschiedliche Auflösungen zur Darstellung von Schriften. Der PC arbeitet mit dem WYSIWYG-Prinzip, d.h. ein Inch soll auf dem Bildschrirm tatsächlich als Inch dargestellt werden. Bei der üblichen Verwendung von 800x600 Pixeln auf einem 15"-Monitor folgt, dass Windows ein Inch als 96 Pixel darstellt. Mac-Rechner dagegen versuchen eine direkte Korrelation zwischen Pixelhöhe und Punktgrösse der Schrift herzustellen. Daher hat ein Inch auf dem Mac nur 72 Pixel. Der Effekt ist, dass die Schriften auf den unterschiedlichen Plattformen in unterschiedlicher Grösse dargestellt werden. Der Unterschied ist grösser, je geringer die Auflösung des Monitors ist. Zur Information: 1 Punkt = 0,376065 mm.

Fettdruck: ist in der Regel nicht für mehr als ein oder zwei Zeilen zu verwenden, sondern meist nur für einzelne Wörter oder Wortgruppen. Benutze fette Schrift und zu rufen oder zu schreien, und benutze sie nur für Wörter, die auch eine Bedeutung tragen. Außerdem ist eine Verwendung für Überschriften oft sinnvoll.

Kursivdruck: wird häufig für Zitate verwendet. Oder aber für Wörter, die geflüstert betont werden sollen, die neu sind oder durch den Kontext ihrer Verwendung definiert werden sollen. Grundsätzlich ist Gebrauch in HTML deshalb schwierig, weil kursive Schriften durch das Verlassen des Pixelrasters zackig und pixelig dargestellt werden, was die Lesbarkeit von längeren Textpassagen erschwert.

Unterstreichung: ist die Kursivschrift des armen Mannes. In HTML muss man mit Unterstreichungen deshalb vorsichtig sein, weil sämtliche Browser auf diese Weise Hyperlinks kennzeichnen.

Einzüge: sind in HTML nicht vorgesehen. Wer einen neuen Absatz mit einem Einzug versehen möchte kann hierfür z.B. ein leeres Transparentes GIF oder mehrere "nonbreakingspace" einsetzen. Mit Hilfe von Stylesheets lassen sich ebenfalls Einzüge realisieren.

S p e r r u n g: von Wörtern ist vor allem ein ästhetisches Instrument. Gesperrte Schrift ist schwer lesbar, kann aber unter bestimmten Umständen recht ansprechend sein.

Graphische Schrift erlaubt natürlich eine maximale Freiheit in der Verwendung von Schriftarten und deren Formgebung. Man geht dabei aber das Risiko ein, dass User, welche die Anzeige von Bildern abgeschaltet haben, den Text nicht lesen können. Daher ist unbedingt auf die Verwendung von alt-Texten zu achten. Außerdem sind die Ladezeiten hoch.


Literatur:

Bollwage, M. (2001): Typographie kompakt. Vom richtigen Umgang mit Schrift am Computer. Berlin: Springer.
Das Buch liefert einen guten Überblicküber typographische Aspekte insbesondere im Berech des Screendesigns.
Kazaeli, C. D. (1998): Crashkurs Typo und Layout. Vom Zeilenfall zum Screendesign. Reinbek: Rohwolt.
Eine gute Einführung in die Typographie unter besonderer Berücksichtigung der digitalen Medien.