„Bitte lesen Sie jetzt!“ – Wie Sie Ihre Nutzer dazu bringen, Hinweise und Erläuterungen zu lesen

Einstieg

Vielleicht kennen Sie das: Da haben Sie auf Ihrer Website einen WICHTIGEN HINWEIS platziert, den der Nutzer UNBEDINGT LESEN sollte, um z. B. eine Funktion oder einen Prozess zu verstehen und die Seite bedienen zu können. An anderer Stelle weisen Sie in einem TOTAL ANSCHAULICHEN TEXT auf eine neue und innovative Funktion hin und erläutern diese ausführlich. Wer da noch Fragen hat, der muss Analphabet sein.
Und dann das: Im Usability-Test beobachten Sie, wie sich die Nutzer mit Ihren Hinweisen und Erläuterungen befassen – nämlich gar nicht! Die Folge: Ratlosigkeit bei den Nutzern, denen wichtige Informationen fehlen. Und Verzweiflung bei den Machern der Website, weil die Nutzer ihre mühevoll erdachten Hinweise scheinbar einfach ignorieren.

Wie kann das sein? Und was können Sie tun, damit Ihre Nutzer Ihre Hinweise und Texte nicht übersehen oder ignorieren?

Nutzer lesen nicht gerne am Bildschirm…

Es dürfte mittlerweile bekannt sein, dass Nutzer am Bildschirm generell langsamer lesen und eher dazu neigen, Texte zu überfliegen und zu scannen. Zahlreiche Studien belegen dies – an dieser Stelle sei stellvertretend auf eine der bekanntesten Studien dazu von Jakob Nielsen verwiesen sowie auf eine Eyetracking-Studie von eResult zu diesem Thema. Mit anderen Worten: Lesen am Bildschirm ist anstrengender und daher wird der Aufwand dafür lieber so gering wie möglich gehalten.
Zum Thema „Content Usability“ und „Texten für das Web“ gibt es zahlreiche Tipps und Informationen, die die Lesbarkeit von Texten nachweislich verbessern können. Allerdings beziehen sich Studien und Tipps zu dem Thema oftmals auf Gestaltung von längeren Fließtexten sowie auf Formulierungen und Verständlichkeit generell.

Warum aber werden selbst kurze Hinweise so oft nicht gelesen?

Man sollte doch meinen, dass die Nutzer sich für einen kurzen Dreizeiler die Zeit nehmen könnten. Das Problem bei kurzen Hinweisen liegt allerdings weniger in der Textgestaltung oder bei der „Faulheit“ der Nutzer – sondern im Bereich der Wahrnehmung und der Erwartungshaltung der Nutzer. Aus meiner Erfahrung ist die „Hinweis-Ignoranz“ von Nutzern zumeist auf einen oder mehrere der folgenden Gründe zurückzuführen:

  • Hinweise konkurrieren mit vielen anderen Informationen auf der Website: Da gibt es Videos, Grafiken, interaktive Elemente, Chatfunktionen, Animationen … All diese Elemente ziehen die Aufmerksamkeit Ihrer Nutzer auf sich. Ein kleiner Hinweis geht da schnell unter – auch wenn er noch so wichtig ist.
  • Hinweise und Erläuterungen sind der letzte Anker – Nutzer „wurschteln“ sich erst mal durch: In Usability-Tests habe ich schon oft beobachtet, dass Nutzer erst dann damit beginnen, sich Hinweise und Erläuterungstexte durchzulesen, wenn sie schon ein Problem haben – also z. B. nicht mehr weiterkommen. Grundsätzlich ist dagegen gar nichts einzuwenden. Allerdings wäre das Problem oft vermeidbar gewesen, wenn z. B. eine Erläuterung zu einem Prozess direkt gelesen worden wäre. Und Hinweise auf interessante Funktionen oder Optionen werden so oft gar nicht wahrgenommen (der Nutzer bekommt ja nicht zwangsläufig ein Problem, nur weil er den Hinweis auf
    z. B. eine neue Chatfunktion übersehen hat).
  • Nutzer lassen sich eher von Erfahrungen und Erwartungen leiten als von Hinweisen: Da werden Formulare so ausgefüllt, wie man das von anderen Seiten eben so kennt („Telefonnummer ist bestimmt kein Pflichtfeld; ich trag erst mal nix ein.“) und Popups mit Hinweisen schnell wieder geschlossen („… immer diese Werbung!“). Oft habe ich erlebt, dass Nutzer zwar bemerken „dass da was stand“, sie den Hinweis aber nicht lesen. Vielmehr treffen sie Annahmen über dessen Inhalt auf Basis ihrer bisherigen Erfahrungen („Das kenn ich von anderen Shops – da steht dann immer Der Artikel wurde auf den Merkzettel gelegt. Ich nehme mal an, dass das da auch stand gerade. Deshalb hab ich das jetzt nicht so genau gelesen.“). Dumm nur, wenn der Inhalt des Textes leider ein völlig anderer war – vielleicht sogar eine Fehlermeldung.

Was also können Sie tun, damit Hinweise und Erläuterungen mehr Aufmerksamkeit erhalten und richtig verstanden werden?

Möglichkeiten gibt es viele – welche Sie wählen, hängt wie so oft vom Kontext der Nutzung ab und davon, was sie vermitteln wollen und wie wichtig der Hinweis ist. Im Folgenden möchte ich gerne einige Optionen für verschiedene Kontexte aufzeigen.

Die „In Your Face“-Optionen: Farbe, Schriftgröße, Popups

Farbe verwenden

esprit.de Fehlermeldung

Fehlermeldung in roter Schrift – fast schon ein bisschen langweilig, aber wirkungsvoll (Quelle: Esprit.de)

Funktioniert gut für: Seiten, auf denen ansonsten wenig „Ablenkung“ durch viele Farben vorhanden ist.
Das sollten Sie beachten: Halten Sie sich an „gängige“ Standards was die Farbgebung Ihrer Hinweise angeht. Fehlermeldungen und andere sehr wichtige Aspekte dürfen gerne in rot dargestellt werden – bei einem Hinweis wie z.B. „Bitte abonnieren Sie unseren Newsletter“ wäre ich eher vorsichtig… Zudem sollten nur wirklich wichtige Hinweise in einer Farbe dargestellt werden – wenn jeder zweite Satz in rot oder grün hervorgehoben wird, geht die Wirkung verloren.

Schrift vergrößern

puma.de Nulltreffer

Wichtiges in großer Schrift und oberhalb positioniert. Die Nummerierung der nachfolgenden Schritte „führt“ die Nutzer zudem ebenfalls gut durch den angezeigten Text (Quelle: puma.de)

Funktioniert gut für: „Überschriften“ von Hinweisen oder Erläuterungen. Ideal z. B., um eine Erläuterung einzuleiten („Registrieren – So einfach geht’s:“) oder in einem Popup auf etwas Wichtiges hinzuweisen. Nutzer schenken großen Headlines mehr Aufmerksamkeit als kleinen Hinweistexten. Eine Headline in großer Schrift kann also dazu beitragen, die Aufmerksamkeit auch auf die Informationen darunter zu lenken.
Das sollten Sie beachten: Große Headlines funktionieren am besten, wenn sie oben auf einer Seite positioniert werden, um eine Erläuterung einzuleiten. Zwischen Bildern, Videos und vielen anderen Elementen können auch sie schnell untergehen.

Popups verwenden

mexx.de Warenkorblayer

Darstellung im Popup: Hinweis steht deutlich im Vordergrund, alle anderen Inhalte sind ausgegraut (Quelle: mexx.de). Vorsicht ist allerdings geboten, wenn Sie viele Bilder im Layer verwenden – diese können schnell von der eigentlichen Botschaft ablenken. Im obigen Fall passt das Verhältnis aber noch.

Funktioniert gut für: Bestätigungen (z. B. Ablegen eines Artikels im Warenkorb) oder extrem wichtige Hinweise.
Das sollten Sie beachten: Wie schon angedeutet – solche Hinweise werden von Nutzern leicht mit „Werbung“ verwechselt; das ständige „Wegklicken“ kann schnell als störend empfunden werden. Dementsprechend sollte ein Popup nur für wichtige Bestätigungen genutzt werden oder für wichtige Fehlermeldungen. Wichtig ist hier, dass der Nutzer schon anhand der Schriftfarbe und idealerweise durch ein Icon darauf hingewiesen wird, was der Inhalt der Meldung ist.

Dezent und wirkungsvoll – Icons und „Einblenden“ von Hinweisen

Unterstützung durch Icons

notebooksbilliger.de Warenkorblayer

Grüner Haken zeigt: Alles ok! Das Lesen des dazugehörigen Hinweises wird damit unnötig (Quelle: notebooksbilliger.de)

Funktioniert gut für: Einfache Hinweise zum Systemstatus wie z. B. Bestätigungen von Aktionen oder Hervorhebungen von Fehlermeldungen. Ein deutliches Info-Icon vor einem Erläuterungstext kann diesen ebenfalls hervorheben.
Das sollten Sie beachten: Gängige und aussagekräftige Icons verwenden, die die Botschaft des Textes entweder in Kurzform zusammenfassen oder aber deutlich machen, dass man den Hinweis besser lesen sollte (z. B. Ausrufezeichen).

Hinweise und Erläuterungen „erscheinen“ lassen
Definitiv eine meiner „Lieblingsoptionen“, um Hinweise in den Fokus der Nutzer zu rücken.

hotel.de

Hinweis auf Eingabeoptionen für das Suchfeld erscheint bei Klick in das Feld (Quelle: hotel.de).

mirapodo.de

Für eingeloggte Nutzer ist bei Mirapodo.de eine Größenempfehlung zu manchen Schuhen hinterlegt. Die Empfehlung erscheint …

mirapodo.de (2)

… sobald eine Größe ausgewählt wurde und zwar direkt über dem Eingabefeld für die Größe.

Funktioniert gut für: Kontextsensitive Hinweise dazu, wie bestimmte Eingaben getätigt werden müssen oder um auf bestimmte Funktionalitäten hinzuweisen. Ein klassisches Beispiel dafür sind Fehlermeldungen bei Inline-Validierung – aber auch als Bedienhinweis ist diese Art der Darstellung gut geeignet, wie die Beispiele zeigen. Denn: Elemente, die sich bewegen, werden von Nutzern schneller und besser wahrgenommen. Daher wird ein Hinweis, der „erscheint“, eher gesehen als einer, der schon von Beginn an dort platziert ist.
Das sollten Sie beachten: Diese Hinweise sollte immer in unmittelbarer Nähe des relevanten Eingabefeldes erscheinen – ansonsten bieten sie keinen Mehrwert für die Nutzer bzw. werden wieder übersehen.

Trotz allem: Selbstbeschreibungsfähigkeit nicht vernachlässigen
Grundsätzlich gilt: Hinweise sollten die Nutzer unterstützen, aber nie die Selbstbeschreibungsfähigkeit der Seite ersetzen. Anstatt jeden Vorgang mit farbigen Hinweisen in bunten Pop-ups zu erläutern, sollte die Seite generell intuitiv bedienbar sein. Wenn Sie dann noch die zentralen Hinweise und Erläuterungen so gestalten, dass Sie schnell und einfach wahrgenommen werden ohne die Nutzer zu stören, ist alles perfekt. Ob dieses Zusammenspiel gelungen ist, lässt sich beispielsweise im Rahmen eines Usability-Tests inklusive Eyetracking sehr gut ermitteln.

Kennen Sie weitere, gute Beispiele für eine Integration von Hinweisen und Erläuterungen auf einer Website? Ich freue mich auf eine spannende Diskussion!

5 Gedanken zu „„Bitte lesen Sie jetzt!“ – Wie Sie Ihre Nutzer dazu bringen, Hinweise und Erläuterungen zu lesen

  1. Pingback: Links der Woche: Praxistipps gegen Warenkorbabbrüche, Onpage-SEO: Die wichtigsten Rankingfaktoren, » Take-me-to-auction

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

  3. Pingback: Akzeptanz von Paid Content – es geht aufwärts [5 Lesetipps] | Handelskraft – Das E-Commerce und Social-Commerce-Blog

  4. Pingback: Top-Themen der letzten 30 Tage | Usabilityblog.de

  5. Frieder Loch

    Guten Morgen,

    ich finde, dass sich Ihre Empfehlungen leider zu sehr der Bekämpfung von Symptonen widmen. Was mich stört sind gerade Hinweise, die oft aussagen „Alles ist gut.“ Ähnlich geht es mir mit den vielen „Sind Sie sicher, …“ Popups.

    Ein wichtiger Teil der Antwort auf die Frage wie man Hinweise besser darstellt sollte, meiner Meinung nach, sein sich zu überlegen ob dieser Hinweis überhaupt notwendig ist und nicht eher eine Symptombekämpfung darstellt und auf eine Schwäche im Design hinweist.

    Ich fände eine Diskussion über die Punkte, die sie in ihrem letzten Absatz angedeutet haben, interessant und wichtig. Wie könnte zum Beispiel der Entwurf der esprit.de Suche so verbessert werden, dass der rote Hinweise generell nicht mehr notwendig ist? Welchen Mehrwert bietet dem User der Hinweis, der beim hotel.de Suchfeld angezeigt wird?

    Viele Grüße,
    Frieder Loch

    Antworten

Schreibe einen Kommentar

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