Textgestaltung für mobile Endgeräte – einige Positivbeispiele

Die Textgestaltung für mobile Endgeräte spielt eine ähnlich wichtige, wenn nicht sogar noch wichtigere Rolle als im normalen Web. Die schnelle Orientierung im Text und dessen Erfassung muss dem Nutzer durch optische Hilfsmittel und klarer Textstruktur erleichtert werden.

Aus diesem Grund möchte ich Ihnen heute einige Good Practices zur Textgestaltung bei Smartphone-Apps an die Hand geben.

Textstruktur: tagesschau-App

Tagesschau

Tagesschau-App mit Zwischenüberschriften und andersfarbigen Einschüben (Videos und Bilder).

Die Artikelseiten der tagesschau-App weisen eine klare Struktur auf, an der sich Leser beim Überfliegen/Scannen des Textes orientieren können.
Jeder Artikel beginnt mit einem thematisch passenden Bild gefolgt von Overline und Headline. Die einzelnen Absätze sind meist recht kurz gehalten und Zwischenüberschriften bieten optische Anker-/Einstiegspunkte.
Im Text eingebundene Bilder werden durch eine andere Hintergrundfarbe vom eigentlichen Artikel abgesetzt. Eine Bildunterschrift stellt weitere Informationen bereit bzw. erläutert das Bild kurz. Ähnlich werden auch ergänzende Videos im Artikel eingebunden.

Insgesamt lassen sich Texte aus meiner Sicht recht gut erfassen. Lediglich der Kontrast zwischen Hintergrund (hellblau) und Schrift (dunkelblau) könnte noch etwas besser sein.

Textstruktur: stern-App

Stern

Stern-App mit Zwischenüberschriften und ergänzenden Bildern bzw. Videos am Anfang und Ende.

Die Artikelseiten der Stern-App besitzen eine etwas andere Struktur. Zu Beginn wird die Overline und Headline angezeigt, gefolgt von einem thematisch passenden Bild. Direkt unterhalb der Abbildung wird dem Leser ein fettgesetzter Teaser angeboten, der die wichtigsten Informationen enthält.
Danach wird der komplette Artikel angezeigt. Die Absätze meist angenehm kurz und Zwischenüberschriften erleichtern die Orientierung und Erfassung der Texte.
Am Ende des Artikels werden dem Leser ergänzende Videos oder weitere Bilder angezeigt.

Die Struktur der Artikelseite bei der Stern-App gefällt mir persönlich etwas besser als die der Tagesschau-App. Dank Headline, Bild und Teaser ist ein erster Eindruck möglich, anhand dessen der Leser entscheiden kann, ob er den kompletten Artikel lesen möchte. Zudem empfinde ich es als angenehmer, dass der Artikel selbst nicht durch weitere Bilder oder Videos unterbrochen wird. Der Text kann am Stück gelesen werden ohne optische Unterbrechungen.
Dies ist aber eine reine Geschmackssache.

Hilfereiche Funktion für bessere Lesbarkeit

stern-App – Anpassung der Schriftgröße und Veränderung des Farbschemas

stern-App – Anpassung der Schriftgröße und Veränderung des Farbschemas

tagesschau-App - Möglichkeit der Schriftgrößenanpassung

tagesschau-App - Möglichkeit der Schriftgrößenanpassung

Die Möglichkeit die Schrift vergrößern bzw. auch wieder verkleinern zu können, bieten beide Apps an. Speziell für eher textlastige Apps ist diese Funktion aus meiner Sicht ein Muss.

Die Stern-App bietet zudem noch die Möglichkeit an, das Farbschema über die Funktion „invers“ zu ändern (Siehe Abbildung 3). Der Nutzer kann zwischen schwarzer Schrift auf weißen Hintergrund zu weißer Schrift auf schwarzem Hintergrund wechseln. Ich finde für das Lesen ist die weiß-auf-schwarz Variante deutlicher angenehmer.

Texte sinnvoll formatieren

Bei der Textgestaltung für mobile Endgeräte sollten folgende Punkte beachtet werden, damit die Erfassung der Texte einfach und schnell möglich ist:

  • Klare aussagekräftige Headline.
  • Kurze Absätze, in denen jeweils ein Thema/Aspekt behandelt wird.
  • Einfacher und leicht verständlicher Satzbau.
  • Zwischenüberschriften als alternative Einstiegspunkte.
  • Einsatz von Aufzählungen und Nummerierungen.

Zudem essentiell wichtig für die Erfassung von Texten ist ein ausreichender Kontrast zwischen Text und Hintergrund.

Ein Gedanke zu „Textgestaltung für mobile Endgeräte – einige Positivbeispiele

  1. Pingback: 10 Lesetipps der Woche für Shopbetreiber » shopbetreiber-blog.de

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *