https://blisdigital.com/nieuws/een-hamburger-icoon-gaat-er-bij-een-vegetariër-niet-in https://blisdigital.com/en/news/een-hamburger-icoon-gaat-er-bij-een-vegetariër-niet-in
Nieuws09-07-2015Vincent Dekker

Een hamburger (icoon) gaat er bij een vegetariër niet in

Nieuws

Hebben wij dan niks geleerd van vroeger? Of komt het door de designers die het tijdperk van de hippe flash websites niet hebben meegekregen. Tien jaar geleden was het ook hip om de navigatie te verstoppen. Gebruikers moesten ergens op pijltjes klikken of aan de rand hoveren om de navigatie naar binnen te laten schuiven. Al snel bleek dat dit niet ten goede kwam aan de interactie op de website. Niet alle gebruikers hebben de behoefte of de tijd om een zoektocht te ondergaan om tot hun doel te komen.

Een doeltreffende website maken?

Zorg er voor dat gebruikers zonder al te veel weerstand door de website kunnen navigeren. Zelfs uit onderzoeken uit 2015 blijkt dat veel internetgebruikers het hamerburger icoon niet herkennen. Zij bekijken de pagina waarop zij terecht komen en hebben geen idee dat ze via dat icoon verder kunnen navigeren. Eigenlijk ook heel logisch, want als designer leer je dat iconen op zichzelf niet altijd even duidelijk zijn. Het is daarom verstandig een label bij het icoon te zetten. Zoals wij vaak zien in de tab bar in mobiele apps.

Wij lopen iets te hard van stapel, als wij zeggen: “Het hamburger icoon wordt toch ook in mobiele apps gebruikt? Iedereen heeft een mobiel, dus iedereen snapt wel wat wij ermee bedoelen.

Ook in de mobiele apps werkt het hamburger icoon niet altijd zoals wij het verwachten. Startups hebben zich dit ook afgevraagd. Uit hun tests bleek dat veel gebruiker bleven hangen op de content wat ze op de startpagina zagen. Zij kwamen er achter dat de tab bar met iconen, waarmee de gebruikers direct naar andere onderdelen kunnen navigeren, veel beter werkt. Gebruikers bleven langer in de app en kwamen nu wel op de eerdere verstopte onderdelen terecht.

Hoe het hamburger icoon wel te gebruiken

Ben je van plan om de trend uit te proberen? Zorg er dan op zijn minst voor dat het voor de gebruiker een herkenbaar element is om op te klikken. Dit advies kan je ook gebruiken in de mobiele varianten van de websites of in apps. In de afbeelding hieronder staan drie varianten:

hamburger icon voorbeelden

  1. Alleen drie strepen – Deze variant is niet heel herkenbaar voor alle gebruikers.Voorbeeld: Risotteria Melotti. Opzich een mooie website, maar het icoon is niet heel duidelijk.
  2. Drie strepen met een contrasterende achtergrondkleur – Op deze wijze is het element veel sneller te ontdekken.
  3. Drie strepen met een contrasterende achtergrondkleur met het label 'menu' - Deze variant blijkt in veel gevallen het best te werken. Voorbeeld: Brandts. De button valt goed op toch.

Door de derde variant te gebruiken zou je bijna denken dat het niet meer mis kan gaan. Toch is het op deze manier ‘verstoppen’ van de navigatie niet goed voor de interactie binnen de website of app. Gebruikers zijn gefocust op wat ze zien. De extra 'barrière' van de navigatie open klikken, zal in sommige gevallen leiden tot interactie vermindering.

Mijn visie

Er is altijd een uitzondering op de regel. De navigatie niet direct tonen kan in sommige gevallen wel bijdragen aan de gewenste user flow. De layout moet zo ingericht zijn dat de gebruiker via de content het gewenste pad kan bewandelen. Dit is ook niet zonder haken en ogen.

Zorg er minstens voor dat het altijd duidelijk is waarop geklikt kan worden en de gebruiker indien gewenst direct contact kan opnemen.

Een goed voorbeeld om toch te kiezen voor het hamburger icoon is Hart Island. De homepage is het eerste wat de gebruiker moet meemaken. Dit is de essentie van de website. De overige pagina’s moeten pas bekeken worden, wanneer homepage is beleeft.

Soms moet je toch ook de eerste zijn. Door het helemaal niet te gebruiken leert niemand ermee om te gaan. Net als met elke uitvinding heeft het tijd nodig voordat het grote publiek weet wat het is en wat je ermee kan doen. Bepaal dus goed wanneer en hoe het icoon te gebruiken en draag daarmee bij aan het opvoeden van het grote publiek. Informeer de klant over de valkuilen en evalueer tijdig het websitegebruik.

Conclusie

Natuurlijk eet ik als vegetariër wel eens een hamburger. Technisch gezien niet echt een hamburger natuurlijk, maar een noten-, soja of bonenburger. Zo is het ook met het icoon. Niet iedereen zal direct begrijpen dat je op de drie strepen kan klikken, maar wel als het op een button lijkt en helemaal wanneer het woord menu erbij staat. Onderzoek eerst waar de voorkeur van de gebruiker naar toe gaat.

Misschien bedenk jij wel een nieuw icoon. Eén die wel snel aanslaat bij het grote publiek of misschien bedenk jij wel een hele nieuwe manier van navigeren. Blijf nieuwsgierig, onderzoeken en testen.