November 26, 2009

Gepixelte weiße Schriftzeichen „A, b, c“ vor einem texturierten blauen Hintergrund.

Stilvolle Typographie im Webdesign

Typographie ist mehr als Schriftsatz

Typographie gehört eigentlich mit zum Bereich Layout. Typographie ist aber nicht nur die reine Schriftgestaltung. Man unterscheidet zwischen Makro- und Mikrotypographie. Makrotypographie bezeichnet daß, was wir umgangssprachlich als Layout bezeichnen. Also die Einteilung des Seitenformats, Satzspiegel usw.

Erst die Mikrotypographie bezeichnet die klassische Schriftgestaltung. Viele Menschen meinen meist nur den Bereich der Mikrotypographie, wenn von Typographie die Rede ist.
Beim Einsatz von Typographie geht es wieder darum die zu übermittelnden Informationen oder die „Botschaft“ immer feiner zu untergliedern und dadurch noch besser lesbar, findbar und intuitiv greifbar zu machen.

leseweite

Das obere Beispiel lässt sich gut lesen. Der Kontrast bleibt gewahrt, der Zeilenabstand sorgt für gute Lesbarkeit. Das Lesen im Internet ist nicht so leicht und die wenigsten Menschen haben die Zeit dafür. Deswegen sollte man das Auffinden der für Sie relevanten Informationen immer so einfach wie möglich gestalten.

Gliederung von Web-Text

Gliedern Sie die Informationen Ihrer Texte in inhaltlich zusammenhängende Sinn-Abschnitte und heben Sie diese thematisch getrennten Blöcke voneinander ab.
Falls es das Thema hergibt bauen Sie Aufzählungslisten in Ihr Layout mit ein. Nichts wird im Internet so gerne gelesen wie Listen.

typographie_webdesign

Die Überschrift im Webdesign

Eigentlich selbsterklärend. Trotzdem wird immer wieder mißachtet, daß Texte sinnvoll mit Zwischenüberschriften gegliedert werden sollten. Der Website-Besucher überfliegt den Text wahrscheinlich ersteinmal. Durch Zwischenüberschriften hat man hier die Möglichkeit dem Leser Anhaltspunkte zu bieten. Gut getextete Headlines können vielleicht seine Aufmerksamkeit gewinnen, so daß er den folgenden Absatz liest oder mindestens etwas genauer scannt.

Bei einem Text-Layout fallen einem Leser in der Regel zunächst die Headlines auf. Sie sollten gut gemacht sein und sich grafisch vom Hintergrund und vom übrigen Text deutlich abheben. (z.B. durch Farbe, Größe, Textauszeichnung (Fett, kursiv, Condensed), Laufweite, Zeilenabstand, Schatten, Licht, usw.), Ein mit Überschriften und Zwischenüberschriften optimiertes Dokument ist gut zu überblicken und verführt zum weiterlesen. Auch Suchmaschinen-Robots mögen Dokumente die mit den unterschiedlichen Überschriftauszeichnungen (<H1>,<H2>,<H3> usw…) untergegliedert sind.

Robots mögen untergliederten Text.

Die richtige Schriftart

Im Webdesign gibt es für eine Schrift spezielle Anforderungen. Natürlich muß Sie nicht nur thematisch passen, sondern am Bildschirm gut lesbar sein. Bei kleinen Textgrößen empfiehlt sich der Verzicht auf Serifen. Es gibt einen kleinen Konsens aus Systemschriftarten, die die meisten Leute installiert haben. Diese Schriften nennen sich „web-safe“ Schriftarten, weil jeder Computer die Schriftart annähernd gleich anzeigen kann.

Seit CSS3 besteht allerdings die Möglichkeit eigene Schriften zu hinterlegen, die der Browser nachlädt. Ein hilfreicher Service ist beispielsweise Typekit. Der Anbieter hat Hunderte verschiedenster Schriftarten auf dem Server hinterlegt. Eine Zeile HTML Code im eigenen Webdesign reicht aus um darauf zurückzugreifen. Möchte man den Service auf mehr als einer Website verwenden muß man eine jährliche Gebühr zahlen.

Typekit bietet hunderte Schriften "on the go"

http://typekit.com/

Über den Autoren

Stephan Bender

Meine Aufgabe besteht darin Qualität zu visualisieren und die Kommunikation von Menschen und Marken zu verbessern, damit die Botschaften so geschärft werden, dass sie bei der Zielgruppe einen optimalen Eindruck hinterlassen kann.

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}

Weitere Artikel:

Subscribe now to get the latest updates!