Webdesign | Samstag, 26. Juli 2003

Web-Typographie

Was mich immer wieder erstaunt: ausgerechnet die Leute, die einem was von XHTML und CSS erzählen können, von Usability, barrierefreiem Webdesign und was da sonst an Buzzwords gerade so umher schwirrt, haben in den meisten Fällen leider wenig Ahnung von Typographie.

Das fängt damit an, dass auf ihren Websites die Textspalten häufig in der Breite an das Browserfenster angepasst werden. Wenn also jemand auf seinem Cinema Display das Browserfenster maximal vergrößert hat (doch, das gibt’s, habe ich schon gesehen), liest er zwei- bis dreihundert Zeichen pro Textzeile – wenn er es denn unfallfrei bis zum Ende der Zeile schafft. Dass das mit Ergonomie wenig zu tun hat, sollte eigentlich jedem klar sein. Auch der Fachhochschule Stuttgart, die unter der Überschrift »Texte auf dem Bildschirm« zwar richtig schreibt:

Zeilenlänge: 60 bis 80 Zeichen pro Zeile sind empfehlenswert

sich aber interessanterweise selbst nicht dran hält.

Nächster Fehler: align="justify" sprich: Blocksatz. Was in einer Tageszeitung möglicherweise noch Sinn macht, ist im Browser völlig fehl am Platz. Dort gibt es nämlich keine automatische Silbentrennung, und deshalb sieht man dann so etwas:

Diese Wortzwischenräume, die entstehen, wenn ein extrasuperdoppelthyperüberlanges Wort im Blocksatz nicht mehr in die vorangegangene Zeile passt, sollte man einfach vermeiden, sie sind nicht nur hässlich, sondern hemmen auch den Lesefluss.

Auf die Schriftgrößen mancher Sites will ich nicht weiter eingehen, da man in jedem gängigen Browser eine Mindestgröße vorgeben kann, auch nicht auf den Zeilenabstand (den ich auch schon auf 500% gesetzt gesehen habe) und auch nicht auf falsche Anführungszeichen oder Bindestriche.

Aber generell stünde es einigen Websites gut zu Gesicht, wenn zumindest die wesentlichsten Grundsätze der Typographie mit ins Webdesign einfließen würden. Usability hört nämlich bei Typographie nicht auf, sondern genau da fängt sie an.

Kommentare:

Bei den Kommentaren handelt es sich um fremde Inhalte, die sich „esse est percipi“ nicht zueigen macht. Verantwortlich für den Inhalt eines Kommentars ist der jeweilige Verfasser.

mados Samstag, 2. August 2003, 23:21 Uhr

Das ist alles richtig und empfehlenswert, eine grundsätzliche Frage stellt sich jedoch: War nicht immer die Rede davon, dass sich gute Layouts an die Breite des Browserfensters anpassen sollten? Bei fixen Breiten – wie hier – habe ich keine Chance, das Layout auf meine Lesegewohnheiten anzupassen. Es läßt sich schlechter drucken und zoomen (im IE geht das hier übrigens gar nicht). Was ist nun richtig(er)?

Michael Sonntag, 3. August 2003, 09:32 Uhr

Die drei verbreitetsten Methoden sind ja: feste Breite linksbündig, feste Breite zentriert und variable Breite.
Letztere halte ich, zumindest was Lesegewohnheit bzw. -freundlichkeit angeht, für unergonomisch; so in etwa, als ob sich die Spaltenbreite einer Zeitung nach der Länge der Arme richtet, die sie halten.
Warum viele CSS basierte feste-Breite-Layouts linksbündig sind, ist auch klar: IE kann die entsprechenden (Standard!) Attribute nicht interpretieren und ohne Javascript klebt das Layout in den diversen IE Versionen immer am linken Rand – weswegen viele wahrscheinlich von vorneherein linksbündig layouten.
Das Druckproblem lässt sich durch das Anlegen eines extra Stylesheets (media=print, siehe auch Media Types) sehr elegant lösen, das Zoomproblem durch das Anlegen eines Alternativ-Stylesheets.
Fazit: Wenn man für Ausdrucke ein extra Stylesheet anlegt (das werde ich hier demnächst auch mal tun), kann man variable Layouts und damit variable Zeilenlängen (besser gesagt: Zeilenlängen von mehr als 80 Zeichen) vermeiden.

mados Montag, 4. August 2003, 17:36 Uhr

Ich entscheide mich für die vierte Methode: max-width:65ex; (meines Erachtens die einzig wirklich sinnvolle und standardkonforme Lösung). Das versteht der IE zwar nicht, aber das ist mir egal. Es ist unabhängig davon ja jederzeit möglich, einfach das Browserfenster zu verkleinern. Der Aufwand, das Ganze auf anderen Wegen IE-tauglich zu machen, steht meiner Meinung nach in keinem Verhältnis zum Nutzen. Wäre das ein akzeptabler Kompromiss?

Michael Montag, 4. August 2003, 20:35 Uhr

Das wäre sogar ideal, wenn nicht eben IE auch bei min- und max-width mal wieder ausscheren würde.

Die allermeisten nehmen nur unterbewusst wahr, dass mit zu langen Textzeilen was nicht stimmt – im schlechtesten Fall beziehen sie das sogar auf die Qualität des Inhalts oder gleich der ganzen Website. Auf die Idee, das Browserfenster zu verkleinern, kommen die meisten erst gar nicht, schon gar nicht die, die Fullscreenfenster vom Betriebsystem her gewohnt sind.

Da man aber möglichst niedrige Kommunikationshürden aufbauen sollte (schließlich will ich ja gelesen werden), empfiehlt es sich, auch für IE Benutzer die Zeilenlänge zu begrenzen.

dos Montag, 29. Oktober 2007, 11:53 Uhr

Ein hochweißer Hintergrund hemmt meiner Meinung nach ebenfalls den Lesefluss. Auf Röhrenmonitoren macht sich das nicht so sehr bemerkbar, auf TFT aber schon.