Verbeter de User Experience van je website navigatie met deze #10 tips

Een heldere navigatie zorgt ervoor dat bezoekers snel de informatie kunnen vinden die ze nodig hebben. Is het menu onduidelijk of onoverzichtelijk? Dan haken je bezoekers sneller af. Wat kun je hieraan doen? We geven je een aantal tips!

6 min leestijd

We beginnen bij het begin: de navigatiestructuur van de website

Eerst even het geheugen opfrissen: Bij User Experience (UX) gaat het om de ervaring (emotie en houding) die een gebruiker heeft met de interactie op een website of platform.

Om de UX te optimaliseren is het belangrijk dat de bezoeker niet teveel moet doorklikken om te vinden wat hij/zij zoekt.

Er zijn onderzoeken die suggereren dat een bezoeker binnen 3 klikken moet kunnen vinden wat hij/zij zoekt. Dat is een goed streven, maar of dat mogelijk is hangt ook af van de complexiteit van de taak en de structuur van de website.

Wees geen copycat

Jammer genoeg zien we dat websites en navigaties vaak worden nagemaakt omdat ze er ‘goed’ uitzien. Maar dat wil niet zeggen dat het werkt voor jouw doelgroep of type product. Om te achterhalen wat goed aansluit bij jouw doelgroep of type product kun je de Card sorting techniek gebruiken.

Tip #1 Plan jouw navigatiestructuur met Card sorting

De beste manier om een gebruikersvriendelijk menu te ontwikkelen is aan de hand van Card sorting.

Card sorting is een makkelijke methode om te achterhalen hoe bezoekers op een eenvoudige manier de juiste informatie kunnen vinden zonder al te veel te zoeken.

Het is een User Research techniek die op verschillende manieren uitgevoerd kan worden.

  • Open Card sorting: Je maakt vooraf verschillende kaarten en geeft deze aan je deelnemers. Zij schrijven – afhankelijk van het aanbod – categorieën, producten en/of services op. Vervolgens sorteren ze de kaarten en groeperen ze dit.
  • Gesloten Card sorting: Het verschil met Open Card sorting is dat er op de kaarten al categorieën/producten/services vermeld zijn. Je vraagt de deelnemers de kaarten weer te groeperen.
card sorting

Wil je dit zelf uitvoeren? Dat kan! Brainstorm met een team en maak een lijst met prioriteiten die op de website moeten komen. Verzamel een aantal deelnemers die blanco naar jouw aanbod kunnen kijken en pas één van de twee manieren toe!

Tip #2 Limiteer het aantal menu-items tot maximaal 7

Limiteer de menu items tot niet meer dan 7 items. Het korte-termijngeheugen bevat namelijk slechts 7 items (dit kan per persoon verschillen en zit tussen de 5-9 items). Deze informatie komt uit het beroemde psychologiedocument dat in 1956 door George Miller werd gepubliceerd.

Hoe meer items er in de navigatie staan, hoe moeilijker het is voor de gebruiker om de informatie te onthouden en te verwerken.

Wanneer het menu meer dan 7 items bevat, bestaat de kans dat de gebruiker erover heen kijkt. Wil je toch meer dan 7 items gebruiken? Dan adviseren we je om het in groepen op te delen.

Tip # 3 Gebruik de taal van de gebruiker

Het is belangrijk dat jouw navigatie de doelgroep aanspreekt en ze door willen klikken naar andere pagina’s. Sluit aan bij de tone of voice die de gebruiker aanspreekt.

Tip #4 Soorten navigatie

Er zijn verschillende soorten navigatie:

Verticale navigatie

  • Deze navigatie is mobielvriendelijk
  • Geschikt wanneer een website veel navigatie elementen heeft

Horizontale navigatie

  • Werkt op veel verschillende formaten schermen
  • Fijn in gebruik bij kleinere websites
  • Bij grotere websites met subnavigatie

Je kunt er ook voor kiezen om de navigatie fixed of non-fixed te maken op de pagina. Wat zijn de voor en nadelen?

  • Bij fixed navigatie is het menu altijd zichtbaar bovenin. Het voordeel hiervan is dat de gebruiker altijd toegang heeft tot het menu en makkelijk door kan klikken naar andere pagina’s. Het nadeel is dat het veel ruimte inneemt en de bezoeker kan afleiden.
  • Bij een non-fixed navigatie blijft het menu bovenaan de pagina en is het niet continu zichtbaar. Het is niet makkelijk toegankelijk, maar het scheelt wel ruimte.

Wij hebben een mix gemaakt van beiden. Zodra je op onze website terecht komt zie je alle navigatie items (en heb je meteen overzicht in de structuur). Scroll je naar beneden, dan krijg je een hamburger menu (je hebt altijd toegang, maar het neemt niet veel ruimte in). Je hoeft niet te klikken, want on hover schuift het menu uit. Best of both worlds!

Tip #5 Hamburger menu of niet?

Een hamburger menu is een menu dat bestaat uit 3 streepjes onder elkaar. Dit menu neemt minder ruimte in en speciaal voor mobiele websites is ontworpen. Toch zien we het ook steeds vaker verschijnen op desktop.

Werkt een hamburger menu nou wel of niet? Dit is de discussie van de eeuw en de meningen zijn sterk verdeeld. Wij kijken vooral naar de context waarin het menu geplaatst wordt. Gaat het om een portfolio website of lookbook dan zijn visuals belangrijk en kan zo’n navigatiebalk afleiden. En wat zijn de doorklikmogelijkheden op de pagina zelf? Wanneer een bezoeker makkelijk door kan blijven klikken zonder de navigatie hoe belangrijk is het dan dat deze altijd in beeld is?
En wat ook belangrijk is: mensen zijn inmiddels gewend aan het hamburger menu en weten de functionaliteit ervan. Waarom zou je hier dan niet je voordeel mee doen?

Tip #6 Gebruik het logo als terug-naar-homepagina-knop

Het logo staat meestal bovenaan je pagina. Dit is een herkenningspunt van jouw bedrijf, maar dit logo kan ook functioneel worden ingezet. Het logo kan als terugknop-naar-het-home-menu gebruikt worden. Op veel websites wordt dit gebruikt zonder dat je het door hebt.

Tip #7 Gebruik breadcrumbs

Naast een menu kun je ook gebruik maken van Breadcrumbs. Op websites waar een complex menu is, kan het gebruiken van breadcrumbs enorm helpen.

Breadcrumbs helpen de gebruiker te zien welk pad hij/zij is doorlopen en kan daardoor makkelijk de weg terug vinden.

Breadcrumbs geven ook inzicht in de website hiërarchie. Je gebruikt breadcrumbs om 3 of meer levels aan te geven.

Tip #8 Terug naar boven

Wanneer je pagina een lange scroll naar beneden is en je de bezoekers niet wil afleiden met een fixed navigatie, dan is een een button “terug naar boven” of een pijl icoon een goede oplossing. Zo kunnen bezoekers toch snel terechtkomen bij de navigatie zonder ruimte te verliezen vanwege een navigatie element.

 

Tip #9 Menu in de footer

De footer bevindt zich onderaan de pagina. Je kunt deze ruimte goed inzetten om nogmaals de navigatie weer te geven. Dit zorgt ervoor dat de gebruiker niet helemaal naar boven hoeft te scrollen om naar een andere pagina te gaan.

 

Tip #10 Visueel aantrekkelijk, maar vooral functioneel

Last but not least: denk eraan dat het menu visueel aantrekkelijk is, maar vooral functioneel vormgegeven is. Gebruik duidelijke letters, hou het rustig qua kleurstelling en geef de menu items voldoende witruimte zodat het goed te lezen is.

Extra tip: Maak een gedeelte rond het woord ook klikbaar zodat bezoekers niet te specifiek hoeven te klikken.

Met al deze tips zou je nu in staat kunnen zijn een top navigatie te ontwerpen die precies past bij de doelgroep en zijn/haar wensen.

Fleur

Wil je meer weten?

Fleur helpt je graag verder. Fleur is de nieuwste aanwinst van ons team! Haar leergierige houding en nieuwsgierigheid vormen de basis voor bruisende designs die perfect aansluiten bij de behoeften van gebruikers.

085 060 9386 fleur@yourpersonalagency.nl