1. Home »
2. Blog »
3. Dag van het hamburgermenu

Geschreven door Jasmijn Pols op dinsdag 28 mei 2019

Hoera, het is vandaag de Dag van de Hamburger!¹ Of je nu gek bent op een ouderwetse fabrieksburger of liever de vegetarische variant in de inductiepan gooit, het is feest vandaag! En wij vieren mee. Het hamburgermenu is een veelbesproken onderwerp bij Holiday Media. En dan hebben we het niet over de lijst die je bij een fastfoodketen voorgeschoteld krijgt maar die drie horizontale streepjes die als menu navigatie dienen in een website.

Smullen de bezoekers er ook van?

Het icoontje met 3 streepjes staat symbool voor de hamburger met een stuk vlees ertussen. Als je met je ogen knijpt kun je het vast zien. Al staan die 3 streepjes eigenlijk voor een lijstje met opties, maar dat klinkt natuurlijk minder lekker. Deze vorm van navigatie vind je meestal rechtsboven aan een website. Alle menu items zijn achter deze streepjes verstopt.

Wat is er nu zo lekker aan een hamburgermenu?

Samenhang in weergave website

Het hamburgermenu werd voorheen alleen op smartphones en tablets ingezet wegens ruimtebesparing en het gebruik op een klein scherm. Het bleek al gauw dat deze oplossing voor de desktop weergave ook een goed idee was. Helemaal door de opkomst van de responsive websites waarbij er één weergave is voor alle apparaten. De toename van internetgebruik op smartphones dwingt designers dan ook om anders vorm te geven, namelijk ‘Mobile first’. Om een uniforme uitstraling in de website te behouden wordt er vaak gekozen om het hamburgermenu ook door te voeren voor de desktop weergave. Bezoekers raken ook steeds meer gewend aan het menu doordat grote spelers zoals Facebook en Spotify hier al gebruik van maken.

Overzicht en focus

De focus op webdesign ligt steeds meer op content en het uitstralen van de boodschap in de juiste sfeer. Daarbij is een overvol menu met veel submenu's niet bevorderlijk. Als je website gericht is op een visuele inhoud, zoals grote foto's of gebruik van video, is een hamburgermenu een zeer functionele oplossing. Zo kun je de bezoeker een menu aanbieden zonder dat dit ten koste gaat van de inhoud. Hierdoor leg je de focus op de juiste plekken en houd je de website overzichtelijk.

Wat als een hamburger menu niet smaakt?

Ik kan het menu niet vinden?

Al wordt een hamburgermenu steeds vaker gebruikt, komt het nog geregeld voor dat een bezoeker zich suf zoekt om verder te navigeren. Mensen weten niet wat het ‘hamburgermenu’ doet. Het icoon van drie horizontale strepen vertelt niet duidelijk wat een gebruiker kan verwachten als je erop klikt. Dit zou in één oogopslag duidelijk moeten zijn. Het hangt daarnaast deels af van je doelgroep. Een pensionado zal er meer moeite mee hebben om een hamburgermenu te gebruiken dan een puberbrein. Je wilt natuurlijk voorkomen dat frustratie op je website zorgt voor gebruiksonvriendelijkheid en vermindering van je conversie.

Het is gebruikelijk om aanpassingen eerst te testen voor deze definitief worden doorgevoerd. Dit wordt gedaan door een A/B splittest. Het webbedrijf Exis concludeerde enkele jaren geleden dat de klikratio zo'n 20% hoger is wanneer ze het ‘hamburger’ icoon vervangen door het woord ‘menu’.² Dus het letterlijk benoemen van de functie is voor ene bezoeker duidelijker dan het tonen van alleen een icoon.

Het tegenargument is dat het steeds gebruikelijker is om iconen voor een menu te gebruiken. Dat door de jaren heen de bezoeker meer bekend is geraakt met uitklapbare menu's omdat dit veel gebruikt wordt in apps. In een A/B test van booking.com bleek het verschil tussen het hamburger icoon en het woord "menu" verwaarloosbaar.³

Meer clicks nodig voor informatie

Het draait online allemaal om kliks. Hoe meer des te beter. Helemaal om het voortraject zoals via een advertentie. Zodra de bezoeker op je website terechtkomt, wil je dat hij zo min mogelijk hoeft te klikken of te scrollen om de gewenste informatie te vinden. Een hamburgermenu zorgt voor minimaal een extra klik en dit heeft geen positief effect op de gebruikservaring.

Alle vingers omhoog voor een hamburger?

Laten we eens rondkijken, wie doet er mee en wat valt ons daaraan op.

Vliegtickets.nl kiest voor een tussenoplossing. Veel gebruikte items uitgelicht en de rest achter het hamburgermenu. Zo kun je de meest gebruikte pagina's extra onder de aandacht brengen en de rest weglaten.

NS plaats alle items onder het hamburgermenu, al bieden ze wel de mogelijkheid om in de zoeker buiten het menu informatie vinden door middel van zoekwoorden.

Vacanceselect maakt gebruik van een hamburgermenu die zich rest van de pagina naar de zijkant schuift bij openen.

T-mobile kiest voor een mega menu waarbij per onderdeel kolommen worden getoond met extra navigatie mogelijkheden.

Op mobiel

De mobiele weergaven van deze websites hebben allemaal een hamburger icoon, waarbij T-mobile ervoor kiest om deze te verduidelijken met de tekst "menu" en Vliegtickets.nl juist voor een minder herkenbare variant gaat met 2 frietjes.

Conclusie

Is het zo zwart wit als een hamburger ja of nee? Absoluut niet, er is ook een tussenoplossing mocht je de overstap te rigoureus vinden. Hieronder heeft het bedrijf Growthhackers⁴ een test gedaan met een standaard hamburgermenu tegenover een hamburgermenu in combinatie met 3 hoofdcategorieën die direct naar een detailpagina doorlinken. Daaruit bleek dat versie B beter converteert met ruim 29%.

Eigenlijk geldt het bij alle aanpassingen die je doet op je website dat het goed is om te bedenken op welke doelgroep je je pijlen richt. Wil je een moderne en jonge aanpak met focus op content en sfeer of ga je voor duidelijkheid en een klassieke weergave. Wat voor de ene website werkt biedt niet de garantie voor alle websites.

Met een mobile-first opzet dien je de vereenvoudiging te omarmen en dit toe te passen op je ontwerp, zowel op inhoud als op navigatie. Daarbij is het goed de voors en tegens af te wegen van een verandering of toevoeging. Ook je tanden zetten in een heerlijk hamburgermenu? Wij vertellen je graag meer!