Hamburger menu: een noodzakelijk kwaad?

Hamburger menu: een noodzakelijk kwaad? 3 redenen om het icoontje te heroverwegen.

Het hamburger menu. Je herkent haar aan de drie horizontale streepjes rechts- of linksboven aan je scherm. Als je op mobiel zit tenminste, en dat is hoogst waarschijnlijk. Sinds 2018 bezoeken we meer websites op onze smartphones dan desktop. 52,8 procent om precies te zijn.

Ontwerpers kregen met de smartphonegolf een probleem voor de kiezen.”Hoe implementeren we ons uitgebreide menu in een mobiel ontwerp?”. Het antwoord op die vraag bleek al een aantal jaren geleden te zijn beantwoord: verstoppen onder een icoontje. Ontwerper Norm Cox ontwierp in zijn hoogtijdagen bij Xerox het hamburger menu als eerste. Latere implementatie van het hamburger icoon zagen we in een app van Apple op iOS. Het icoontje groeide(zeker tijdens de minimalisme trend) uit tot het standaard menu-icoon op mobiele sites en apps. Alles leek goed en wel.

Weinig interactie met het hamburger menu?

Dankzij de vloedgolf aan gebruikersinzichten kwam een probleem aan het licht. De interactie op mobiele sites is een stuk lager. Hoe kan dit?  De lage interactie heeft verschillende oorzaken. De drie voornaamste zal ik hieronder uitlichten:

  • Uit het oog, uit het hart;
  • Het kost interactie;
  • Anatomie.

Uit het oog, uit het hart

Verschillende ontwerpers, zoals LukeW en zijn team, merkten dat de ontwerpen na de implementatie van een hamburger menu meer dan 50 procent minder interactie kregen. Waarom is dit? Het blijkt dat gebruikers meer interactie hebben wanneer ze weten wat er te doen is. Op het eerste oogopslag is het hamburger menu 1 interactie, terwijl een volledig menu vaak meer dan vijf interacties op het eerste gezicht.  Je haalt je belangrijkste navigatie tool uit het zicht. Het is niet meer zichtbaar. Alleen het menu knopje nog. Facebook is daarom afgestapt van het hamburgermenu.

Het kost interactie

Met de implementatie van het hamburger menu kost het de gebruiker een klik extra om ergens te komen. Ik hoor je denken: twee klikken in plaats van één is niet zo erg toch? Je hebt gelijk. Maar wat als je bezoeker herhaaldelijk op je website komt? Die ene extra klik is altijd minder snel dan wanneer die gebruiker meteen ziet waar hij op moet klikken. De internetgebruiker is ontzettend ongeduldig. Stel die niet op de proef.

Anatomie

Als je dit op mobiel leest, rust waarschijnlijk je telefoon in je handpalm of op je vingers. De binnenkant van je pinkvinger bedekt de oplaadpoort, zodat je telefoon niet uit je hand glijdt. Je duim zweeft boven je schermpje,wachtend op de volgende scrol.

de duim zone hamburger menu

Als mobiele gebruiker heb je geen muis, maar een duim en een wijsvinger. Daar navigeer je mee. De reikwijdte van die vinger verschilt wel persoon, maar gemiddeld genomen is het lastig om met je duim de linkerbovenhoek te bereiken. Probeer het eens als je op mobiel zit.

Het kost eenmaal meer moeite om met één hand het menu te navigeren op mobiel.

 

Het is dus vrij duidelijk dat ux-designers geen fan zijn van het hamburger menu. Toch zien we het overal terug, zelfs op deze website. Dit komt mede doordat de industrie het al veelal geaccepteerd heeft als de standaard. Mits je veel geld en middelen tot je beschikking hebt, kun je bijvoorbeeld kiezen voor een bodem navigatie menu. Voor de rest van ons is het hopen dat softwarebouwers zoals WordPress en themabouwers inzien dat het hamburger menu niet de best optie is voor gebruikersgemak.

Wil je meer weten over ux-design? Bekijk mijn werkstuk over ux-design, waar nog veel meer onderwerpen aan bod komen.

 

 

 

wat is ux designmobile first anno 2019