EIGEN WEBSITE - SITEONTWERP - 16.12.2010

Laat uw bezoekers niet verdwalen

Boomstructuur uittekenen

De navigatie is de structuur waarmee bezoekers de weg vinden op uw website. Het is de hiërarchisch opgebouwde kapstok waaraan u de inhoud (bv. de voorstelling van uw zaak, een overzicht van uw producten of diensten, …) ophangt. U kunt dit het best vergelijken met een boomstructuur die bestaat uit verschillende onderliggende takken. U maakt die navigatie zo breed (aantal takken op hetzelfde niveau) en zo diep (aantal onder­liggende niveaus) als u zelf wilt.

Zo’n structuur kunt u gemakkelijk uittekenen op een groot blad papier. Zo ziet u snel of de navigatie logisch en intuïtief opgebouwd is. Voor het schetsen hiervan, kunt u echter ook een beroep doen op eerder besproken webtools zoals Cacoo (http://www.cacoo.com), Gliffy (http://www.gliffy.com) of Lovely Charts (http://www.lovelycharts.com). Vooral als u met anderen - bv. een webmaster of een collega - samenwerkt aan de structuur van uw site, zijn die interessant. U kunt er namelijk uw ontwerp ‘sharen’.

Tips voor een goede structuur

1. Zorg ervoor dat het hoofdnavigatiemenu op elke webpagina bovenaan terug te vinden is.

2. Dat menu moet opgebouwd zijn uit duidelijke, veelzeggende onderdelen (dus liever bv. ‘producten’ dan ‘onze troeven’).

3. Dwing de bezoeker niet om de volledige boom­structuur van uw site te doorlopen om zijn doel te bereiken. Bied hem dus rechtstreekse links aan naar belangrijke pagina’s (bv. naar uw topproducten of uw contactgegevens) en voorzie de menubalk bovenaan bv. van uitklapbare menu’s die de subniveaus weergeven.

4. Maak de structuur van uw website nooit dieper dan 3 niveaus. Anders is de kans groot dat de bezoeker het overzicht verliest. Kortom: respecteer de ‘3 click rule’: alle pagina’s moeten bereikbaar zijn met 3 kliks vanaf de homepage.

5. Visualiseer op elke pagina het pad dat de bezoeker afgelegd heeft (dus bv. Home; Producten; Schoonmaak; Sponzen). Dankzij deze ‘brood­kruimels’ weet hij steeds waar hij zich precies bevindt en kan hij via een eenvoudige klik meteen opnieuw bv. 2 niveaus hoger geraken.

6. Ook al heeft u een goede websitestructuur uitgedacht, zorg toch voor een goede zoekfunctie die vanaf elke pagina toegankelijk is.

Inspiratie

Heeft u een goede structuur uitgetekend en zoekt u ter inspiratie wat voorbeelden van navigatie­menu’s? Kijk eens in de Menu Designs van CSS Drive (http://www.cssdrive.com/index.php/menudesigns/). Daar heeft u de keuze uit horizon­tale menu’s, verticale menu’s en ingewikkeldere ‘multiple/nested levels’. Kijk zeker ook eens op CSS3Menu (http://css3menu.com): hier vindt u een gratis tool waarmee u CSS3-menu’s kunt bouwen (check de Demo’s). Daar­naast kunt u ook een kijkje nemen op WebdesignLedger (http://webdesignledger.com/inspiration/35-inspiring-headers-and-footers) ter inspiratie. Google zelf eens op bv. ‘navigation menus’ voor nog meer voorbeelden. Die kunt u dan bekijken met uw webmaster. Tip. Zorg er wel voor dat u trouw blijft aan uw huisstijl, want dat verhoogt de herkenbaar­heid bij uw klanten.