Mobile Web Navigation – 4 exklusive Vorab-Erkenntnisse der eResult Grundlagenstudie

Noch immer machen Nutzer mit mobilen Websites viele negative Erfahrungen. Laut einer Studie des BVDW sind die häufigsten Gründe dafür mit 57,9 % fehlende Übersichtlichkeit und mit 36,4 % mangelnde Benutzerfreundlichkeit. Die Navigation spielt dabei eine zentrale Rolle, denn gerade diese stellt auf Smartphones eine Herausforderung dar.

Aus diesem Grund führten wir im März eine Grundlagenstudie durch, um die aktuell verbreiteten Lösungsansätze mit 13 Smartphone-Nutzern im Usability-Labor zu überprüfen. Vier ausgewählte Websites wurden von den Probanden genutzt und bewertet, um die unterschiedlichen Navigationsmechanismen auf Stärken und Schwächen zu überprüfen: tagesschau.de, obi.de, huk24.de und visitengland.de. Die komplette Studie wird in einer Woche kostenlos veröffentlicht – aber schon heute gibt es hier 4 interessante Auszüge aus den Ergebnissen.

Icons zur Kennzeichnung der Hauptnavigation reichen nicht aus

Abb. 1: Der Aufruf der Hauptnavigation auf huk24.de ist nicht für alle Nutzer verständlich

Abb. 1: Der Aufruf der Hauptnavigation auf huk24.de ist nicht für alle Nutzer verständlich

Ein Symbol mit drei horizontalen Linien, auch als „Hamburger-Icon“ bezeichnet, kennzeichnet auf vielen mobilen Websites den Zugang zur Hauptnavigation. In unseren Tests zeigte sich, dass zwar viele, jedoch bei weitem nicht alle Probanden damit vertraut waren. Auf huk24.de schafften einige es nicht ohne Hilfestellung, die Navigation über den Button links oben aufzurufen (siehe Abb. 1). Im Vergleich dazu überzeugte die klare Beschriftung der entsprechenden Schaltfläche mit „Menü“, die auf anderen Seiten verwendet wird. Auf diese Weise wurde den Probanden sofort klar, was sich dort verbirgt. Wenn Sie also nicht gerade eine spezielle, besonders versierte Zielgruppe haben oder auf Lerneffekte vertrauen können, so sollten Sie Ihre mobile Navigation niemals nur über ein Icon zugänglich machen.

Mehrere Aktionen zu einem Menüpunkt sind nicht verständlich

Abb. 2: Die Nutzer verstehen die besondere Funktion des Plus-Icons auf visitengland.de nicht

Abb. 2: Die Nutzer verstehen die besondere Funktion des Plus-Icons auf visitengland.de nicht

Eine interessante Herausforderung ist es, den Nutzern zu ermöglichen, sowohl ein Untermenü zu einem Menüpunkt als auch die Oberseite selber aufrufen zu können. Einige Seiten, in unserem Test etwa visitengland.de, versehen deshalb den Menüpunkt mit zwei Funktionen: Der Titel des Menüpunkts öffnet die Oberseite, ein nebenstehendes Icon dagegen klappt das Untermenü auf. Diese Funktionalität war für die Probanden im Test nicht verständlich. Sie erwarteten ganz klar, dass ein Menüpunkt nur eine Aktion durchführt, egal welche Stelle genau gedrückt wird. Die Möglichkeit, noch etwas anderes als die zuerst entdeckte Aktion aufzurufen, bemerkten sie überhaupt nicht. Vermeiden Sie also unbedingt, mehrere unterschiedliche Klickziele in einem Menüpunkt zu integrieren. Die komplette Fläche muss dieselbe Funktion auslösen.

In Drilldown-Menüs muss Browser-Back unterstützt werden

Abb. 3: Im Drilldown-Menü auf obi.de verwenden die Nutzer Browser-Back

Abb. 3: Im Drilldown-Menü auf obi.de verwenden die Nutzer Browser-Back

Bei komplexen Seiten mit vielen Navigationsebenen wird häufig ein so genanntes Drilldown-Menü verwendet, das ein schrittweises Navigieren auf tiefere Ebenen ermöglicht, ohne die Seite jeweils neu laden zu müssen. Anders als bei aufklappenden Untermenüs werden die oberen Navigationsebenen dabei nicht mehr angezeigt. Es zeigte sich in unseren Tests, dass dieses Navigationsprinzip funktioniert, jedoch noch Schwächen in der Rückwärts-Navigation besitzt. Auf obi.de konnten die Probanden zwar problemlos über „zurück“ nach oben auf die vorherige Ebene wechseln, versuchten dies jedoch auch häufiger über die Browser-Back-Funktion (siehe Abb. 3). Entgegen ihrer Erwartungen führte diese jedoch zur vorherigen Seite und schloss somit das Menü. Vermeiden Sie also unbedingt Probleme mit Browser-Back, indem sie die Navigation innerhalb des Menüs darüber zulassen. Nur so können Sie verhindern, dass Ihre Nutzer im Zweifelsfall versehentlich die Website verlassen.

Zusätzliche Navigationsmenüs verwirren die Nutzer

Abb. 4: Auf tagesschau.de sorgt die „ARD Navigation“ für Verwirrung bei den Nutzern

Abb. 4: Auf tagesschau.de sorgt die „ARD Navigation“ für Verwirrung bei den Nutzern

Es gibt viele mögliche Gründe, warum eine weitere Navigation zusätzlich zum Hauptmenü notwendig und sinnvoll erscheint – bei tagesschau.de etwa für den Wechsel zu anderen ARD-Seiten. Es zeigte sich bei diesem Beispiel jedoch, dass den Probanden der Unterschied zwischen dem eigentlichen „Menü“ und der „ARD Navigation“ nicht deutlich wurde (siehe Abb. 4). Sie waren verwirrt durch die konkurrierenden, ähnlich benannten Schaltflächen und verwendeten teilweise die falsche Navigation. Lassen Sie es auf Ihrer Website in keinem Fall zu solchen Situationen kommen – denn Nutzer sind sehr schnell weg, wenn die Orientierung verloren geht. Gestalten Sie deshalb alternative Navigationseinstiege so, dass sie klar von der Hauptnavigation zu unterscheiden sind und nicht mit ihr konkurrieren.

Die kostenlose Studie mit 22 Guidelines erscheint in einer Woche

Im kompletten Studienband erklären wir alle Stärken und Schwächen der 4 untersuchten Seiten im Detail. Darüber hinaus geben wir Ihnen aber auch Empfehlungen – 22 Guidelines zur besseren Navigation und Orientierung auf Ihrer mobilen Website.

Veröffentlicht wird die Studie in einer Woche im Downloadbereich auf eresult.de und natürlich auch hier im Usabilityblog. Seien Sie gespannt!

Ein Gedanke zu „Mobile Web Navigation – 4 exklusive Vorab-Erkenntnisse der eResult Grundlagenstudie

  1. Pingback: 22 Guidelines zu Mobile Web Navigation - Kostenlose Ergebnisse der eResult Grundlagenstudie - Usabilityblog.de

Schreibe einen Kommentar

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