Machen Sie den Unterschied zwischen Optionen ausdrücklich klar

Wenn der entscheidende Unterschied zwischen zwei Wahlmöglichkeiten in der Nutzeroberfläche nur angedeutet oder verdeckt wird, wählen die Nutzer oft die falsche aus oder missverstehen die Funktionen.

 

by Jakob Nielsen (deutsche Übersetzung) - 03.11.2013

 

Wenn Nutzer etwas aus einer Liste von Optionen vergleichen, gegeneinander halten und auswählen (engl.), ist das eine der hochwertigsten Aktivitäten, die das Internet zu bieten hat. Wenn die Leute das Richtige auswählen, kann ein Verkauf oder eine andere erwünschte Aktion folgen. Wählen Sie das Falsche aus, scheitert der Handel oder Sie haben einen unzufriedenen Kunden.

Im Online-Handel geschieht die Auswahl von Produkten gewöhnlich auf Kategorie-Seiten, manchmal über spezielle Vergleichswerkzeuge oder Übersichts-Tabellen. Es ist ein klassischer Designfehler, in solchen Übersichten sämtliche Produkteigenschaften als undifferenzierte Masse aufzulisten, auch dann, wenn die meisten Werte für die meisten oder alle Positionen gleich sind.

Statt alle Eigenschaften gleich zu behandeln, können Sie den Nutzern bei der richtigen Auswahl helfen, indem sie zwei Schlüssel-Richtlinien befolgen:

• Wenn sich die Optionen nur in wenigen Attributen unterscheiden, heben Sie diese Eigenschaften in einer Vergleichstabelle hervor oder schieben Sie sie in der Liste nach oben. Manchmal erreichen Sie zusätzliche Klarheit, wenn Sie bei Attributen, die für alle Produkte gelten, die Tabellenzellen über mehrere Spalten hinweg vereinigen.
• Wenn es viele Unterschiede gibt, aber nur wenige davon wirklich wichtig sind, heben Sie diese Schlüssel-Unterschiede hervor, um die Aufmerksamkeit der Nutzer auf die Dinge zu lenken, auf die es ankommt. Sie können auch die Methode des schrittweisen Aufdeckens (engl.) verwenden, um die Details über weniger wichtige Themen den Leuten anzubieten, die sie brauchen, ohne alle anderen mit einer Überfülle von Details zu überlasten.

Implizite Unterschiede sind gefährlich

Auch wenn es nur wenige einfache Unterschiede zwischen den Optionen gibt, können die Nutzer sie übersehen oder ihre Auswahl missverstehen, wenn die exakten Unterschiede ihrer Vorstellungskraft überlassen bleiben.

Zum Beispiel haben wir für einen neuen Kurs über Usability von Universitäts-Websites neulich die verschiedenen Wege getestet, mit denen den neuen Studenten die Höhe des Studiengeldes erklärt wird. An vielen staatlichen Universitäten hängt die Höhe des Studiengeldes davon ab, ob die Studenten vorher in dem jeweiligen Staat gewohnt haben. Angenommen, Sie wohnen in Kalifornien, aber Sie möchten gerne an die University of Colorado gehen. Und angenommen, Sie haben sich korrekt zur folgenden Seite auf der Website der Hochschule navigiert – wie würden Sie Ihr Studiengeld und Ihre Kosten bestimmen?

University of Colorado in Boulder: Schritt 1 bei der Bestimmung von Studiengeld und Kosten. In diesem Design wird der Unterschied zwischen "resident" (ansässigen) und "non-resident" (nicht ansässigen) Studenten impliziert, aber nicht erklärt.

Mit hoher Wahrscheinlichkeit würden Sie den Link "Nonresident Undergraduate Estimated Costs/Tuition" anklicken, nicht wahr? Gut für Sie - aber viele ältere Highschool-Schüler würden hier einen Fehler machen, wie wir aus Tests wissen. (Nutzertests sind besser als Vermutungen auf der Basis Ihrer eigenen Reaktionen auf ein Design.) Im Vergleich mit diesen angehenden Studenten haben Sie drei Vorteile:

• Vielleicht am wichtigsten: Sie sind kein Teenager, also haben Sie bessere Recherchefähigkeiten (von denen Sie einige wahrscheinlich auf einer Universität erworben haben, aber unsere Testteilnehmer waren noch auf keiner.) Die Tests von Uni-Websites mit Highschool-Schülern haben schlagend unsere Erkenntnisse aus früheren Studien mit Teenagern bestätigt: Teens sind ungeduldig, oberflächlich und haben extrem schlechte Recherche-Fähigkeiten.
• Dazu kommt, ich habe Sie vorab darauf eingestellt, auf das Thema der je nach Wohnort unterschiedlichen Studiengeldpreise zu achten. (Das ist auch Thema in einem unserer Kurse. Im Grunde geht es darum, dass etwas, das einmal in den Fokus Ihrer Aufmerksamkeit gelangt ist, eine Weile in Ihrem Kopf auf Abruf bleibt.)
• Ferner habe ich Sie vorab auf den Staat eingestellt, in dem Sie wohnen. Normalerweise befindet sich die Tatsache, dass Leute in, z. B., Kalifornien wohnen, nicht die ganze Zeit vorne in ihrem Kopf.

Also würden in diesem frühen Stadium der Suche nach Studiengeldpreisen viele Nutzer den ersten Link auf dem Screenshot oben anklicken, auch wenn sie nicht in Colorado wohnen. Sie würden dann auf diesem Bildschirm landen:

University of Colorado in Boulder: Schritt 2 beim Bestimmen von Studiengeldkosten

Auch wenn diese Seite ausdrücklich sagt, dass sie "for Colorado residents" (für Einwohner von Colorado) gilt - wir wissen, dass die Nutzer meist Blabla-Texte überspringen. Vor allem dann, wenn die Seite magnetische Handlungsaufforderungen positiv herausstellt wie hier: Die Augen der Nutzer gehen direkt zu der klickbaren Liste der vier verschiedenen Studienfelder, und sie verbringen die Zeit, in der sie auf dieser Seite sind, damit, das angestrebte Fach mit den Namen der Colleges in Übereinstimmung zu bringen. (Bei unserer Studie erwies sich dieser Schritt für die meisten Bewerber als extrem schwierig, weil er bei den Highschool-Schülern voraussetzt, dass sie wissen, wie eine Universität aufgebaut ist. Wie immer schlug die schlechte Informationsarchitektur gnadenlos zu. Je mehr die Nutzer in der Mitte der Seite mit Überlegungen aufgehalten werden, desto weniger achten sie auf den Eingangsabschnitt.)

Ich will nicht auf der University of Colorado herumpicken, weil viele andere Unis den gleichen Designfehler gemacht haben und die Nutzer auf vielen Websites Probleme mit den Studiengeldpreisen hatten. Dennoch - vergleichen Sie einmal das Design oben mit diesem hier bei der University of Idaho:

University of Idaho: Die Studiengeld-Vergleichstabelle macht den Unterschied zwischen Ansässigen und Nicht-Ansässigen ausdrücklich klar.

Hier hat keiner einen Fehler mit dem Design gemacht (und auch nicht auf ähnlichen Designs bei einigen anderen staatlichen Hochschulen).

Der entscheidende Unterschied zwischen den beiden Designs besteht darin, dass die University of Idaho die Unterscheidung zwischen den beiden Studentenklassen explizit hingeschrieben hat, indem sie den Namen Idaho in die Überschriften aufgenommen hat. Wenn Sie eine Wahl zwischen den beiden Spalten treffen wollen, kommen Sie an der Frage nicht herum, ob Sie momentan in Idaho wohnen oder nicht.

Schreiben Sie explizit und bestätigen Sie die jeweilige Auswahl

Das folgende Szenario habe ich schon in so vielen Nutzertest-Sitzungen wiederholt ablaufen sehen, dass ich gar nicht dran denken möchte, wie oft es war:

1. Die Nutzerin - sagen wir, Alice - sieht vor sich verschiedene Optionen (hier A und B genannt).
2. Alice möchte oder braucht in Wirklichkeit B, aber sie wählt A aus, weil der Unterschied zwischen beiden nicht ausdrücklich genannt wird. (Es ist zwar häufiger, dass die Nutzer versehentlich die erste Option wählen, aber es kommt auch vor, dass die versehentlich eine Option weiter unten auswählen.)
3. Alice verbringt viel Zeit damit, die Seiten über A durchzusehen.
4. Es kann passieren (wie häufig in solchen Fällen), dass Alice bis zum Schluss nicht erkennt, dass diese Seiten die falschen waren. Manchmal kaufen die Nutzer sogar etwas Falsches oder wählen die falsche Variante aus, was am Ende hohe Kosten verursacht (z. B. eine Retoure).
5. In diesem Fall aber erkennt Alice vielleicht ihren Fehler und muss unter den Interaktionskosten (engl.) leiden, die es verursacht, zur Option B zu wechseln. Selbst dieser bestmögliche Ausgang erzeugt wegen der Frustration und der verlorenen Zeit einen negativen Heiligenschein-Effekt (Halo-Effect engl.) für die ganze Website, wodurch die Nutzer mit geringerer Wahrscheinlichkeit endgültig konvertieren und mit geringerer Wahrscheinlichkeit später noch einmal zur Website wiederkehren.

Dieses Szenario habe ich in 20 Jahren Usability-Forschung viele, viele Male im Jahr ablaufen sehen. Es ist kein neues Problem; weil es seit zwei Jahrzehnten anhält, sage ich voraus, dass es uns noch viele weitere Jahre begleiten wird.

Ein zweites Szenario ist ebenfalls sehr verbreitet:

1. Wiederum braucht ein Nutzer - sagen wir, Bob - B, und die Website bietet A und B an.
2. Um das Produkt zu finden, bemüht Bob die Suche – entweder eine externe Suchmaschine wie Google oder Bing oder die eigene Suchfunktion der Website.
3. Aus irgendwelchen Gründen rangiert die Seite über A viel höher im Suchergebnis als die Seite über B und auch höher als die Kategorie-Seite, die sowohl A als auch B erläutert. (Solche irreführenden Rangfolgen sind einer der vielen Gründe, weshalb SEO für die Usability wichtig ist.)
4. Wie wir wissen, schauen die Nutzer nur auf die obersten Treffer der Ergebnisliste, und deshalb klickt Bob mit Sicherheit A an; er weiss es nicht besser.
5. Nun ist Bob auf den Seiten für A und hat noch nicht einmal den kleinen Vorteil zu wissen, dass es auch ein B gibt.
6. Da die Seiten über A den Unterschied zu B nirgendwo klar erwähnen, erkennt Bob den Fehler bis zum Schluss nicht.

Das von der Suche erzeugte Szenario ist schwerer zu korrigieren, weil Sie auf den A-Seiten nicht viel Platz dafür opfern wollen, über B zu sprechen. Die wichtigste Korrekturmöglichkeit besteht darin, die Unterscheidungsmerkmale in beiden Bereichen explizit zu erwähnen. Das erhöht die Wahrscheinlichkeit, dass die Nutzer eventuell bemerken, dass sie im falschen Bereich gelandet sind. In unserem Uni-Beispiel: Würden die Seiten über Studiengeld für Ansässige etwas erwähnen wie "Studiengeld für in Idaho Ansässige", würden kalifornische Studenten mit höherer Wahrscheinlichkeit erkennen, dass die Seite nicht für sie ist und nach Seiten für Nicht-Ansässige zu suchen beginnen.

Die Unterscheidung zwischen impliziten und expliziten Differenzierungskriterien ist eine entscheidende Usability-Determinante für jedes System, das mehrere Optionen anbietet. Leider wird gerade dieses Thema allzu leicht von Leuten übersehen, die zu viel über das System wissen - und das ist jeder im Designteam.

Gleichermassen denkt in unsrem Studiengeld-Beispiel wahrscheinlich jeder, der in der Zulassungsabteilung einer Universität arbeitet, dass die Bezeichnung "resident tuition" (Studiengeld für Ansässige) eine hochgradig explizite Beschreibung dieser Option darstellt. Solche Bezeichnungen sind für Leute, die ein wohlgeformtes mentales Modell vom jeweiligen Bereich haben, offensichtlich. Neue Nutzer allerdings nähern sich Ihrem Design mit einem schwammigen (oder gar schiefen) mentalen Modell von Ihrem Bereich.

Denken Sie also jedes Mal, wenn ein Teilnehmer beim Treffen des Designteams sagt "X ist doch offensichtlich" daran, dass es vielleicht für Leute ausserhalb Ihrer Organisation nicht so offensichtlich ist.

Je klarer und expliziter Sie sich ausdrücken - vor allem bei Unterscheidungsmerkmalen -, desto erfolgreicher wird Ihre Website sein.

 

© Deutsche Version von Jakob Nielsens Alertbox. Institut für Software-Ergonomie und Usability AG. Alle Rechte vorbehalten.