So schlecht funktionieren Hamburger-Menüs und versteckte Navigation

Hamburger-Menüs sind lecker

Denis Potschien

Denis Potschien ist seit 2005 freiberuflich als Kommunikationsdesigner tätig, seit Anfang 2010...

Kleine Displays, wenig Platz – auf Smartphones ist es immer wieder eine Herausforderung, Inhalt und Navigation einer Website unterzubringen. Daher hat es sich mittlerweile etabliert, die Navigation auszublenden und nur ein Hamburger-Icon zu platzieren, welches per Tap die Navigation einblendet. Schon lange wird darüber diskutiert, ob es sinnvoll ist, etwas derart wichtiges wie die Navigation zu verstecken. Die Nielsen Norman Group, die unter anderem Benutzerverhalten erforscht, hat in einer Studie nun herausgefunden, wie sich das Nutzerverhalten bei sichtbaren und per Hamburger-Menüs erreichbaren Navigationsansätzen unterscheidet.

Hamburger-Menüs sind lecker

179 Teilnehmer, sechs Websites

Ziel der Studie war es herauszufinden, wie häufig auf einer Website die Navigation gefunden, beziehungsweise verwendet wurde. Dazu mussten 179 Teilnehmer sechs verschiedene Websites auf unterschiedlichen Geräten aufrufen und nutzen. Dabei hat etwa die Hälfte der Teilnehmer die sechs Websites nur auf einem Desktopgerät aufgerufen, während die andere Hälfte nur auf Smartphones unterwegs war.

Kombinierte Navigation bei der BBC

Bei den Websites handelt es sich um die von 7digital, BBC, Bloomberg Business, Business Insider UK, Supermarkt HQ und Slate. Jede Website hat eine anders gestaltete Navigation. Unterschieden wurde zwischen sichtbarer Navigation, bei der alle Menüpunkte stets erkennbar im Kopf oder Seitenbereich aufgelistet waren, und versteckter Navigation, bei der die Menüpunkte erst über ein Hamburger-Menü oder einen per „Menu“ beschrifteten Button erreicht werden konnten. Außerdem gab es noch eine Kombination beider Varianten, bei der einige Menüpunkte sichtbar waren, während andere über einen „More“-Button als Dropdown-Liste dargestellt wurden.

So ist die Navigation von 7digital auf Desktopgeräten immer sichtbar, während sie auf Smartphones über ein „Menu“-Icon eingeblendet wird. Die BBC-Website verwendet auf dem Desktop eine kombinierte Navigation. Während dort die wichtigsten Menüpunkte sichtbar sind, werden weitere Auswahlmöglichkeiten über ein Dropdown-Menü dargestellt.

Nur per Hamburger-Menü erreichbare Navigation

Nur per Hamburger-Menü erreichbare Navigation

Die Website von Business Insider hingegen setzt sowohl in der Desktop- als auch in der Mobilansicht auf ein Hamburger-Menü, über welches die Navigation erreichbar ist. Im Übrigen gab es keine Website, bei der sowohl in der Desktop- als auch in der Mobilansicht die Navigation immer sichtbar war. Das dürfte vor allem daran liegen, dass es sehr unüblich ist, auf Mobilgeräten die Navigation immer sichtbar darzustellen.

Sichtbare oder teils sichtbare Navigation öfter genutzt

Bei den Teilnehmern, die per Desktopgerät unterwegs waren, wurde die versteckte Navigation nur von 27 Prozent genutzt, während die sichtbare oder kombinierte Navigation von 48 beziehungsweise 50 Prozent genutzt wurde. Auf Mobilgeräten haben nur 57 Prozent die versteckte und 86 Prozent die kombinierte Navigation verwendet.

Sichtnare und nicht sichtbare Navigation bei 7digital

Sichtbare und nicht sichtbare Navigation bei 7digital

Auch bezüglich der Zeit, die zum Navigieren gebraucht wurde, liegt die versteckte Navigation hinten. Während die Teilnehmer auf Desktopgeräten mit versteckter Navigation 31 Sekunden mit der Navigation beschäftigt waren, waren es bei Websites mit sichtbarer Navigation nur 26 Sekunden. Interessanterweise hat die kombinierte Navigation mit 23 Sekunden am besten abgeschnitten.

Kennst du unser E-Book-Bundle? Spare jetzt 6,99 €!

E-Book Bundle von Andreas Hecht

Auf Mobilgeräten ist der Unterschied zwischen versteckter (26 Sekunden) und kombinierter Navigation (24 Sekunden) geringer. Das dürfte daran liegen, dass es Nutzer auf Mobilgeräten eher gewohnt sind, die Navigation über ein Hamburger-Menü zu erreichen, während auf Desktopgeräten die Hamburger-Menüs nicht so verbreitet sind.

Fazit

Im Ergebnis lässt sich feststellen, dass die versteckte Navigation weniger genutzt wurde, mehr Zeit in Anspruch nahm und auch deutlich weniger Inhalt gefunden wurde. So wurden auf Desktopgeräten nur 54 Prozent und auf Mobilgeräten nur 64 Prozent des Inhalts, der von den Teilnehmern aufgerufen werden sollte, auch tatsächlich gefunden.

Nicht sichtbare Navigation bei Bloomberg

Am besten schnitt die kombinierte Navigation ab, die auf 80 Prozent bei Desktop- und 85 Prozent bei Mobilgeräten kommt. Selbst die komplett sichtbare Navigation liegt auf Desktopgeräten mit 77 Prozent noch drei Prozentpunkte hinter der Kombi-Navigation.

Wenn immer möglich, solltest du also auf eine versteckte Navigation verzichten. Idealerweise zeigst du einige wenige wichtige Menüpunkte immer an und versteckst weniger wichtige Punkte über ein „Mehr“-Icon, welches alle weiteren Punkte zum Beispiel als Dropdown-Liste darstellt.

Die kompletten Ergebnisse der Studie mit zahlreichen Diagrammen und tiefer gehenden Erklärungen findest du auf der Website der Nielsen Norman Group.

(dpe)

Denis Potschien

Denis Potschien ist seit 2005 freiberuflich als Kommunikationsdesigner tätig, seit Anfang 2010 im Kreativkonsulat in Iserlohn, einem Büro für Gestaltung und Kommunikation. Dort betreut er kleine und mittelständische Unternehmen ebenso wie kommunale Körperschaften und Organisationen aus Südwestfalen und dem Ruhrgebiet.

Als Webdesigner und -entwickler gehören HTML5 und CSS3 zu seinen Kernthemen, weshalb er dazu 2013 ein Buch geschrieben hat. „Pure HTML5 und CSS3“ richtet sich an alle, die Vorkenntnisse haben, sich aber bisher mit HTML5 und CSS3 nicht oder nur am Rande beschäftigt haben.

Hinterlasse einen Kommentar

3 Kommentare auf "So schlecht funktionieren Hamburger-Menüs und versteckte Navigation"

Benachrichtige mich zu:
avatar
Sortiert nach:   neueste | älteste | beste Bewertung
SiGa
Gast

“Idealerweise zeigst du einige weniger wichtige Menüpunkte immer an und versteckst weniger wichtige Punkte über ein „Mehr“-Icon, welches alle weiteren Punkte zum Beispiel als Dropdown-Liste darstellt.”
Sollte das nicht heißen: “Idealerweise zeigst du einige wichtige Menüpunkte immer an …” ?

Dieter Petereit
Dr. Web

Ein R zuviel. Danke für den Hinweis.

Andreas Hecht
Gast

Hamburger-Menü. Jetzt habe ich echt was dazu gelernt. Jahrelang benutzt und implementiert und erst jetzt weiß ich durch Dich, wie das Ding heißt. Man lernt halt nie aus. Übrigens, das Menü auf dem Beitragsbild gefällt mir besser:-)

Davon abgesehen überlege ich, ob ich meine Hamburger-Menüs nicht ergänzen sollte, die Studie ist ja sehr interessant. Vor allem, wenn man etwas als benutzerfreundlich erachtet, was in der Realität nicht stimmt.