Blogging Inside

Blogging Grundlagen: Tipps für eine bessere Lesbarkeit eines Blogs

Typografie

Leser kommen zu deinem Blog um deine Beiträge zu lesen. Bei manchen Bloggern scheint jedoch der optische Eindruck wichtiger zu sein, als dass man den Text bzw. den Beitrag gut, leicht und flüssig lesen kann. Dieselben Blogs leiden dann meist unter wenig Lesern. Also achte unbedingt darauf das dein Blog leicht lesbar ist. Du willst keinen Preis für Grafik Design gewinnen, sondern Inhalte vermitteln.

Natürlich geht es in diesem Beitrag um Textblog und nicht um Foto Blogs oder Blogs von Künslern, die eine Leserschaft haben, die anders wahrnimmt.

Gute gestylte bunte Themes sehen zwar für sich alleine gut aus und sind für Blogs ohne Werbung ok. Wenn Du aber Werbung im Blog hast, denke bei der Auswahl eines Themes immer daran, dass durch die Werbung zusätzliche Farbe in das WordPress Blog kommt. Das kann dann schon zu viel des Guten sein.

Selbst das spartanische White Magazine Theme für WordPress, welches wir auf Blogging Inside kostenlos anbieten, wird durch Werbung bunt genug.

Typographie

Wähle eine bewährte Schriftart wie Arial, Verdana, Times usw. für deinen Blog. Das sind sogenannte Brotschriften im Schriftsetzer Jargon. Diese Schriften haben sich im Buch- und Zeitungsdruck wegen ihrer guten Lesbarkeit bewährt. Verzichte im Fliestext unbedingt auf Effektschriften, die zwar in Überschriften schön aussehen aber nicht für den Fließtext gedacht sind und daher nur schwer lesbar sind.

Wähle einen angemessenen Zeilenabstand

Als Zeilenabstand bezeichnet man den Abstand zwischen zwei direkt untereinander gelegenen Zeilen eines Textes, gemessen von Grundlinie zu Grundlinie. Ohne weitere Einstellungen liegt der Abstand bei 100%. Bis zu 150% geht in den meisten Fällen je nach der gewählten Schriftart. Wird der Zeilenabstand nicht festgelegt, wird der Text bei manchen Schriften „schwarz“. Will heißen, die Zeilen sind zu nahe aneinander und man verliert beim Lesen sehr schnell die Übersicht.

Drei Beispiele

100%

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata

125%

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata

140%

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata

Man sieht auf Anhieb, dass das erste Beispiel nur schwer lesbar ist, bzw. man schnell die Orientierung verliert. Entscheide selbst, was Du am leichtesten lesen kannst.

Definiert wird der Zeilenabstand in im Stylesheet mit:

line-height: 120%;

Der Wert 120% ist nur ein Beispiel. Man muss je nach Schriftart ein bischen herumprobieren, mit welchem Abstand den Text am besten lesbar ist. Es muss eine klare Unterscheidung zwischen den Zeilen geben. 120% – 150% haben sich am besten bewährt.

Mit line-height wird in CSS die Zeilenhöhe festgelegt. Gibt es mehrere Zeilen untereinander, lässt sich mit linge-height der Zeilenabstand festlregen.

Rede (schreibe) nicht lange um den heißen Brei herum

Absolut wichtig ist die Benutzerfreundlichkeit deines Blogs. Achte darauf, dass deine Navigation zielgerichtet ist, Starte deinen ersten Blog-Eintrag direkt mit einer Schlagzeile und komme schnell zum Punkt. Deine Leser wollen sofort Input und nicht lange in deinen Blogseiten suchen. Versuche deine Blogstruktur so zu halten, dass möglicht wenig von deinen Inhalten abgelenkt wird.

Zu hoher Kontrast, zu niedriger Kontrast

Taten dir beim Lesen eines Blogs schon mal die Augen weh? Bestimmt, denn manche Blogs haben eine zu harten oder zu weichen Kontrast zwischen dem Text und dem Hintergrund. Nimmt man zum Beispiel schwarzen Text (#000000) auf weissem Hintergrund (#ffffff) ist der hohe Kontrast im Zusammenspiel mit dem leuchtenden Bildschirm sehr anstrengend für die Augen. Das gilt auch für den umgekehrten Fall.

Die mobile Version verlassen