Was bei der Textgestaltung einer Website beachtet werden muss.

Was bei der Textgestaltung einer Website beachtet werden muss.

 

Typografie kann die inhaltliche Aussage des Textes visuell transportieren und zusätzlich die gewünschten Stimmungen vermitteln.

Dank der Webfonts sind die Möglichkeiten in den vergangenen Jahren enorm gestiegen. Ähnlich wie im Print-Design stehen unzählige Schriftarten zur Verfügung. Wer eine zeitgemäße typografische Website gestalten will, muss nicht mehr auf „Open Sans“ als Schriftart zurückgreifen – typografische Gestaltung kann so viel mehr. Um das umzusetzen, muss niemand ein ausgebildeter Grafik-Designer sein. Denn es gibt ein paar Richtlinien sowie jede Menge Websites und Tutorials, die Hilfe und Unterstützung bei dieser Aufgabe bieten.

Zeitgemäße Web-Typografie bedeutet vor allem eins: wichtige Gestaltungsregeln zu kennen. Auch technische Möglichkeiten sowie aktuelle Design-Trends und -Entwicklungen sollten bei der Wahl der Typografie eine Rolle spielen. Manchmal kann natürlich auch das bewusste Brechen von Regeln die richtige Strategie darstellen. Im Folgenden die wichtigsten Tipps und Anhaltspunkte.

Typografie schafft Hierarchie.
Das klingt erst einmal banal für den Fachmann, ist aber eine der grundlegenden Bedeutungen von Web- und Typografie-Design. Denn damit lässt sich Elementen eine visuelle Bedeutung zuweisen, die der inhaltlichen Bedeutung entspricht. Am einfachsten geht das durch Größenunterschiede. Je größer ein Element ist, umso bedeutsamer ist es. Eine Überschrift ist also größer als der Fließtext. Tipp: Zuerst die Größe des Fließtextes – im HTML sind das die Absätze, also das p-Element – festlegen und dann nach und nach Schriftgrößen und Aussehen der weiteren Elemente gestalten.

Schwarz auf Weiß,
wie man aus es dem Print-Bereich kennt, hat sich auch im Webdesign bewährt. Für eine edlere Anmutung wird auch gerne ein mittlerer Grauton gewählt. Beides ist jedoch nicht wirklich sinnvoll, denn der Kontrast von schwarzer Textfarbe (#000) auf weißem Hintergrund (#fff) ist sehr hart und für das Auge eher unangenehm. Designer setzen daher besser auf einen dunklen Grauton als Textfarbe oder verdunkeln den Hintergrund leicht. Sie wählen also kein reines Weiß, sondern einen sehr blassen Farbton.

Zeilenlänge
Zu einer der am meisten missachteten Typografie-Gestaltungsmöglichkeiten zählt die Zeilenlänge. Viele Designer machen sich um alles Mögliche Gedanken – Farbe, Größe, Schriftart –, aber nicht über die Breite der Textspalte. Das führt in der Folge dazu, dass sich Texte über die volle Inhaltsbreite erstrecken – was oft viel zu breit ist. Das Auge findet dann schwer Halt in der Zeile und schlecht den Anfang der nächsten. Das unterbricht den Lesefluss unnötig.

Zeilenabstand
Zu kleine Zeilenabstände wirken negativ auf die Lesbarkeit – wenn sie denn überhaupt definiert wurden. Als Faustregel lässt sich sagen: den Zeilenabstand immer etwas höher wählen. Designer müssen hier gar keine festen Pixelwerte eingeben. Ganz allgemein ist in CSS ein line-height-Wert zwischen 1.4 bis 1.8 hilfreich, aber auch das ist von der Schriftgröße und der Schriftart abhängig. Grundsätzlich gilt: Je länger die Zeile ist, umso größer sollte der Zeilenabstand und je größer der Text, umso kleiner kann der Zeilenabstand sein.

Kommentare sind geschlossen.