Ein Symbol kann eine Schaltfläche schneller erkennbar machen, einen Status auf einen Blick vermitteln oder eine lange Beschriftung ersetzen. Doch Icons helfen nur dann, wenn Menschen ihre Bedeutung sofort verstehen. Für Teams, die eine Oberfläche entwerfen, lohnt es sich deshalb, Icons nicht als Dekoration zu behandeln, sondern als Teil der Navigation und Informationsvermittlung.
Eine praktische Ausgangsbasis bietet eine Sammlung wie glyphicon icons. Entscheidend ist weniger die Anzahl verfügbarer Zeichen als die Frage, welche davon die Aufgabe einer konkreten Oberfläche unterstützen. Ein Papierkorb neben “Löschen” bestätigt die Funktion. Ein unbekanntes Symbol ohne Text kann dagegen Rätsel aufgeben.
Mit der Aufgabe beginnen, nicht mit dem Symbol
Bevor ein Team ein Icon auswählt, sollte es festlegen, was eine Person an dieser Stelle tun oder verstehen soll. Geht es um eine Aktion, etwa das Öffnen eines Menüs? Oder zeigt das Zeichen einen Zustand an, zum Beispiel einen abgeschlossenen Schritt? Diese Unterscheidung verhindert, dass dieselbe Bildsprache unterschiedliche Aufgaben übernimmt.
Danach hilft ein kurzer Abgleich mit dem Kontext. Ein Pluszeichen kann “hinzufügen” bedeuten, aber je nach Bildschirm auch eine neue Zeile öffnen oder einen Wert vergrößern. Steht daneben eine eindeutige Beschriftung, lässt sich die Funktion leichter erfassen. Bei vertrauten Symbolen kann der Text knapper ausfallen, sollte aber nicht verschwinden, wenn ein Missverständnis Folgen hätte.
Vertrautheit ist wichtiger als Originalität
Ein eigenes Symbol wirkt auf den ersten Blick unverwechselbar. Nutzerinnen und Nutzer müssen seine Bedeutung jedoch erst lernen. Für häufige Aufgaben wie Suchen, Schließen, Drucken oder Zurückgehen haben sich Konventionen etabliert. Wer davon abweicht, sollte prüfen, ob die neue Form tatsächlich verständlicher ist und nicht nur anders aussieht.
- Nutzen Sie bekannte Zeichen für häufige Aktionen, wenn sie zur Funktion passen.
- Ergänzen Sie ungewohnte oder mehrdeutige Icons durch kurze Beschriftungen.
- Verwenden Sie dasselbe Symbol innerhalb einer Anwendung für dieselbe Bedeutung.
- Vermeiden Sie dekorative Zeichen, die mit interaktiven Bedienelementen verwechselt werden können.
- Prüfen Sie, ob Farbe und Form auch ohne einander verständlich bleiben.
- Testen Sie die Auswahl mit Personen, die den Entwurf noch nicht kennen.
Größe, Kontrast und Abstand mitdenken
Ein gut gewähltes Icon kann trotzdem scheitern, wenn es kaum zu erkennen ist. Auf kleinen Displays brauchen feine Details genug Fläche, damit sie nicht verschwimmen. Auch der Kontrast zum Hintergrund zählt. Teams sollten ein Icon nicht allein anhand einer großen Designvorschau beurteilen, sondern es in der tatsächlichen Größe und Umgebung prüfen.
Abstand beeinflusst ebenfalls die Wahrnehmung. Liegen zwei Schaltflächen dicht nebeneinander, können Nutzer das falsche Symbol auswählen. Ein klarer Abstand und eine ausreichend große anklickbare Fläche helfen, besonders bei Touchbedienung. Die sichtbare Grafik darf klein sein; die Interaktionsfläche muss es nicht sein.
Barrierefreiheit gehört zur Auswahl
Wenn ein Icon eine Funktion trägt, braucht die Oberfläche auch eine verständliche textliche Bezeichnung, die assistive Technologien ausgeben können. Bei einer Schaltfläche kann das ein zugänglicher Name sein, selbst wenn auf dem Bildschirm nur das Zeichen erscheint. Rein dekorative Icons sollten dagegen nicht unnötig vorgelesen werden. So bleibt die Ausgabe für Menschen mit Screenreader nachvollziehbar.
Auch Farbe allein sollte keine Information vermitteln. Ein rotes Symbol kann einen Fehler markieren, aber eine zusätzliche Beschriftung oder ein klar unterscheidbares Zeichen macht den Zustand robuster. Das hilft Menschen mit eingeschränktem Farbsehen und verhindert Missverständnisse bei schlechten Displays oder ungünstigen Lichtverhältnissen.
Mit echten Aufgaben testen
Ein Icon-Test muss keine große Studie sein. Zeigen Sie den Entwurf Personen, die nicht an seiner Gestaltung beteiligt waren, und bitten Sie sie, eine konkrete Aufgabe auszuführen. Beobachten Sie, wo sie zögern, welche Zeichen sie falsch deuten und ob sie nach einer Beschriftung suchen. Diese Beobachtungen geben oft mehr Aufschluss als die Frage, ob jemand das Design ansprechend findet.
Halten Sie anschließend die Entscheidung fest: Welche Funktion steht hinter dem Symbol, welche Beschriftung gehört dazu und wo wird es verwendet? Ein solches Verzeichnis erleichtert spätere Änderungen und verhindert, dass verschiedene Teams für dieselbe Aktion unterschiedliche Zeichen einführen. Icons werden damit zu einem verlässlichen Teil des Interface-Wortschatzes, statt von Bildschirm zu Bildschirm neue Bedeutungen anzunehmen.
