Het menu is de plattegrond van je website. Werkt het goed, dan merkt niemand het op; werkt het niet, dan raken bezoekers verdwaald en haken ze af voordat ze vinden wat ze zoeken. Een doordachte navigatie is daarom geen detail maar het verschil tussen een site die rust uitstraalt en een die irriteert. Deze gids behandelt het hoofdmenu, submenu's, mobiele navigatie en de logica eronder, zodat je een menu opbouwt dat bezoekers als vanzelf naar de juiste pagina leidt.
De functie van een menu
Een menu heeft een simpele taak: de bezoeker laten zien waar hij kan komen en hem daar snel brengen. Dat klinkt eenvoudig, maar het wordt ingewikkeld zodra een site groeit en alles een plek wil. Het menu is de zichtbare vertaling van je structuur; als die structuur klopt, volgt het menu vanzelf.
Daarom begint een goed menu niet bij het ontwerp maar bij de ordening van je pagina's, beschreven in de gids over informatiearchitectuur voor een MKB-site. Pas als helder is welke pagina's er zijn en hoe ze samenhangen, kun je beslissen wat in het menu hoort.
Het hoofdmenu opbouwen
Het hoofdmenu toont de belangrijkste paden, niet alle pagina's. Vijf tot zeven items is voor de meeste sites een prettig maximum: genoeg om de site te dekken, weinig genoeg om in een oogopslag te overzien. Wat het zwaarst telt voor je doel, krijgt de meest prominente plek.
- Beperk het aantal items. Liever een paar duidelijke keuzes dan een rij die de bezoeker moet uitlezen.
- Zet de actie apart. De belangrijkste vervolgstap, zoals contact, mag opvallen ten opzichte van de rest.
- Houd de volgorde logisch. Plaats items in de volgorde waarin de bezoeker ze waarschijnlijk nodig heeft.
De praktische aanpak hiervan werk ik uit in een navigatiemenu opbouwen.
Labels die meteen duidelijk zijn
Een menu-item is alleen nuttig als de bezoeker weet wat erachter zit. Heldere, gangbare labels werken altijd beter dan creatieve of interne termen. Iemand die diensten zoekt, klikt op Diensten, niet op een verzonnen woord dat alleen binnen je bedrijf betekenis heeft.
Gebruik de taal van je bezoeker, niet die van jezelf. Dat sluit aan op de gedachte uit de gids over een dienstenpagina overtuigend opbouwen: herkenning begint bij woorden die kloppen. Korte, beschrijvende labels helpen bovendien je vindbaarheid.
Submenu's en diepte
Heb je meer pagina's dan in een hoofdmenu passen, dan kunnen submenu's helpen om samenhangende pagina's te groeperen. Maar voorzichtigheid is geboden: elke extra laag is een extra drempel. Hoe dieper je structuur, hoe meer klikken een bezoeker nodig heeft en hoe groter de kans dat hij afhaakt.
Voor de meeste MKB-sites zijn een of twee niveaus genoeg. Een vlak, overzichtelijk menu werkt vaak beter dan een diep vertakt systeem. De afweging tussen scrollen en klikken, en wanneer welk werkt, behandel ik in scrollen versus klikken.
Mobiele navigatie
Op een telefoon is er geen ruimte voor een uitgespreid menu, dus vouwt het samen. De hamburgerknop is gangbaar, maar verbergt je navigatie achter een klik, wat belangrijke pagina's minder zichtbaar maakt. Soms is het beter om de belangrijkste items direct te tonen en de rest achter een knop te zetten.
Belangrijk is dat het mobiele menu makkelijk te bedienen is met de duim: grote raakvlakken, voldoende ruimte en een duidelijke manier om het te sluiten. Waarom een mobiel menu meer is dan een hamburger, lees je in een mobiel menu is meer dan een hamburger. Dit hangt samen met de gids over responsive ontwerp van de grond af.
De bezoeker georienteerd houden
Goede navigatie stopt niet bij het menu. De bezoeker moet ook tijdens het rondkijken weten waar hij is. Een gemarkeerd menu-item voor de huidige pagina, broodkruimels die het pad tonen, en een footer die de belangrijkste links herhaalt, houden mensen georienteerd.
De footer wordt daarbij vaak onderschat, terwijl het de tweede plek is waar mensen naar links zoeken, behandeld in de footer wordt vaak vergeten. Samen vormen menu, broodkruimels en footer een vangnet dat voorkomt dat een bezoeker zich verloren voelt.
Zelf doen of uitbesteden?
Voor een kleine site met een paar pagina's kun je een menu prima zelf bedenken; het is vooral een kwestie van logisch ordenen en duidelijke labels kiezen. Naarmate een site groeit, wordt het lastiger om overzicht en eenvoud te bewaren zonder belangrijke pagina's te begraven. Wie het laat ontwerpen, krijgt een navigatie die meegroeit en die op elk apparaat soepel werkt. Bekijk de dienst UX en gebruiksvriendelijkheid of webdesign, of neem vrijblijvend contact op.
Veelgestelde vragen
Voor de meeste sites is vijf tot zeven hoofditems een prettig maximum. Meer maakt het menu druk en lastig te overzien, zeker op mobiel. Heb je meer pagina's, groepeer ze dan onder logische hoofditems in plaats van alles los in het hoofdmenu te zetten.
Alleen als je echt meer pagina's hebt dan in een hoofdmenu passen. Submenu's helpen om samenhangende pagina's te groeperen, maar te veel niveaus maken het onoverzichtelijk. Voor een kleine site zijn submenu's vaak overbodig; een vlak menu werkt dan beter.
Het is gangbaar, maar niet altijd de beste keuze. Een hamburger verbergt de navigatie achter een klik, wat belangrijke pagina's minder zichtbaar maakt. Voor een eenvoudig menu kun je de belangrijkste items soms beter direct tonen, eventueel naast een knop voor de rest.
Ja. Een logisch menu met duidelijke labels laat zoekmachines zien hoe je site is opgebouwd en welke pagina's belangrijk zijn. Beschrijvende menu-items en een nette structuur dragen bij aan zowel een prettige ervaring als een betere vindbaarheid.
Verder in de kennisbank: Informatiearchitectuur voor een MKB-site · Een homepage die meteen werkt · Webdesign: de complete gids