Puuh... Jeden Tag top informiert sein bedeutet auch, einer unendlichen Flut an Bildern, Videos, Blogs, Newsfeeds und Social Media ausgesetzt zu sein. Das ist auch anstrengend oder? Und desshalb haben wir uns auch dafür Methoden angeeignet: die verschiedenen Lesearten.

Zur Usability im Webdesign gehört auch, dass du deine Texte dem Nutzer zugänglich machst und die Inhalte gelesen werden. Wenn du weißt, welche Leseart bei deinen Texten angewandt wird, dann kannst du deine Texte entsprechend aufbereiten.

Wie lesen wir im Internet?

Im Liegen, Gehen, Sitzen, Stehen... Naja, das meine ich nicht ganz. Die meisten Webseiten verfolgen das gleiche Ziel wie die erste Webseite aus den 90ern: sie sollen informieren. Zur Vermittlung diverser Inhalte dienen Videos, Bilder, Illustrationen und vor allem: Texte! Diese Form der Informationsvermittlung nennt man Consumption (Konsum) Design: Inhalte gestalten, damit sie gelesen werden. Und wie werden Inhalte nun gelesen?

konsultierendes lesen: Beim konsultierenden Lesen ist der Nutzer auf eine bestimmte Information aus. Dafür sollte der Inhalt möglichst strukturiert und übersichtlich gestaltet sein. Ein feiner Anhaltspunkt ist hier auch eine Art Inhalsverzeichnis oder Glossar, so wie Wikipedia.de zum Beispiel.

informierendes Lesen: Beim informierenden Lesen wollen wir den Sachverhalt schnell erfassen können, also überfliegen wir den Text größtenteils. Nachrichtenseiten werden in der Regel informierend gelesen. Mit deutlichen Schlagwörtern, aussagekräftigen Überschriften und kurzen, klaren Sätzen ermöglichen wir das Scannen der Inhalte.

lineares Lesen: Beim linearen Lesen werden Texte von Anfang bis Ende gelesen. Er ist spannend genug aufbereitet, dass man nichts verpassen möchte. Romane und Kurzgeschichten lesen wir beispielsweise linear.

Im besten Fall liest du diesen Blogpost also linear :) Blogartikel werden allerdings meist eher informierend gelesen und später dann nochmal konsultierend, denn du suchst meist nach konkreten Informationen, Hilfen oder Lösungen.

6 Tipps für bessere Texte

Lange und monotone Texte lassen sich generell nicht leicht lesen. Es wäre doch zu Schade, wenn guter Inhalt nicht gelesen wird, weil es für den Leser zu "anstrengend" ist. Diverse Faktoren wie Schriftart, Schriftgröße und Strichstärke, Farbe, Kontrast und Lichtverhältnisse beeinflussen die Lesbarkeit. Und selbst wenn alle Faktoren im Einklang sind – was ist, wenn der Leser sich dabei auch noch bewegt, etwa beim Sporteln liest? Lesbarkeit ist also auch relativ. Wir müssen damit rechnen, dass die meisten Texte nur noch überflogen werden und eine kurze Aufmerksamkeitsspanne macht es uns auch nicht gerade leichter den Leser in den Bann zu ziehen. So oder so, um ihn bei der Informationsaufnahme zu helfen, sollten diese einfachen Tipps beherzigt werden, denn auch das gehört zur Usability im Webdesign.

1. Hierarchie

Was für Layouts gilt, das gilt auch für das geschriebene Wort: je größer ein Wort ist, desto wichtiger ist es. Schaffe also sinnvolle Überschriften und sorge direkt für mehr Struktur. Eine gute Überschrift macht den Leser neugierig und gibt einen ersten Eindruck vom Inhalt.

Ein Fließtext für den allgemeinen Inhalt sollte auf Webseiten etwa 16 Pixel groß sein. Dies gilt als empfohlene Schriftgröße, kann allerdings je Schriftart variieren und muss daher individuell geprüft werden. Hinweistexte und Randinformationen sollten kleiner sein. Überschriften dagegen dienen der schnellen Orientierung und sollten daher größer als der Fließtext sein.

Tipp: Als besonders harmonisch wirken Texte, wenn die Vergrößerung dem allseits beliebten Goldenen Schnitt folgt. Also: Hinweistext x 1,618 = Fließtext x 1,618 = Überschrift Hier gibt es ein feines Tool zur Hilfe bei der richtigen Aufteilung: http://type-scale.com/

2. Breite

Im responsiven Webdesign wird die gesamte Bildschirmbreite für das Design genutzt. Eine schnelle Verführung auch den Text entsprechend breit zu gestalten.
Doch Vorsicht: die Textbreite ist entscheidend für ein flüssiges Leseergebnis. Die Spaltenbreite liegt für einen guten Lesefluss bei etwa 500 bis 600 Pixeln. Das entspricht etwa 50 bis 60 Buchstaben. Der Zeilenabstand sollte dabei etwa das 1,5-ache der Schriftgröße sein. Also: 16px Fließtext x 1,5 = 24 px Zeilenabstand

Zu kleiner Abstand wirkt verschwommen und ein zu großer Abstand lässt den Leser schnell den Zusammenhang und die nächste Zeile verlieren. (Im Printbereich hat sich übrigens der Minimum-Faktor 1,2 bewährt.)

3. Abstand

Durch sinnvolle Gliederung der Inhalte schaffst du dem Leser kleine Häppchen, die sich einfacher lesen lassen als große Brocken. Das verbessert den Lesefluss und erleichtert das Erfassen der Texte. Schaffe daher ausreichend Abstände.

4. Listen

Wichtige Fakten und Aufzählungen werden in Listenform noch schneller greifbar. Der Leser kann schnell und auf einem Blick die wichtigsten Informationen aufnehmen.

5. Hervorheben

Wichtige Informationen lassen sich ebenfalls durch konkrete Hervorhebungen schneller erfassen. Verschiedene Schriftschnitte wie bold oder kursiv helfen ebenfalls dabei, dem Leser mehr Überblick zu verschaffen.

6. Kontrast

Wie überall hilft auch Kontrast dabei Wichtigkeiten aufzuzeigen. So lässt sich zum Beispiel schwarzer Text auf weißem Hintergrund leichter lesen als gelber Text oder? Sei aber vorsichtig mit dem Umgang von Kontrast ;)

7. Kurz und Knapp

Vermutlich gerade durch die Massenvielfalt an Information gerade im Netz haben wir uns in den letzten Jahren das Scannen zu eigen gemacht. Im Interface Design werden Schlagwörter wie OK, Jetzt Kaufen, Weiter, Speichern für schnelle Orientierung benutzt. Mach deinem Benutzer eine Freude und “keep it short and simple as possible – but not shorter”.

Mit diesen Tipps solltest du bestens vorbereitet sein, um Texte im Web leserlich aufzubereiten. Hast du selber noch gute Tricks oder Anmerkungen zum Thema? Dann freue ich mich auf deine Antwort: hello@feinfineart.de

Ach, sag mal, hast du dir jetzt eigentlich wirklich das Artikelbild durchgelesen? Wenn nicht, überrascht es mich nicht, wenn doch – dann lag es vermutlich nicht an der hervorragenden Textgestaltung – oder was meinst du?