Eine eindrucksvolle Überschrift auf einem großen Monitor kann einen gesamten Smartphone-Bildschirm füllen. Eine feine graue Bildunterschrift, die im Entwurf dezent wirkt, verschwindet im Sonnenlicht womöglich fast vollständig. Mobile Typografie beginnt beim Verständnis der Lesesituation: kleine Bildschirme, kurze Besuche, unterschiedliche Verbindungsqualität und der Wunsch, schnell handeln zu können. Sie soll nicht die Desktop-Version verkleinern, sondern Bedeutung und Aufmerksamkeit in einer anderen Umgebung bewahren.
Eine klare Hierarchie aufbauen
Leser müssen Seitentitel, Abschnittsüberschrift, Fließtext und Feldhinweis sofort unterscheiden können. Dafür sind keine Dutzenden Schriftgrößen und -stärken nötig. Ein kleines, konsequentes System funktioniert besser, wenn Abstände die Beziehungen unterstützen. Eine Überschrift sollte näher am zugehörigen Absatz stehen als am vorherigen Abschnitt. Gleiche Komponenten müssen auf der gesamten Website gleich wirken, auch in Journalartikeln und auf Kontaktseiten.
Echte Texte prüfen
Eine kurze Beispielüberschrift zeigt nicht, wie eine lange ukrainische Leistungsbezeichnung umbricht. Verwenden Sie schon während der Gestaltung echte Inhalte. Prüfen Sie Apostrophe, Anführungszeichen, Gedankenstriche, Zahlen, Adressen und lange Wörter. Erzwingen Sie keine Zeilenumbrüche nur für einen schönen Screenshot: Auf einer anderen Bildschirmbreite können sie den Rhythmus stören. Passt ein Titel nicht, sollte zuerst die Formulierung vereinfacht werden, bevor die Schrift unangenehm klein wird.
Den Absatz als Oberflächenelement verstehen
Ein durchgehender Textblock ist auf dem Smartphone schwer zu überfliegen. Gliedern Sie nach Bedeutung, geben Sie Abschnitten konkrete Namen und verwenden Sie für Handlungsschritte eine Liste, wenn sie tatsächlich hilft. Gleichzeitig sollte nicht jeder Satz zum eigenen dekorativen Block werden. Gesucht ist ein Rhythmus für schnelles Überfliegen und sorgfältiges Lesen. Wichtige Bedingungen dürfen nicht unauffällig gemacht werden, nur damit das Layout aufgeräumt aussieht.
Die Bedienung mitdenken
Typografie betrifft auch Schaltflächen und Formulare. Nutzer sollten wissen, was nach dem Klicken geschieht. „Projekt besprechen“ beschreibt den Schritt genauer als ein allgemeines „Starten“, wenn als Nächstes eine Anfrage folgt. Feldbeschriftungen müssen nach der Eingabe verständlich bleiben; Fehlermeldungen sollten die Korrektur erklären. Wichtige Informationen dürfen nicht ausschließlich durch Farbe vermittelt werden: Ein kurzer Text verhindert Rätselraten.
Mehr als Bildschirmgrößen testen
Prüfen Sie die Seite mit vergrößerter Darstellung, Tastaturbedienung und nicht geladenen Bildern. Der Hauptinhalt darf weder abgeschnitten noch von einer fixierten Leiste verdeckt sein. W3C bietet erste Barrierefreiheitsprüfungen, unter anderem für Überschriften und weitere Seitenelemente. Sie ersetzen kein vollständiges Audit, helfen aber, offensichtliche Probleme vor der Veröffentlichung zu erkennen. Auch automatisierte Tests können nicht jede Formulierung auf Verständlichkeit bewerten.
Der abschließende Test ist einfach: Öffnen Sie die Website auf einem gewöhnlichen Smartphone und lesen Sie sie wie ein neuer Besucher. Müssen Sie angestrengt hinschauen, einzelne Stellen vergrößern oder den nächsten Schritt erraten, sollte die Lösung überarbeitet werden, selbst wenn der Entwurf makellos aussieht.