Einsatz von Schrift im User Interface Design

Infografik Userinterfacedesign Typografie und Funktion 03

Mit einer passenden Schrift und wenigen handwerklichen Kniffen lassen sich sowohl die Orientierung in digitalen Produkten verbessern, als auch Marke und Botschaft unverwechselbar inszenieren.

Schrift übermittelt Informationen sehr effizient. Damit Schrift das aber auch kann, sind einige formale Kriterien zu beachten, die zu schönen wie benutzbaren Produkten führen.

Den ersten Eindruck, den Nutzer von einer Anwendung haben, bestimmt neben der Farbe vor allem die Anordnung der Elemente auf dem Interface. Dabei spielt Schrift eine zentrale Rolle, weil sie der wichtigste Träger von Bedeutung ist. Auch wenn nur wenige Buchstaben auf einem Screen stehen – sie bestimmen, ob der Nutzer die Anwendung versteht oder nicht.

Leserlichkeit

Ob Nutzer Texte entziffern können (Leserlichkeit), bestimmen folgende Faktoren:

  • Kontrast zwischen Text und Hintergrund
  • Schriftgrösse – Anforderungen unterschiedlich, abhängig von Lichtverhältnissen, Leseabstand und Sehvermögen
  • Schriftart

Heutige Anforderungen an Informations-Design

Informationen müssen heute auf unterschiedlichen Gerätegrössen gut aussehen. Selbst bei gleicher Bildschirmbreite kann die Nutzererfahrung recht unterschiedlich sein. Ein Anwender, dessen Browserfenster 1920 Pixel breit ist, kann vor einem Tablet sitzen und so einen Text in 12 Punkt Grösse recht gut lesen. Sitzt er von seinem Sofa und schaut fern, so kann er bei 12 Punkt nichts erkennen. Wenn er nun noch einen Button mit einer Grösse von 24 × 24 Pixel mit der Fernbedienung ansteuern will, ist er vermutlich schnell frustriert.

Der wichtigste Ausgangspunkt bei der Gestaltung ist, welche Fenstergrösse mit welcher Auflösung wir beim Nutzer annehmen und welche Pixel Density der Screen aufweist. Usability-Experte Jakob Nielsen hat das Konzept des Screen Real Estate eingeführt. Der Platz auf dem Bildschirm der Nutzer ist kostbar wie ein Grundstück in New York und soll überlegt genutzt werden. Sie müssen den besten Kompromiss finden zwischen folgenden Anforderungen:

  • angenehme Anmutung durch grosszügiges Design
  • gute Orientierung und ausreichend Navigationsmöglichkeiten
  • möglichst viele Informationen
  • Optimale Wirkung der relevanten Informationen
  • möglichst viele Inhalte
  • möglichst wenig ungenutzter Platz

 

Die richtige Schrift finden

Die Schriftart gibt Ihrem Interface ein Gesicht. Ihr Stil sollte zu dem Bild passen, das Sie abgeben wollen. Sie können unterschiedliche Schriftarten einsetzen. Für wenig Text und Überschriften können Sie auf auffällige Schriften zurückgreifen.

Merkmale für geeignete Bildschirmschriften:

  • Kein zu differenzierter Duktus (vereinfachte Formen)
  • Offene Punzen
  • Normale Schriftstärke und Schriftlage (keine Kursiven)
  • Optimiert für alle Displaytypen
  • Auch gedruckt brauchbar
  • Gut ausgebaute Schriftfamilie
  • Auch in verschiedenen Sprachen nutzbar

Aus der Praxis

Auch als Nichtgestalter sollten Sie sich bei der Wahl der Schrift folgende Fragen stellen:

Leserlichkeit

  • Sind die Buchstabenformen offen konstruiert?
  • Ist der Kontrast zwischen Klein- und Grossbuchstaben gering?
  • Sind die Buchstaben gut unterscheidbar?

Stil

  • Passt die Schrift zum Thema oder Unternehmen?
  • Passt die Schrift zum Genre der App?
  • Hebt sich die Schrift vom Wettbewerb ab?

Sprachadaption

  • Enthält die Schrift alle Zeichen der Sprachen, für die die App lokalisiert wird?
  • Brauche ich eine passende Ergänzungsschrift für andere Sprachsysteme?

Lizenzen und passende Formate

  • Liegen die Schriften im richtigen Format fürs Zielbetriebssystem vor?
  • Habe ich Lizenzen passend zum Einsatzzweck?