Auteur: Francis
  Leestijd: 7 minuten

10 heuristieken om de beste versie van jouw website te maken

Wist jij dat de digitalisering een enorme vlucht heeft genomen sinds het begin van de corona pandemie? De E-commerce heeft een flinke boost gekregen en veel bedrijven hebben inmiddels hun hele business online gebracht.

Door deze ontwikkeling is de hoeveelheid websites en online content enorm toegenomen. Die toename zorgt er voor dat mensen dagelijks aan heel veel online prikkels worden blootgesteld en dus selectiever moeten zijn met wat ze wel en vooral wat ze niet bekijken. Het is daarom belangrijker dan ooit om er voor te zorgen dat je met jouw website waarde voor (potentiële) klanten creëert én dat je aansluit bij de behoefte en verwachtingen van jouw websitebezoekers. Het principe van heuristieken voor webdesign van Jakob Nielsen kan je hierbij helpen. Benieuwd hoe? In deze blog legt onze Conversie Specialist Francis dit principe aan je uit!

Deel deze pagina:

Een heuristische analyse is een methode die je helpt om de gebruiksvriendelijkheid van je webdesign onder de loep te nemen. Heuristiek komt van het Griekse heuriskein en betekent letterlijk de leer of de kunst van het vinden. Jakob Nielsen verdeelt de analyse in 10 heuristieken. We gaan ze een voor een langs.

#1: Zichtbaarheid van systeemstatus

De eerste heuristiek die Jacob Nielsen beschrijft is de zichtbaarheid van systeemstatus. Alle systemen op jouw website moeten de gebruiker op de hoogte houden van wat er gaande is. Denk bijvoorbeeld eens terug aan de laatste keer dat je een update moest uitvoeren op je laptop. Waarschijnlijk zag je toen precies in beeld hoelang het nog duurde voor de update klaar was, waardoor je zeker wist dat de update goed werd uitgevoerd. Een ander voorbeeld van zichtbaarheid van systeemstatus is de lift. Zodra je op het knopje drukt om de lift te halen, wordt het knopje rood. Dit laat zien dat de melding juist is binnengekomen. Vervolgens zie je op het scherm boven de deur hoeveel verdiepingen de lift nog moet om bij jouw verdieping aan te komen. Je weet dus precies hoelang je nog moet wachten. Als jij deze ‘zichtbaarheid van systeemstatus’ niet zou zien, was je waarschijnlijk een stuk ongeduldiger geweest of was je misschien zelfs wel afgehaakt en met de trap gegaan, ondanks dat de lift misschien wel onderweg is.

Hetzelfde geld voor jouw websitebezoekers. Laat een bezoeker altijd weten waar hij zich bevindt, waarom hij moet wachten en hoe lang dat nog duurt. Bekijk bijvoorbeeld eens hoe zichtbaar de systeemstatussen van de formulieren op jouw website zijn. Voeg bijvoorbeeld een voortgangsbalk toe bij formulieren die uit meerdere stappen bestaan, maak een veld in een formulier groen zodra de bezoeker deze juist heeft ingevuld en toon een bericht als het formulier correct is verzonden.

#2 Controle en vrijheid

Je hebt het vast wel eens meegemaakt: Je wilt even snel wat in de supermarkt halen, komt een bekende tegen, zegt gedag en voor je het weet heb je een langdradig gesprek waar je eigenlijk geen zin in/tijd voor hebt. Maar je weet niet zo goed hoe je op een nette manier kan aangeven dat je weer weg moet. Omdat dit je een oncomfortabel gevoel geeft, ga je misschien in de toekomst soortgelijke situaties uit de weg door geen gedag meer te zeggen.

Hetzelfde kan gebeuren op jouw website. Gebruikers kiezen vaak per ongeluk systeemfuncties en hebben dan een duidelijk gemarkeerde "nooduitgang" nodig om de ongewenste toestand te verlaten zonder een uitgebreide dialoog te hoeven doorlopen.

Een goed voorbeeld hiervan is de terug- en vooruit knop op je webbrowser. Stel je voor dat deze er niet zou zijn! Dan zou je bij elke klik heel goed moeten nadenken of je daar wel echt naar toe wilt gaan. Vooral op mobiele apparaten is de heuristiek gebruikerscontrole en vrijheid heel belangrijk, omdat er dankzij touchscreens vaker per ongeluk ergens op wordt geklikt. Maak het dus makkelijk voor jouw website bezoekers om acties ongedaan te maken en opnieuw uit te voeren. Zorg er wel voor dat jouw “nooduitgangen” duidelijk zijn aangegeven. Het zou zonde zijn als de bezoeker ze over het hoofd ziet. Analyseer je eigen website bijvoorbeeld eens door te kijken waar een annuleer button handig zou zijn. Met een annuleer button geef je de bezoeker het gevoel van vrijheid en zorg je ervoor dat ze niet per ongeluk ergens ongewenst vast komen te zitten op jouw website.

Onze klant Code Deta maakt gebruik van een Fullscreen Overlay Navigation Menu Web Designs. We hebben een duidelijk gemarkeerde 'nooduitgang' aangegeven door de button sluiten toe te voegen.

Schermafbeelding 2021 12 23 om 13 41 53

#3 Match met de echte wereld

De derde Heuristiek van Jacob Nielsen is de match tussen het systeem en de echte wereld. Dat betekent dat jouw website de taal van jouw bezoeker moet spreken. Zowel visueel als tekstueel. Kijk bijvoorbeeld eens naar het prullenmand pictogram op je laptop. Die lijkt precies op een prullenmand in de echte wereld. Hierdoor sluit de digitale ervaring aan op een fysieke ervaring.

Neem eens de tijd om jouw website bezoekers te observeren. Wat is hun belevingswereld en welke verwachtingen hebben zij. Een manier om dit te doen is via programma’s zoals Clarity en Hotjar . In Hotjar kan je door middel van opnames bekijken waar jouw bezoeker tegen aanloopt en welke informatie op jouw website onduidelijk is. Onthoud altijd dat je een website ontwerpt voor je bezoekers en niet voor jezelf.

#4 Fouten voorkomen

In de eerste heuristiek ‘ Zichtbaarheid van systeemstatus’ hebben we het al gehad over het belang van het tonen van foutmeldingen. Maar het is eigenlijk nog beter om er voor te zorgen dat een websitebezoeker überhaupt geen fouten maakt.

Misschien heb je wel eens per ongeluk een Whatsappberichtje gestuurd naar een collega die eigenlijk voor een vriend(in) was bedoeld. Waarschijnlijk was je toen superblij dat Whatsapp de mogelijkheid heeft om verstuurde berichten te verwijderen en je de fout kon herstellen.

Ga je website eens bij langs en probeer vanuit de website gebruiker te kijken wat de foutgevoelige punten van jouw website zijn en probeer deze te elimineren. Voeg bijvoorbeeld een bevestiging optie toe voordat mensen zich daadwerkelijk inschrijven of voeg suggesties toe aan je zoekbalk. Een mooi voorbeeld hiervan is de Google zoekmachine: Als iemand een zoekactie uitvoert, zal Google de gebruiker altijd suggesties geven. Zelfs als de bezoeker spelfouten of typefouten maakt.

Schermafbeelding 2021 12 23 om 12 01 17

#5 Consistentie en Standaard

De vijfde heuristiek van Jakob Nielsen geeft aan dat het belangrijk is om consistent te blijven. Dit zorgt er namelijk voor dat jouw website voorspelbaar is. Als je bijvoorbeeld een specifieke kleur gebruikt voor een klikbare tekst die je bezoekers tot actie moet overhalen, zorg er dan voor dat je alle andere actie knoppen op jouw website dezelfde kleur geeft. Gebruik deze kleur vervolgens niet om een statische tekst te markeren, want dan verbreek je de consistentie en zullen bezoekers verwachten dat deze tekst ook klikbaar is.

Zorg er ook voor dat jouw website niet afwijkt van de standaard. Zo zijn mensen bijvoorbeeld gewend aan het feit dat een winkelwagentje, die lijkt op een winkelwagentje in de echte wereld,(heuristiek 2, match met de echte wereld), op een webshop altijd rechtsboven in staat. Dit komt omdat dit op elke webshop hetzelfde is en mensen daardoor een bepaalde verwachting hebben opgebouwd over hoe deze functie moet werken en waar deze zich hoort te bevinden.

Bekijk eens of soortgelijke sites als die van jou een bepaalde standaard hanteren en zorg ervoor dat je dit ook toepast. als je dit niet doet forceer je bezoekers namelijk om iets nieuws te leren en dat kost extra energie. Het doel van deze heuristiek is om ervoor te zorgen dat bezoekers zich nooit hoeven af te vragen wat er met een bepaald icoon of woord bedoeld wordt.

#6 Herkennen vs Bedenken

De zesde heuristiek van Nelson is Herkennen vs Bedenken. Het volgende voorbeeld laat het verschil tussen deze twee goed zien: Als iemand aan jou vraagt ‘wil je vanavond vis of vlees eten?’, dan hoef jij alleen te herkennen in welke van de twee je zin hebt. Maar als iemand aan je vraagt ‘wat wil je eten?’, dan moet je zelf bedenken wat je wilt. Misschien weet je niet precies waar je zin in hebt of heb je gewoon geen inspiratie. Het kost veel meer moeite. Herkennen wat je wilt, is namelijk makkelijker dan er zelf opkomen. De context waarin een vraag wordt gesteld en de aanwijzingen die we krijgen, hebben dus een grote invloed op de keuzes die we maken.

Ook in webdesign gaat dit principe op. Het klassiek voorbeeld hiervan is de menubalk. De computer laat zien welke pagina’s er zijn en jij hoeft alleen te herkennen naar welke pagina je toe wilt gaan. websites die inspelen op herkenning, geven extra hulp aan de bezoeker om zich informatie te herinneren. Hierdoor wordt de moeite die een bezoeker moet doen kleiner en dat is essentieel voor een goede gebruikerservaring. Zorg er daarom voor dat je ‘herkennen’ altijd promoot boven ‘ zelf bedenken’ in je webdesign.

Een voorbeeld zie je aan de rechter kant. Voor uitzendbureau Werkis / verder met werk hebben wij een suggestie - en filterfunctie toegevoegd aan de vacaturepagina, zodat bezoekers alleen hoeven te herkenen in welke branche zij aan de slag willen en daardoor sneller de juiste vacature te zien krijgen.

Schermafbeelding 2021 12 23 om 11 41 25

#7 Flexibiliteit en efficiëntie

De zevende Heuristiek is flexibiliteit en efficiëntie. Deze heuristiek gaat over het zoeken naar zogenoemde ‘accelerators’ op je website. Een accelerator is een optie die een interactie op jouw website versnelt. Voorbeelden hiervan zijn de shortcuts (bijvoorbeeld copy-paste) op je laptop en de macro's die je gebruikt in Excel. Maar ook online vind je dergelijke accelerators. Bijvoorbeeld op Instagram. Als je vaak gebruik maakt van Instagram, weet je misschien wel dat je makkelijk een foto kan liken door er twee keer op te tikken. Dat is sneller en efficiënter dan op het hart icoontje onder de foto te drukken. Toch staat het hart icoontje bij elke foto, zodat mensen die de accelerator niet kennen ook hun weg kunnen vinden.

Bekijk je eigen website eens. Wat kan er volgens jou efficiënter? Zorg er wel voor dat de accelerators op jouw website handig te gebruiken zijn voor experts, maar flexibel genoeg voor mensen die nieuw zijn op je website en deze accelerators misschien niet kennen.

#8 Herkennen, diagnosticeren en herstellen van fouten

Heuristiek acht is gebruikers helpen bij het herkennen, diagnosticeren en herstellen van fouten. Dit kan op verschillende manieren. Één van de makkelijkste manieren is door middel van een foutmelding. Door dit te combineren met visuele aspecten wordt de boodschap nog duidelijk. Maak bijvoorbeeld een veld rood wanneer het niet op de juiste manier is ingevuld. Daarnaast is het belangrijk dat we gebruikers vertellen wat het probleem is. Gebruik hierbij duidelijk taal, zodat direct duidelijk is wat er aan de hand is en geef de bezoeker ook een oplossing voor het probleem.

Een voorbeeld hiervan is te vinden bij onze klant Sophi.Online. Sophi online is een platform voor ouders van een kind met een beperking . Zij bieden op hun website inspirerende blogs aan, zodat ouders even op adem kunnen komen. Hieronder zie je de 404-pagina van Sophi.Online. Deze laat duidelijk zien wat er aan de hand is: de pagina bestaat niet. Vervolgens wordt een een alternatief aangeboden: het lezen van de de nieuwste content. Met die button worden bezoekers weer terug naar de homepagina gebracht. Dit maakt dat bezoekers het probleem makkelijk met een klik kunnen oplossen.

Schermafbeelding 2021 12 23 om 11 05 35

#9 Aesthetic en Minimalistisch ontwerp

Volgens de heuristieken van Jacob Nielsen is het belangrijk om een aesthetic en minimalistisch design te gebruiken. Dit betekent niet dat je website heel saai en strak moet zijn, zolang de focus maar blijft liggen op het doel van je website. Wanneer je iets aan je website toevoegt, beoordeel dan eerst hoe relevant deze toevoeging is voor jouw doelgroep. Dit kan gaan om tekst, visuele elementen of animaties. Om op een efficiënte manier te communiceren door middel van design en mensen te helpen met het uitvoeren van een conversie op jouw website, moet je proberen om zo min mogelijk afleiding te creëren, zodat bezoekers zich kunnen focussen op de taak die je ze probeert uit te laten voeren. Hierbij is het belangrijk dat de visuele aspecten van je website het primaire doel van je website ondersteunen. Met andere woorden, verwijder alle elementen op je website die andere reden hebben dan er gewoon mooi uitzien of ruimte invullen.

Communicate, don't decorate.

#10 Hulp en documentatie

De tiende en laatste heuristiek van Jakob Nielsen is hulp en documentatie. Hoewel we er met ons webdesign natuurlijk voor willen zorgen dat onze website zo gebruiksvriendelijk mogelijk is, hebben bezoekers soms toch hulp nodig. Hulp en documentatie kan op verschillende manieren. Een klassiek voorbeeld hiervan is een hulppagina, maar ook onboarding pagina's, tooltips, FAQ, video’s, kennisbanken, chatbots en webchats zijn voorbeelden van hulp en documentatie.

Als je deze heuristiek wilt toepassen op je website, houd dan in je achterhoofd dat het makkelijk moet zijn voor de gebruiker om hulp te vinden. Zorg ervoor dat jouw documentatie is gericht op het probleem van de bezoeker en dat deze uit duidelijke stappen bestaat die de bezoeker kan opvolgen.

Booking.com past deze heuristiek heel goed toe. Sinds de corona pandemie heeft zij een pagina met veelgestelde vragen over het coronavirus (COVID-19) toegevoegd aan haar website. Op deze pagina biedt zij bezoekers een tool aan die in kaart brengt wat de beperkingen en verplichtingen zijn per land. Deze tool speelt dus perfect in op de vraag van de bezoeker en is ook nog eens makkelijk te gebruiken, omdat het visueel en tekstueel kort en bondig is vormgegeven.

Schermafbeelding 2021 12 23 om 11 09 54

Aan de slag met deze heuristieken?

Ben jij op zoek naar een expert die de 10 heuristieken van Jakob Nielsen op jouw website kan toepassen?

Ik kijk graag naar de manieren om voor jouw bedrijf conversie optimalisatie in te zetten. Naast een uitgebreide analyse ontvang je een advies op maat waarin wordt beschreven waar de bottlenecks op jouw website zitten en waar jij omzet laat liggen. Zo krijg jij een gedegen advies om verder te groeien.

Plan een vrijblijvend adviesgesprek in!
1630944098506 1

Niks missen op marketinggebied?

Blijf op de hoogte van de laatste trends en ontwikkelingen, succesvolle usercases, concrete tips & tricks en laat je inspireren.