De psychologie van een goed webdesign: pas deze 7 principes toe

Heuristieken

Laten we beginnen met het kijken naar een belangrijk begrip in de psychologie, namelijk: heuristieken.

Simpel gezegd zijn heuristieken eenvoudige regels die ons helpen bij het maken van keuzes en beslissingen.

De psychologen Tversky en Kahneman waren in de jaren 70 al bezig met het nadenken over hoe mensen beslissingen maken. Een belangrijk inzicht uit hun onderzoek is dat we vaak helemaal niet zulke weloverwogen beslissingen maken als we graag zouden willen.

De reden hiervoor is dat het heel veel moeite kost om rationele beslissingen te maken. Je moet dan namelijk alle voordelen en nadelen zorgvuldig afwegen, wat voor ons brein best inspannend kan zijn. In een doorsnee dag krijgen we zo veel prikkels en indrukken binnen, dat het bijna niet te doen is om alles grondig te analyseren.

Enorm veel beslissingen gaan daarom vrijwel vanzelf, zodat ons brein maar een beperkte hoeveelheid informatie hoeft te verwerken. Mensen zijn gewoontedieren: hoe minder we hoeven na te denken, hoe beter.

Nu vraag je je wellicht af: wat heeft dit precies te maken met webontwerp? Het antwoord op die vraag is dat je heuristieken op een slimme manier in je webontwerp kunt verwerken om daar verschillende voordelen mee op te doen.
 

Bijvoorbeeld om mensen een betere indruk te geven van je bedrijf, ze langer op je website te houden, of makkelijker een (koop)beslissing te laten maken! We zetten een aantal heuristieken voor je op een rijtje, en vertellen je ook gelijk hoe ze eventueel kunt toepassen op je website.

Sociale bewijskracht

Het eerste psychologische principe waar je over willen vertellen is sociale bewijskracht.

Sociale bewijskracht is de invloed van het gedrag of de mening van anderen op jouw eigen gedrag of mening.

Stel, je bent op zoek naar een restaurant om uit eten te gaan. Je loopt langs een paar restaurants, eentje zit bijna helemaal vol, terwijl bij het bij de andere vrijwel leeg is. Welke zou jij denken dat beter is?

De meeste mensen zouden zeggen: waarschijnlijk is dat volle restaurant wel een stuk beter. Dat komt omdat men ervan uitgaat dat het daar niet voor niets zo vol is. Het móet wel lekker zijn daar, toch? 

Dit is een voorbeeld van sociale bewijskracht in actie. 

Vooral als we ergens zelf niet zoveel vanaf weten, kijken we graag naar anderen. We gaan ervanuit dat we op basis van het gedrag of de mening van anderen, een betere beslissing kunnen maken dan wanneer we er alleen voor staan.

Wanneer je producten of diensten verkoopt op jouw website, werkt dit principe net iets anders. Mensen kunnen immers niet snel zien of jouw website 'populairder' is dan een andere website. 

Toch kijken mensen ook online graag naar het gedrag of de mening van anderen. Een manier om dat voor elkaar te krijgen, is bijvoorbeeld door het opzoeken van ervaringen en reviews. 

Het is dus verstandig om bij het maken van je webontwerp na te denken over een manier waarop je sociale bewijskracht kan laten zien aan potentiële klanten.

Dat kan bijvoorbeeld door te tonen hoeveel klanten je al hebt geholpen met je dienst, aan te geven hoeveel mensen op dit moment naar een product kijken, of door reviews van klanten uit te lichten.

Hieronder een voorbeeld van hoe sociale bewijskracht is toegepast op de websites van één van onze eigen klanten.

Sympathie

Het tweede psychologische principe om rekening mee te houden is de sympathie-heuristiek. 

Volgens de sympathie-heuristiek nemen we sneller dingen aan van mensen die we sympathiek en aardig vinden. Dat effect wordt nog sterker hoe meer gelijkenis we ervaren tussen een bepaald persoon en onszelf. 

Ik hoor je denken: maar het gaat hier over websites, hoe kan mijn website sympathiek zijn? 

Een manier om deze heuristiek toe te passen is door letterlijk mensen aan je website toe te voegen, bijvoorbeeld foto’s of video’s van klanten of je medewerkers. En het liefst mensen die zo veel mogelijk lijken op jouw klantenkring. Dan wordt het namelijk makkelijker voor klanten om zich ermee te identificeren.

Op de website van één van onze klanten passen we dit toe door middel van een video. Die video toont het verloop van gezellig avondje uit en geeft een sfeerimpressie van het bedrijf.

Op deze manier wordt er geprobeerd een connectie met potentiële klanten te creëren. 

Omdat er ‘gewone’ mensen getoond worden in de video, wordt er ingespeeld op het versterkende effect van gelijkenis.   

Basecamp testte de invloed van deze heuristiek door twee ontwerpen te vergelijken.

Het ene ontwerp bestond voornamelijk uit tekst, het andere legde juist veel nadruk op een persoon. Het ontwerp waar de nadruk lag op een persoon leidde tot meer dan 2 keer zoveel conversies. 

Het werkt dus echt!

Autoriteit

Het derde principe wat je toe kunt passen is de autoriteit-heuristiek.

De autoriteit-heuristiek is gebaseerd op het gegeven dat mensen eerder luisteren naar mensen in autoriteitsposities, zoals dokters, hoogleraren, of andere experts. Mensen hebben ook meer vertrouwen in zulke autoriteitsfiguren.

Je kunt zelf wel van mening zijn je dé expert bent in je vakgebied, maar straalt je website dat ook uit?

Volgens de Nielsen Groep zijn er een aantal manieren waarop je autoriteit kan uitstralen in je webontwerp:

• Afbeeldingen tonen van mensen in autoriteitsposities.
• Symbolen gebruiken die staan voor autoriteit. Bijvoorbeeld prijzen die zijn gewonnen, of certificaten die laten zien dat je expert bent op een bepaald gebied.
• Logos van betrouwbare partijen tonen – natuurlijk alleen als ze van toepassing zijn
• Citaties en aanbevelingen van experts, bekende mensen, of andere autoriteitsfiguren verwerken op je website.

Deze afbeelding, ook van de Nielsen Groep, laat een aantal voorbeelden zien van de hierbovenstaande punten.

Psychologie

Naast de klassieke heuristieken zijn er nog vier andere psychologische 'wetten' waarvan het ons handig leek om er wat meer over te vertellen. 

4. Het seriële-positie-effect

Laten we beginnen met het zogeheten seriële-positie-effect, in het leven geroepen door de Duitse psycholoog Ebbinghaus.

Simpel gezegd kwam Ebbinghaus erachter dat wanneer je mensen een lijst presenteert, ze het meeste letten op de eerste en laatste items in die lijst.

Dat betekent niet dat ze de middelste elementen helemaal negeren. Maar ze worden door ons brein wel als minder belangrijk beschouwd.

Dit effect kun je op meerdere manieren inzetten in het ontwerpen van je website, bijvoorbeeld in het samenstellen van een effectief menu en het strategisch plaatsen van je unique sellings points (USPs).

Strategische volgorde van de menu-items

Laten we de website van één van onze klanten als voorbeeld gebruiken. Hier zie je dat de belangrijkste items aan het begin en aan het einde van het menu staan.

Het eerste menu-item – als we de homepage even niet meetellen – is het overzicht met alle producten die worden aangeboden. Dat is een belangrijk gedeelte van de website van deze klant, vandaar dat die ook vooraan geplaatst is.

Helemaal aan het einde het menu staan twee belangrijke knoppen, namelijk een knop om meteen te bellen en een knop om een aanvraag te doen.

De minder belangrijke items staan hier in het midden. In dit geval bijvoorbeeld de ‘over ons’ pagina.

Unique selling points (USP's) aan het begin plaatsen

Een andere toepassing van het seriële-positie-effect is het plaatsen van je USP's helemaal aan het begin van de pagina. Op de website van Coolblue is bijvoorbeeld het eerste wat de klant ziet dat de levertijd kort is en dat de retouren gratis zijn.
 

Dat is natuurlijk een positief begin van het websitebezoek, dus dit hebben ze niet voor niks op die plek neergezet.

Von Restorff-effect

Het Von Restorff-effect gaat ervanuit dat wanneer er meerdere vergelijkbare objecten aanwezig zijn, zoals bijvoorbeeld knoppen, men meer let op het object dat anders is dan de rest. Ook onthouden mensen dit object beter.

Er zijn verschillende manieren waarop je het ene object kan laten verschillen van het andere. Je kunt bijvoorbeeld variëren in kleur, vorm, grootte, of extra veel ruimte toevoegen.

In het onderstaande voorbeeld valt de donatie-knop bijvoorbeeld extra op doordat hij een opvallende kleur heeft en een andere vorm heeft dan de omringende knoppen. Door de toegevoegde schaduw achter knop valt hij nog meer op.

Op onze eigen website zie je hier een ander voorbeeld van. De knop die naar de projectenpagina leidt valt op omdat de oranje kleur een groot contrast oplevert met de omringende elementen, die voornamelijk wit zijn.

Jakobs wet

Volgens Jakobs wet, die gebaseerd is op onderzoek van Jakob Nielsen, geven gebruikers de voorkeur aan ervaringen die ze gewend zijn. In het geval van webontwerp betekent dat dat gebruikers het liefste hebben dat een site in de basis werkt zoals ze verwachten.

Het ontwerp kan nog zo fancy of ‘anders’ zijn dan andere websites, maar dat betekent niet dat dit ook een betere gebruikerservaring biedt.

De psychologie achter deze ‘wet’ zit hem in het feit dat mensen een aangeboren voorkeur hebben voor bekende dingen.

We vinden het fijn als dingen werken zoals we ze verwachten, omdat we dan het gevoel hebben dat we de controle hebben. We kunnen dan op de automatische piloot een website bedienen, zodat we ons beter kunnen focussen op de daadwerkelijke inhoud ervan.

Een voorbeeld van Jakobs wet in de context van websites, is dat we gewend zijn dat pagina’s van boven naar beneden scrollen.

Het kan misschien een leuk idee lijken om een horizontaal scrollende website te maken, maar bedenk wel dat dit ingaat tegen wat gebruikers gewend zijn, omdat 99% van de andere websites die ze bezoeken dit niet doen.

Een ander voorbeeld is dat mensen gewend zijn dat het logo van de website links bovenin staat, en dat je door erop te klikken weer teruggaat naar de homepagina.

Hick's wet

Hick’s wet gaat ervanuit dat hoe meer keuzes je voorgeschoteld krijgt, hoe langer je erover doet om een beslissing te maken. 

Je herkent het vast zelf: je bent op zoek naar een nieuwe smartphone, maar welke van de honderden modellen past het best bij je? En welke provider kun je het best nemen? Welke kleur moet je kiezen? Kortom: keuzestress.

Als je wil dat bezoekers op je website converteren, is het dus beter om keuzes te managen en gebruikers niet te overweldigen. Anders heb je kans dat mensen keuzestress ervaren, en als het ware weer ‘wegvluchten’ van je website.

Het punt van Hick's wet is dan dus ook dat je het beter zo simpel mogelijk kunt houden. Dat is niet altijd mogelijk, soms kun je niet anders dan de gebruiker door een nogal complex proces te sturen. Maar zelfs dan kun je Hick's wet toepassen.

Om even door te gaan op ons smartphone voorbeeld, laten we zien wat we bedoelen door twee vergelijkbare sites naast elkaar te zetten. Op beide kun je een smartphone met abonnement aanschaffen, wat best een complex proces kan zijn. Naar onze mening heeft de ene website een duidelijk beter design dan de andere, door het toepassen van Hick's wet.

Hoewel beide websites redelijk ‘vol’ staan, merk je dat bij de linker website je aandacht alle kanten op gaat. Waar willen ze eigenlijk dat je naar kijkt?

Naar de tabjes van de verschillende providers? De felle banner die eronder staat?

Wanneer je naar de toestellen zelf kijkt, weet je ook even niet waar je moet kijken. Er staat zó veel informatie op een kluitje.

Bij de rechter website gaat dit een stuk beter: het is allemaal een stuk simpeler en overzichtelijker. Je kunt via 3 simpele stappen direct uitkomen op een relevante pagina, of je kunt eerst oriënteren op de voorgestelde top 10 smartphones.

Wat hier beter gaat is dat het eerste wat je ziet een hulpmiddel is om op de juiste pagina uit te komen. Wanneer we iets naar onder kijken, zien we dat er op deze website ook een aantal modellen op de homepage getoond worden, net als bij de linkerwebsite.

Het verschil is dat er maar een beperkt aantal modellen getoond wordt. Wie meer wil weten, kan doorklikken naar het volledige overzicht. Zo weet je dat er genoeg keuze is, maar het is niet gelijk in-your-face.

Met behulp van twee manieren kun je dit zelf toepassen. Deze manieren zijn het verbergen van complexiteit en het opsplitsen in stappen.

Verbergen van complexiteit

Vooral als je als bedrijf heel veel te bieden hebt op je website, kan het lastig zijn om gebruikers niet te overweldigen. Daarom is het beter om in het begin de complexe dingen te 'verbergen'.

Wat we hier precies mee bedoeln, is om stukje bij beetje wat meer informatie of opties te laten zien, in plaats van de gebruiker in één keer te bombarderen met allerlei informatie en keuzes.

Zorg dat het er op het eerste gezicht makkelijk uitziet, ook als het in werkelijkheid complex is.

In het linker voorbeeld hierboven weet je als gebruiker in eerste instantie niet zo goed wat je moet doen. Moet je eerst het tabje van een provider aanklikken? Of kan ik op een toestel klikken en dan ook het aanbod van andere providers zien? Wat doe ik als ik een los toestel wil? 

Keuzes, keuzes, keuzes. En dat al op de homepage zelf. Dit bevestigd eigenlijk meteen al aan de gebruiker: dit gaat moeilijk worden.

In het voorbeeld rechts pakken ze het heel anders aan. Er is een duidelijk ‘beginpunt’, namelijk het gele blok waarmee je in 3 stappen kunt aangeven waar je precies naar op zoek bent. 

Opsplitsen in stappen

Nadat je de keuze in eerste instantie zo simpel mogelijk hebt gehouden, is het goed om de opties die je daarna gaat bieden in stapjes aan te bieden.

Zo kan je de gebruiker stap voor stap helpen met het vinden van zijn of haar weg op de website.

Je kunt hiervoor bijvoorbeeld filters gebruiken. Stap voor stap wordt steeds om wat meer informatie gevraagd: hoeveel MB’s wil je, hoeveel belminuten heb je nodig, hoeveel SMS’jes wil je kunnen sturen?

Omdat dit in stapjes gebeurt doet, is het behapbaar. Dat werkt een stuk beter dan alle mogelijke combinaties op een hoop te gooien en maar te hopen dat de gebruiker er uitkomt.

Samenvatting

• Mensen zijn niet altijd rationeel, ze besparen graag tijd en inspanningen door heuristieken te gebruiken. Dat zijn eenvoudige regels die ons helpen bij het maken van keuzes. Door ze slim toe te passen in het ontwerp van je website kun je ervoor zorgen dat je website effectiever wordt.
• Sociale bewijskracht is de invloed van het gedrag/de mening van anderen op jouw eigen gedrag of mening. Je kunt hiervan profiteren door bijvoorbeeld te tonen hoeveel klanten je al hebt geholpen met je dienst, hoeveel mensen op dit moment naar een product kijken, of door reviews van klanten op je homepagina uit te lichten.
• Volgens de sympathie-heuristiek nemen we sneller dingen aan van mensen die we sympathiek en aardig vinden. Dat effect wordt sterker des te meer gelijkenis we ervaren tussen een bepaald persoon en onszelf. Toon vooral mensen op je website, bijvoorbeeld klanten of de medewerkers van het bedrijf.
• De autoriteit-heuristiek stelt dat mensen eerder vertrouwen hebben in en luisteren naar mensen in autoriteitsposities, zoals dokters, hoogleraren, of andere experts. Straal dus autoriteit uit op je website, bijvoorbeeld door symbolen gebruiken die staan voor autoriteit, zoals gewonnen prijzen en behaalde certificaten
• Maak gebruik van het seriële-positie-effect: plaats belangrijke items voor- of achteraan in serie van elementen. Mensen wijzen minder waarde toe aan de dingen in het midden.
• Maak voor je belangrijkste elementen, zoals bijvoorbeeld een donatie-knop of abonneer-knop, gebruik van het Von Restorff-effect. Dit doe je door één object er anders uit te laten zien dan de objecten eromheen. Je kunt bijvoorbeeld variëren in kleur, vorm, grootte, of extra veel ruimte toevoegen.
• Volgens Jakobs wet houden mensen van bekende dingen. Speel hierop in door aan de conventies vast te houden, zoals een site die verticaal scrolt, een logo wat linksboven staat en klikbaar is, etcetera.
• Het punt dat Hick’s wet probeert te maken is vergelijkbaar met het punt hierboven: houdt het allemaal zo simpel mogelijk. Hoe meer keuzes mensen krijgen voorgeschoteld, hoe langer ze erover doen om een beslissing te maken – of ze maken er helemaal geen! Dit kun je bereiken door het verbergen van complexiteit en het categoriseren van opties.

En als laatste, een kanttekening

Deze principes zijn allemaal gebaseerd op onderzoek. De kans is dus groot dat ze zeker effect zullen hebben op het gebruikersgemak van je webontwerp. Het is echter niet zo dat deze principes de 'holy grail' zijn en je conversies ineens dubbel omhoogschieten. 

Ook is het belangrijk om goed na te denken welke van deze principes goed passen bij wat je wil bereiken met de website. Je weet nu bijvoorbeeld dat je Von Restorff's effect kan toepassen om bijvoorbeeld een bepaalde knop extra op te laten vallen. Maar blijf wel altijd goed nadenken over wat het effect van zo'n aanpassing zal zijn. 

Jij kunt misschien denken dat je bepaalde elementen extra moet laten opvallen, door ze een felle kleur of opvallende vorm te geven. Maar de kanttekening daarbij kan zijn dat je ontwerp daardoor juist heel druk wordt.

Het blijft dus altijd afhankelijk van de specifieke website, en het doel van die website, wat je het beste kunt toepassen en hoe je dat het beste kunt doen. 

Mocht je er niet uitkomen, dan helpen wij je graag met het ontwerpen van een maatwerk design voor jouw website.