So definiert man die richtigen Schriftgrößen

Viele Webseiten leben von ihrem Content. Doch der Inhalt kann noch so gut sein und einen entsprechenden Mehrwert für den Leser bieten, wenn er nicht angenehm lesbar ist, verlassen die Nutzer schnell wieder die Seite. Die richtige Typographie, also in diesem Fall die Schriftgröße, ist daher ein ausschlaggebender Punkt für die optimale Lesbarkeit eines Textes.

Doch Webseiteninhaber müssen keine Experten in Typographie sein, vielmehr sollten sie auf ein paar grundlegende Regeln achten, damit die Texte harmonisch und lesbar sind. Welche das sind, zeigen wir in diesem Beitrag.

Unterschiede zwischen Print- und Digitalmedien

Sicherlich ist jedem bewusst, dass es Unterschiede im Erscheinungsbild zwischen Texte in Printausgaben, beispielsweise einem Buch, und auf dem Bildschirm, wie etwa bei Blogbeiträgen, gibt. Doch besonders bei der Erstellung von Beiträgen für Blogs oder Artikel von Unternehmen wird dieses leicht vergessen.

Wenn der Text eines Buches betrachtet wird, dann erkennt man schnell, dass die Schrift in einer Größe von ungefähr 12 Punkten, je nach Schriftart, gewählt wurde. Übernimmt man nun diese Größe für einen Blogbeitrag ist diese viel zu klein für den Leser. Das liegt unter anderem an den Abstand. Ein Buch wird in der Regel aus einer Entfernung von ca. 40 cm gelesen. Zwischen dem Bildschirm und dem Leser sind es aber eher gute 60 cm. Dieser Unterschied lässt die einzelnen Buchstaben schnell verschwimmen und ein Lesen des Textes am Bildschirm in zu kleiner Schriftgröße wird schnell unangenehm.

Diverse Tests haben ergeben, dass eine zu kleine Schrift die Leser schnell ermüdet und diese die Webseite entsprechend schnell wieder verlassen.

Optimale Schriftgröße für den Bildschirm

Wenn Texte für digitale Medien, wie beispielsweise dem Desktop-Bildschirm, erstellt werden, dann sollte auf eine wesentliche höhere Schriftgrößen zurückgegriffen werden. Ideal hat sich hierbei die Größe von ca. 16 bis 20 Pixel für einen Fließtext, also der sogenannte Paragraph, herausgestellt. Die Spannweite der Pixelgrößen ist der gewählten Schriftart geschuldet. Manche Schriftarten sind bei 16 Pixeln noch immer zu klein und sollten daher auf bis zu 20 Pixel angeglichen werden.

Für die Überschriften sollten andere Größen verwendet werden, damit diese auch als solche erkannt werden. Bei Webseiten stehen mitunter sechs Überschriften, die mit H1 bis H6 bezeichnet werden, zur Verfügung. Allerdings sollten nur die ersten vier Überschriften (H1-H4) genutzt und angepasst werden.

Damit eine Harmonie zwischen den Überschriften und dem Fließtext entsteht, sollten diese wiederum nicht zu klein und auch nicht zu groß ausfallen. In der Praxis hat sich gezeigt, dass ein entsprechender Faktor genutzt werden sollte, um die unterschiedlichen Größen einheitlich festzulegen. Beispielsweise könnte der Faktor 1,3 in Betracht kommen. Das bedeutet, wenn die Schrift vom Fließtext eine Größe von 16 Pixeln hat, sollte die kleinste Überschrift (H4) bei 21 Pixeln liegen. H5 wären dann 27 Pixel, bis hin zu H1 mit 46 Pixeln.

Doch auch hier ist der Faktor von der Schriftart abhängig. Daher sollte vor Beginn der Erstellung von Texten mit verschiedenen Arten und Größen experimentiert werden.

Achtung bei der Nutzung von voreingestellten Themes

Viele Themes zur Erstellung von Webseiten haben voreingestellte Standardgrößen für den Fließtext und den verschiedenen Überschriften. In den meisten Fällen ist die Größe allerdings viel zu niedrig eingestellt und liegt beispielsweise bei einem Fließtext zwischen 12 und 14 Pixeln. Dementsprechend sollten direkt nach der Installation des Themes die einzelnen Schriftgrößen kontrolliert und gegebenenfalls manuell angepasst werden. So kann von Anfang an eine Seite korrekt gestaltet werden.

Was ist bei der Darstellung auf Mobilgeräten?

Bei der Einstellung der diversen Schriftgrößen sollte natürlich auch die Darstellung auf mobilen Endgeräten, wie dem Tablet oder Smartphone, berücksichtigt und die einzelnen Schriftgrößen wie bereits beschrieben manuell eingestellt werden. Dabei hat sich für die Skalierung bei Fließtexten auf Smartphones eine Größe von ca. 14 bis 16 Pixeln bewährt, auch hier entsprechend abhängig von der gewählten Schriftart. Zum einen ist dann die Größe ideal, damit genug Text auf den Bildschirm passt, ohne dass der Leser ständig scrollen muss und zum anderen ist die Entfernung zwischen den Augen und dem Smartphone wesentlich geringer als bei einem Desktop-Bildschirm. Die Anpassung der Größen für die Überschriften sollte mit einem Faktor von ca. 1,2 erfolgen.

Scroll to Top