Typographie im Web

Typographie im Web – darauf sollten Sie achten

Gute Typografie basiert unabhängig vom Ausgabemedium auf vielen Faktoren. So können Sie zum Beispiel Erfahrungen mit Laufweite und Zeilenabstand problemlos vom Print- auf das Webdesign übertragen und beides komfortabel über CSS (Cascading Style Sheets) steuern. Trotzdem bringt das Web in anderen Bereichen einige Besonderheiten mit sich, die Sie beachten sollten.

Gute Lesbarkeit auf allen Browsern

Eine Kontrolle über die für eine gute Lesbarkeit sehr wichtige Zeilenlänge ist nicht ohne weiteres möglich. Abhängig davon, ob der Browser auf einem Smartphone oder einem 27“ Bildschirm läuft, stehen unterschiedliche Flächen und Formate zur Verfügung. Moderne, aufwändige Gestaltungen reagieren mit einem von der Browserbreite abhängigen Layout auf dieses Problem und wechseln zum Beispiel von einer einspaltigen zur zwei- oder dreispaltigen Aufteilung. Weniger aufwändig, aber auch unflexibler, ist das Arbeiten mit einer festen Seitenbreite, die nicht mehr vom Browserfenster abhängig ist. Kontrollieren Sie auf jeden Fall, wie Ihre Webgestaltung auf eine Größenänderung des Browsers reagiert, um unleserlich lange Zeilen zu vermeiden.

Textgröße im Web

Noch schwieriger ist die Kontrolle der Textgröße im Web. In letzter Konsequenz können Sie nur angeben, in welchem Größenverhältnis die Texte zueinander stehen, da der Benutzer die Größendarstellung von Schrift im Browser ändern kann. Eine browserübergreifende Möglichkeit, diese Funktion zu deaktivieren, gibt es nicht. Sie müssen also beachten, dass Ihre Gestaltung Größenänderungen im Text in einem gewissen Rahmen toleriert.

Die Wahl der richtigen Schriften

Bei einem der wichtigsten Bereiche der Typografie, der richtigen Schriftauswahl, war man im Web lange Zeit auf wenige Schriften eingeschränkt. Mit dem Aufkommen von Webfonts, die inzwischen auch direkt bei Linotype lizenziert werden können, hat sich die Situation grundlegend verbessert. Allerdings stellt die niedrige Auflösung der meisten Bildschirme hohe Anforderungen an die Schriften. Sehr dünne Linien, kleine Verzierungen und verspielte Details können schnell verloren gehen. Achten Sie also darauf, detailreiche Schriften in ausreichender Größe zu setzen. Nur so kann ein typografischer Schatz seine volle Wirkung entfalten und wird für den Betrachter nicht zu einer Qual.
Nicht vergessen sollten sie auch, dass Schriften unterschiedlich gut für die Darstellung am Bildschirm optimiert sind. Mäßig optimierte Schriften wirken deswegen gerade in kleinen Schriftgraden auf dem Bildschirm häufig etwas fleckig. Benutzen Sie deswegen gerade für längere Texte Schriften, die über ein gutes Hinting verfügen. Die eText-Fonts von Monotype sind mit hohem Aufwand für die Bildschirmdarstellung optimiert und weisen ein extrem gutes Hinting auf. Wenn Sie diese Schriften als Webfonts benutzen, sind Sie gerade im Textbereich auf der sicheren Seite.

Die richtige Kombination von Headline- und Textschriften

Solange Sie die Darstellungsqualität auf dem Bildschirm im Blick behalten, eröffnen Ihnen Webfonts ganz neue typografische Möglichkeiten. Kombinieren Sie beispielsweise die Glypha Bold für Überschriften mit der Frutiger Regular im Textbereich, um einen bodenständigen und soliden Charakter zu erzeugen. Ein klassischeres und auch etwas edleres Ambiente erreichen Sie mit der Kombination der Futura Bold in den Überschriften und der Baskerville Regular im Text. Und wenn es modern werden soll, nehmen Sie doch die Neo Sans Medium für die Headline und die ITC Officina Sans Book für den Text.

Einsatz von Tabellenziffern

Auch im Bereich der Mikrotypografie können Sie mit Webfonts punkten. Achten Sie zum Beispiel bei großen Zahlenwerken wie Tabellen darauf, Schriften zu verwenden, deren Zahlen auch in kleinen Graden gut zu unterscheiden sind. Hier bieten sich zum Beispiel die Vialog an oder die Neue Frutiger 1450. Und nicht zuletzt können Sie die für den Tabellensatz ausgerichteten Ziffern benutzen, um perfekt untereinander stehende Zahlen zu gestalten – in der Regel sind alle Schriften der Linotype- und Monotype-Library mit Tabellenziffern und mit proportionalen Ziffern ausgestattet.