Start Die gefühlte Lesbarkeit

Die gefühlte Lesbarkeit

SCHRIFTGRÖßEN

Schriftgrößen im Web: Kann man die überhaupt messen?

Man kann trefflich streiten, ob es überhaupt Sinn ergibt, “optimale” Schriftgrößen für Webseiten zu ermitteln. Schließlich sind in puncto Letter-Höhe grundsätzlich die Webnutzer Herren des Verfahrens: Da kann Frau Webdesignerin noch so eindringlich “12 Punkt” als Schriftgröße anweisen im CSS-Bereich – der Browser gehorcht in aller Regel nur bei Schriftgröße “mittel” wie aufgetragen. Mit einem ebenso schlichten wie beherzten “Steuerung plus” aber enthebt jeder Normal-Nutzer die Gestalterin ihres Einflusses und setzt die Schriftgröße rauf. Anweisung im Quellcode hin oder her.

Warum ich trotzdem aufs Thema “Schriftgröße” drängte in der Entstehungsphase der Studie? Ich kenne zwar keine Statistiken zu diesem Thema, aber ich vermute fest, dass eine übergroße Mehrheit der Web-Nutzer entweder gar nicht weiß, dass sie zur eigenverantwortlichen Größen-Manipulation imstande sind – oder, dass sie um ihre Macht durchaus wissen, aber in der überwältigenden Mehrheit brav bei der Standard-Einstellung bleiben, aus welchen Gründen auch immer.

Wenn man diese These als stichhaltig unterstellt, hat es schon Sinn, sich mit dem Komplex “Größe im Web” zu befassen. Zumal die bereits erwähnten Print-Studien aus dem vergangenen Jahrhundert hier die wichtigste Stellschraube der Lesbarkeit ausmachten: eben bei der Schriftgröße.

12 Punkt sind selten 12 Punkt

Bevor wir allerdings messen konnten, mussten wir die Schriftarten erst einmal auf Vergleichbarkeit trimmen. Es macht schließlich einen Unterschied, ob man einer “Verdana” eine Schriftgröße von 12 Pixeln verpasst oder einer “Times”. Denn diese 12 Pixel bezeichnen entgegen landläufiger Meinung nicht, wie hoch die Großbuchstaben auf dem Bildschirm aufscheinen sollen. Es ist genausowenig eine Angabe darüber, wie groß der Abstand zwischen großem “A” oben und kleinem “g” unten ist. Es bezeichnet nur die Gesamthöhe des (gedachten) Kegels, auf den ein Schriftgestalter seine Lettern aufgebracht hat.

Übertragen gesagt: Ich kann auf ein A4-Blatt ein “B” zeichnen, das die ganze Höhe der Seite ausnutzt – oder ein “B”, das nur halb so hoch ist wie das Blatt und viel Luft nach oben und unten lässt. In der Logik des typografischen Maßsystems wären aber beide Buchstaben “eine A4-Seite hoch”. Dass die Buchstaben an sich ganz unterschiedliche vertikale Ausdehnungen haben, spielt keine Rolle.

Im Vergleich: Mittellängen statt nummerischer Größen

Wir haben im Experiment deswegen nicht “nummerische” Schriftgrößen verglichen, sondern für jede Schrift in jeder Größe die Höhe des kleinen “x” bestimmt – die Mittelhöhen also, die nach verbreiteter Meinung entscheidend sind für die so genannte “optische Größe” einer Schriftanordnung.

Die eindeutige x-Höhe “7 Pixel” wurde zunächst für jede Schriftart als “Schrftgröße 2” definiert. Von da aus wurde in jeweils zwei Abstufungen nach oben und unten immer ein Pixel nummerische Schriftgröße hinzugezählt oder abgezogen. Was bei dieser Detail-Arbeit herauskam, zeigt die folgende Abbildung.

Ergebnis Schriftgrößen: Ein Pils braucht 7 Minuten, ein “x” braucht 7 Pixel

Richtig weit muss ich an dieser Stelle gar nicht ausholen, denn die Ergebnisse der Größenmessung waren ebenso schlicht wie klar. Alle Texte in Schriftanordnungen mit einer x-Höhe von weniger als 7 Pixeln wurden laut Statistik erheblich, statistisch signifikant langsamer gelesen als Texte in größerer Ausprägung. In der Varianzanalyse erwies sich der Faktor “Größe” als hoch signifikant – die Schriftgröße ist also einer, wenn nicht der “Haupteinfluss” auf die Lesbarkeit schlechthin.

Dabei scheint die Schriftgröße 2 über fast alle Schriftarten hinweg Minimum und Optimum zugleich: weitere Vergrößerungen beschleunigten die Leseprozesse in den seltensten Fällen.

Auch diese Ergebnisse decken sich übrigens im wesentlichen mit denen anderer Untersuchungen zur Schriftgröße – unter anderem in der Feststellung, dass Schrift wohl durchaus zu klein sein ausfallen kann im Sinne der Lesbarkeit, dass aber ab einem bestimmten Level eine Vergrößerung der Schrift keine besonderen Effekte auf die Leseleistung mehr zeitigt (z.B. Bernard/Mills; Bernard et al.; Liebig).

Zwischenfazit Schriftgrößen: Trau keinem unter 7 Pixeln

In Lesetexten sollten Schriften so definiert sein, dass das kleine “x” mindestens 7 Pixel hoch ist. Da dies oft auf mehrere Größenvarianten einer Schriftart zutrifft, sollte man nicht unbedingt auf die kleinste Variante zugegreifen, auf die diese Eigenschaft noch zutrifft. Eine Erhöhung auf 8 Pixel bringt aber offenbar kaum Verbesserungen. Per Screenshot sind die Mittellängen der jeweiligen Schriftart der Wahl leicht ermittelbar.

Zur Erinnerung: auf Navigationsleisten-Schriften und Headlines ist diese Erkenntnis eventuell nur bedingt anwendbar. Es macht sicherlich einen Unterschied, ob man nur das Wörtchen “Kontakt” zu lesen hat – oder einen 110-Wort-Text. Diese Aussage ist weder bewiesen noch widerlegt – ich persönlich werde aber in Navigationsbereichen weiterhin mit Schriftgrößen experimentieren, die unter der Mittellänge “7″ liegen.

SCHRIFTART UND SCHRIFTGRÖSSE IN KOMBINATION

Wer sich Tabelle 1 genauer anschaut, wird womöglich stutzen. Denn wenn beispielsweise die “Cambria” in 16 Pixel Größe 23,36 Sekunden Lesezeit beanspruchte, die “Constantia” in 11 Pixel Größe aber 26,93 Sekunden – sind dies nicht Differenzen, die eine durchaus eindeutige Aussage nahelegen? Und Konsequenzen?

Die Antwort lautet: jein. Denn nach eingeführten Regeln der Statistik lässt sich durchaus überprüfen, ob die Kombination “Schriftart-Schriftgröße” wirklich bedeutsam war für die Leseleistung. Und da sagt das Statistik-Programm in der Varianzanalyse: diese Kombination von Typo-Faktoren nimmt definitiv keinen “Haupteinfluss” auf die Leseleistung. Qualitätsurteil: eindeutig nicht signifikant.

Die Frage ist, ob wir damit die Tabelle als Ganze gleich in die Rundablage befördern müssen. Ich meine: nein. Denn wenn wir uns hüten, die Ergebnisse als Evangelium zu überhöhen, können wir sie immerhin als Fingerzeige nutzen, als Anregungen und Diskussionsgrundlagen bei der Suche nach geeigneten typografischen Konstellationen.

ZEILENABSTAND

Die ewigen 120 %

Das größte Problem ist immer noch die Standard-Einstellung. Sofern nicht explizit angegeben in Quellcode oder CSS-Datei, setzen die gängigen und marktführenden Browser Schriftanordnungen fast durchweg und quasi als “default” mit einem Zeilenabstand, der etwa 120 % der jeweiligen Schriftgröße entspricht. Nach meinen Erkenntnissen ist das in fast allen denkbaren Fällen zu wenig.

Diese Zeilenabstände wurden verglichen

Soviel war klar: Wenn wir schon die Schriftgrößen auf die Eigenheiten der verschiedenen Schriftgestalten angepasst hatten, mussten wir es bei den Zeilenabständen genauso halten. Wir beschlossen also, auch die Zeilenabstände an die Mittellängen, die x-Höhen der Schriften, zu koppeln. Jede der fünf Schriftgrößen kombinierten wir mit vier verschiedenen Zeilenabständen: der 2,1-fachen x-Höhe, der 2,5-fachen x-Höhe, der 2,9-fachen x-Höhe und der 3,3-fachen x-Höhe. Die 14-Pixel-”Cambria” gab es also mit den Zeilenabständen 15,4 Pixel (gerundet 15, halbe Pixel gibt’s bekanntlich nicht), 17,5 Pixel (gerundet 18), 20,3 Pixel (gerundet 20) und 23,1 Pixel (gerundet 23).

Die Ergebnisse im Detail

Die Varianzanalyse der Daten ergab: der Zeilenabstand ist, wie die Schriftgröße (und anders als die Schriftart), einer der Haupt-Einflussfaktoren auf die Lesbarkeit. Wobei man hier, bevor die Euphorie überbordert, sinnvollerweise die statistische durch eine “praktische” Signifikanz ergänzen sollte (manche nennen letztere auch gesunden Menschenverstand): So erheblich waren die Differenzen zwischen den Durchschüssen dann doch nicht, dass man ihre Unterschiedlichkeit in Verffassungsrang heben müsste. Signifikant hin oder her.

Dennoch, hilfreiche Fingerzeige liefern die Daten: Sie legen nahe, dass der Zeilenabstand mindestens das 2,5-fache der x-Höhe der jeweiligen Schrift betragen sollte. Das wäre, im Falle der 12-Pixel-”Verdana” beispielsweise, erheblich mehr als die Browser-Standardeinstellung von 14 Pixeln – nämlich satte 17 bis 18 Pixel (x-Höhe 7 Pixel mal 2,5 = 17,5 Pixel). Auch zeigte sich: eine weitere Vergrößerung des Zeilenabstands auf das 3-fache der x-Höhe bringt noch marginale Verbesserungen, aber keine bedeutsamen Steigerungen mehr mit sich.

ZEILENBREITE

Das Ergebnis: kein Ergebnis

Es scheint wenig Unwichtigeres zu geben als die Breite der Zeilen. Dieser Befund unserer Studie überraschte niemanden mehr als mich selbst – denn in einem Vorgängerexperiment hatten sich klare Hinweise ergeben, dass Zeilenbreiten unter 40 Anschlägen zu einer gewaltigen Verlangsamung des Lesetempos führen (Liebig). Interessant war, dass die alte Setzerregel “Alphabet mal 2″ in unseren Ergebnissen gar nicht griff: die doppelte Buchstabenanzahl (52 Anschläge) zeitigte gar die schlechtesten Lesezeiten. Aber überbewerten sollte man auch dieses Teilresultat nicht – statistisch gab’s jedenfalls keinerlei Signifikanzen im Messbereich “Zeilenbreite”.

ZEILENBREITE UND ZEILENABSTAND IN KOMBINATION

Eine weitere Setzerregel besagt, dass mit wachsender Zeilenlänge auch der Zeilenabstand großzügiger bemessen werden sollte. Einen Beleg für diese Annahme blieb uns die Datenauswertung schuldig: keine Signifikanz, kein Haupteinfluss.

ANDERE KONSTELLATIONEN

Der Vollständigkeit halber testeten wir auch alle übrigen Zweier-, Dreier- und Vierer-Konstellationen, die sich aus den Daten ergaben, auf ihre statistischen Signifikanzen. Wiederum, ohne Zählbares herauszufinden: Weder die Kombination Schriftart-Zeilenabstand entpuppte sich statistisch als Haupteinfluss noch die Verbindung Schriftgröße-Zeilenbreite – oder irgendeine andere Konstellation.

ZUM SCHLUSS

Betrachten wir die Ergebnisse einmal unter Worst-Case-Annahmen: Wer richtig schlecht lesbare Typografie konstruieren möchte, hat’s ziemlich schwer im Web. Gut, man kann Schriftgrößen unter 11 Pixel definieren, vielleicht noch Kompress-Zeilenabstände vorgeben – dann geht’s mit der Lesbarkeit schon befriedigend bergab. Darüberhinaus allerdings muss man sich schon tüchtig ins Zeug legen, um es der Leserschaft so richtig schwer zu machen.

Anders herum formuliert: Die vermeintlich “harten” typografischen Stellschrauben sind rarer als vermutet. Typografie funktioniert offenbar weit weniger nach Rezept als oft behauptet.

Was ausdrücklich nicht bedeutet, dass Typografie im Web beliebig werden dürfte. Im Gegenteil. “Gute” Typografie beweist sich ganz offensichtlich im gekonnten Umgang mit dem Originärsten: dem schwer erforschbaren Wesen ihrer Schriftgestalt nämlich. Typografie ist weit mehr Emotion als schierer Bedeutungsträger. Gute Typografie unterstreicht den thematischen Kontext, gute Typografie schmeichelt dem Inhalt wie dem Auge, gute Typografie vermittelt Individualität und Wert, Spannung und Seele.

Leider, ich erwähnte es, kann man all diese Faktoren ziemlich schwer messen. Typografie bewegt sich auf Meta-Ebenen, die keine Stoppuhr zu fassen bekommt. Darum, meine Damen und Herren Gestalter: Übernehmen Sie! Das Web hat’s verdient.

-

Der Artikel liegt als PDF zum Download bereit:
Die gefühlte Lesbarkeit | Martin Liebig | PDF 750KB

QuellenBernard, Michael/Mills, Melissa/Peterson, Michelle/Storrer, Kelsey (2001): A Comparison of Popular Online Fonts: Which is Best and When? http://www.surl.org/usabilitynews/32/font.asp” http://www.surl.org/usabilitynews/32/font.aspBernard, Michael/Mills, Melissa (2000): So, What Size and Type of Font Should I Use on My Website? http://www.surl.org/usabilitynews/22/font.asp

Bernard, Michael/Lida, Bonnie/Riley, Shannon/Hackler, Telia/Janzen, Karen (2002): A Comparison of Popular Online Fonts: Which Size and Type is Best? http://www.surl.org/usabilitynews/41/onlinetext.asp

Bernard, Michael/Liao, Corrina/Mills, Melissa (2001): Determining the Best Online Font for Older Adults. http://www.surl.org/usabilitynews/31/fontSR.asp

Boyarski, Dan/Neuwirth, Christine/Forlizzi, Jodi/Harkness Regli, Susan (1998): A Study of Fonts Designed for Screen Display. In: Proceedings of the SIGCHI conference on Human factors in computing systems 1998. S. 87ff. http://portal.acm.org/citation.cfm?id=274644.274658

Hill/Scharff (Hill, Alyson L./Scharff, Lauren F. V. (1997): Readability of Websites With Various Foreground/Background Color Combinations, Font Types and Word Styles. http://www.laurenscharff.com/research/AHNCUR.html

Liebig, Martin (2008): Browser-Typografie. Untersuchungen zur Lesbarkeit von Schrift im World Wide Web. Boizenburg. https://eldorado.tu-dortmund.de/dspace/bitstream/2003/24419/2/dissertation_liebig.pdf

Redelius, Jürgen (1998): Der „digitale” Gutenberg. Dissertation zur Erlangung des Grades eines Doktors der Erziehungswissenschaften der Pädagogischen Hochschule Ludwigsburg. Ludwigsburg

Tullis, Thomas S./Boynton, Jennifer L./Hersh, Harry (1995): Readability of Fonts in the Windows Environment. http://sigchi.org/chi95/Electronic/documnts/intpost/tst_bdy.htm

Weisenmiller, Eric Michael (1999): A Study of the Readability of On-Screen Text. Dissertation, Virginia Polytechnic Institute and State University. Blackburg (Virginia). http://scholar.lib.vt.edu/theses/available/etd-102999-110544/unrestricted/WeisenmillerDissertation.pdf

Seiten  1 2 3

98 Kommentare

1 3 4 5
  1. Danke für den ausführlichen Beitrag, der sich auf eine aussagekräftige Studie bezieht und einen relativ neuen Aspekt, den des Look & Feel einer Schriftart thematisiert.

    Wenn es dann also doch bei Verdana mangels Alternativen bleibt, dann muss das Look & Feel eben über andere Elemente reinkommen. Welche könnten das sein? Schöne Trennergrafiken?

    Dass die drei Seiten recht lang sind, ist mir auch aufgefallen, aber nicht weil es unangenehm gewesen wäre, sondern weil ich immer dachte, ich bin der Einzige, der so lange Seiten macht, lach.

    In welcher Schriftart, Schriftgröße und Zeilenabstand wurde denn der Artikel von Ihnen erstellt? Ich kann es dem Code leider nicht entnehmen. Oder kann mir da jemand anderes helfen? Finde das sehr gelungen.

    Grüße,

    MD

  2. Am meisten wird die lesbarkeit eines textes durch kürzen erhöht, wenn ich mir diese bemerkung erlauben darf, will sagen: weniger wäre mehr gewesen!

  3. Ein sehr schöner Beitrag. Ich denke wie lesbar eine Schrift am Bildschirm “wirkt”, häng auch davon ab wie “abgenutzt” die Schrift ist. Von Zeit zu Zeit ändern sich die Geschmäcker da eine Schrift auch langweilig werden kann, wenn man sie zu oft sieht. Aber gut, dass die Schriftauswahl mittlerweile dank der Webfont-Technologie nicht mehr beschränkt ist.

  4. Ich bin zufällig auf diese Seite gestoßen nachdem gestern die Frage auftauchte, welche Schriftart für einen Blog zu bevorzugen sei. Die Auswahl beim Fragesteller waren Lucida und Arial und ich tendierte eindeutig zu Arial, da hier die Typen proportional besser angeordnet sind.

    Die Lucida, die hier leider zu erwähnen vergessen wurde hat für meine Begriffe eine sehr verbesserungswürdige “Spationierung” der einzelnen Buchstaben. Im Fließtext sieht es bei dieser Schrift immer wieder so aus, als seien einzelne Wortbestandteile gesperrt dargestellt, was sich für mich als störend im Lesefluss erwies – übrigens nicht nur ich habe der Arial den eindeutigen Vorzug gegenüber der Lucida gegeben, sondern die Mehrheit der befragten BloggerInnen.

    Ganz wichtig für die Lesbarkeit ist aber nicht nur die Type bzw. Schriftart, sondern auch der Helldunkelkontrast. Hier werden immer noch gravierende und Leser vergraulende Fehler gemacht.

    Diesen Artikel finde ich so gut, dass ich ihn gleich mit Lesezeichen versehen habe, da ich hierfür bestimmt noch die eine oder andere Empfehlung aussprechen werde.

  5. Super Beittag, leider habe ich ihn erst nach Jahren auf deinem Blog entdeckt… Zwei Sachen, die mich interessieren würden: Warum hört die Zeilenbreite bei gerade mal 80 auf? In Programmierstandards ist es üblich sich auf diese (natürlich schwer mit Fließtext vergleichbar) zu beschränken – es wäre sicher interessant gewesen zu wissen ob es dafür andere gute Gründe gibt. Und als zweiter Punkt: Warum keine Fraktur im Test? So hätte man sicherlich einige Thesen zur Gewöhnung testen können.

  6. Akademische Wahrnehmung. Der Leser entscheidet, ob er liest oder nicht. Nicht der Experimentator. In Bruchteilen einer Sekunde fällt eine Entscheidung und die Website wird verlassen. Oder die Zeitschrift bleibt liegen.

    Kein Unterschied? Kein Wunder. Wenige Pixel lassen lassen fast keine Möglichkeit für Differenzierbarkeit. Der durchschnittliche Bildschirm (vor den hochauflösenden Retina und Co.) ist ein Faxgerät mit ca. 100 DPI, Antialising/Kantenglättung und Subpixelrendering (Cleartype usw) erhöhen die Informationsdichte der Darstellung.

    Die ausgewählten Schriften sind mit großem gestalterischen und technischen Aufwand für die Bildschirmlesbarkeit optimiert. Nur große Firmen können diesen Aufwand bezahlen und mit ihren Betriebssystemen verschenken. Die Testauswahl enthält ausschließlich solche Fonts. Auf mich macht dieser große Test einen naiven Eindruck.

1 3 4 5

Kommentieren

Folgende HTML-Elemente können verwendet werden: <b> <i> <img src> <a> <blockquote>