De psychologie achter een goede restaurantwebsite

Auteur: Thijs Jacobs
Digitaal Ondernemen 9 december 2020
De psychologie achter een goede restaurantwebsite

Waaraan moet een goede website voldoen en hoe richt je de beste website in voor jouw horecaonderneming? Dat is per type website en bedrijf verschillend, maar er zijn elementen die voor iedere website gelden. Philip Jordanov is cognitief neuropsycholoog en werkzaam bij Neurofied, een bedrijf dat inzicht geeft in de relatie tussen het brein en het gedrag. Hij deelt zijn kennis, en met name die op het vlak van gedrag op websites.

Jordanov: “Voor de Universiteit van Amsterdam heb ik onderzoek gedaan naar wat een website aantrekkelijk maakt. Tijdens het onderzoek kwamen twee hoofdzaken naar voren: de prototypicaliteit - hoe ‘matcht’ de website met wat wij ervan verwachten - en de complexiteit: hoe visueel en tekstueel complex is de website, en wat vinden wij ervan. Eigenlijk weet de bezoeker van een website al binnen een seconde of hij het aantrekkelijk vindt of niet. Dat komt ook omdat het oordeel over beide factoren zich nestelen in het niet-bewuste deel van onze cognitie.”

Gewend aan een bepaalde structuur

Tegenwoordig heeft iedereen een helder beeld bij een ‘goede’ website, je hebt voorafgaand aan het bezoek aan een website al bepaalde verwachtingen. “Inderdaad, er is een steeds helderder prototype van websites. Kijk eens naar Booking.com; als bezoeker verwacht je een bepaalde structuur, zoals de plaats van de foto en het type beeld. Maar ook de buttons met een ‘call to action’ staan op een bepaalde plek en hebben een kenmerkende kleur en vorm. Wanneer jij ook een boekingssite ontwerpt, dan is het niet verkeerd om het skelet van zo’n bekende en functionele website te kopiëren, want dan voldoet het aan de verwachtingen van de gebruiker. Er zijn verschillende platformbedrijven zoals Wix en Squarespace die voor jou een prototype klaar hebben staan, prototypes die intuïtief werken en prettig aanvoelen. Je hoeft dus echt niet vanaf nul te beginnen als je aan de slag gaat met een website.”

Kleurgebruik

Speelt kleurgebruik een grote rol in het vormgeven van een website? “Bij kleurgebruik speelt de context een belangrijkere rol dan de kleur zelf”, verklaart Philip. “Er zijn veel onterechte claims over kleuren en sommige opvattingen zijn in de loop der tijd achterhaald of ontkracht. De kleur rood bijvoorbeeld, die werkt in de oriënterende fase van het bezoek aan een website minder goed. De kleur verhoogt de mentale urgentie, dus die kleur houd je liever even achterwege als er veel keuze is. In andere gevallen, zoals bij het bezoeken van een winkelmandje waar de knop om de bestelling af te ronden rood is, werkt het daarentegen weer heel goed. Het is dan een duidelijke call to action. Zo zie je dat de context de sleutel is bij kleurgebruik. Al deze inzichten uit de neuropsychologie zijn academisch bevestigd, maar het blijft goed om alles in de praktijk te testen. Een website is namelijk nooit af, dus je moet altijd A/B-tests en splittests doen om je kennis en vermoedens te bevestigen of te ontkrachten. Je moet namelijk altijd rekening houden met contextuele factoren. Een goede manier om dit te doen, is een replicatietest, waarbij je de kleur van een button verandert en meet wat het effect is. Dit is niet ingewikkeld, maar geeft wel een goed inzicht in de effectiviteit van de verandering.”

Dit artikel maakt onderdeel uit van de themamaand Digitaal Ondernemen. Meer artikelen lees je via deze link. 

Naast kleurgebruik is personalisatie ook heel actueel, vooral bij grotere, bekendere websites. “Personalisatie kan heel ver gaan, je kunt het zo complex maken als je zelf wilt. Eigenlijk ga je in een complexe situatie over naar ‘webdesign on the spot’. Op die manier probeer je de bezoekers van de website zo min mogelijk te laten zoeken en puzzelen, zeker als het aanbod op je website heel groot is, zoals bij een bedrijf als Coolblue. Op een dergelijke website wordt gewerkt met een ‘funnel’, waardoor je aanbod in beeld krijgt dat past bij wat je zoekt. Vaak gaat dat op basis van criteria die je instelt, zoals prijs, kleur en technische specificaties. Dat kun je als restaurant ook doen, door de bezoeker bijvoorbeeld alleen maar de vegetarische opties op het menu te tonen wanneer hij of zij dat selecteert. Je maakt hiermee de keuze kleiner, waardoor de conversie hoger wordt. Vernauw de keuze en reduceer daarmee keuzestress; het is een kunst om alle mogelijkheden gestructureerd toegankelijk te maken. Houd er wel altijd rekening mee dat je website altijd intuïtief moet werken; een veelvoorkomende fout wordt gemaakt bij invulvelden. In de invulvelden staat vaak een voorbeeldtekst in lichtgrijs, in ieder geval in een laag contrast. Die placeholdertekst geeft aan welke informatie je in dient te vullen in dat veld, zoals een adresregel. Het probleem is, dat die tekst verdwijnt als je iets wilt invullen, en op dat moment vergeet je vaak wat je daar had moeten invullen. Wat gebeurt er dan? De bezoeker denkt ‘laat maar, dat doe ik een andere keer wel’, waardoor je het momentum kwijt bent en mogelijk omzet misloopt. Mijn tip is om boven de invulvelden de placeholderteksten te plaatsen, zodat ze niet verdwijnen, dat scheelt echt enorm in frictie.”

Houd het simpel en overzichtelijk

Over tips gesproken, zijn er nog meer bruikbare tips om je website functioneel en intuïtief te houden? “Uiteraard. Iedere pagina moet een doel hebben en dat doel moet direct duidelijk zijn. Geef zo min mogelijk cognitieve lading mee aan de pagina, want het brein kan te veel informatie niet aan, zeker niet als het gaat om nieuwe informatie. Maak ook gelijk duidelijk wat de vervolgnavigatie is, zodat je de bezoeker van je website op dat vlak stuurt naar de gewenste pagina. Ons werkgeheugen kan ongeveer drie tot vijf items tegelijk ‘vasthouden’, dus met een banner, call to action button en het menu van je restaurant ben je er eigenlijk al. Houd je aan een maximumaantal blokken per pagina, niet meer dan dat. Creëer dus een ‘funnel’, een soort user journey, waarbij ieder stapje een doel dient. Als er sprake is van meerdere keuzes op een pagina, licht er dan één uit, zoals ‘bestellen’ of ‘reserveren’. Doe dit dan weer met een bepaalde kleur bijvoorbeeld, maar geef de bezoeker wel een keuze. Op die manier is het doel duidelijk, maar dan wel zonder de websitegebruiker te beperken in zijn of haar vrijheid.”

Toch zijn er nog veel meer zaken die een website voor gebruikers onduidelijk kunnen maken: “We bespraken net al de placeholdertekst die verdwijnt, maar iets wat voor heel veel mensen heel logisch is, zoals een button, is voor anderen weer volstrekt onduidelijk. Veel oudere bezoekers zien de button niet als iets waar ze op kunnen klikken, het is intuïtief gezien niet een knop, het strookt niet met hun representatie van een knop. Wat je daaraan kunt doen? Je kunt werken met een schaduw of omlijning, zelfs met een pijltje. Op die manier weten ook de oudere bezoekers dat het een knop is. Een nieuw ‘probleem’ is de overdaad aan iconografie; de icoontjes worden steeds vaker gebruikt en er zijn er steeds meer. Op een gegeven moment weten de mensen het niet meer… Vroeger was het duidelijk, toen had je een envelopje voor het sturen van een e-mail en een telefoontje voor het telefoonnummer, maar er zijn simpelweg te veel icoontjes nu. Een oplossing is om onder het icoontje in één woord te omschrijven wat het is.”

Wat breng je in beeld?

Veel horecaondernemers willen op hun website de sfeer van hun zaak of de gerechten die ze serveren laten zien. Zijn daar valkuilen? “Eten werkt goed, visueel gezien, maar dan moet het wel een goede foto zijn. Bovendien een foto die realistisch is, zodat de verwachting voldoet aan de realiteit. Dus niet zoals bij McDonald’s, waar je een prachtige hamburger op de foto ziet, maar vervolgens een afgetuigde schoenzool op een broodje vindt. Het laten zien van mensen is ook een goede manier om mensen te motiveren om bij jou te reserveren. Het is een vorm van ‘cognitive fluency’, waar de bezoeker van je website zich inbeeldt dat hij of zij ook kan doen wat hij op de foto ziet. Een valkuil daarbij is wel ‘visual cueing’, waardoor je als bezoeker van de website automatisch de blik volgt van degene die je op het beeld ziet. Wanneer diegene naar linksboven op het scherm kijkt, en daar staat niets, dan is dat een micro-afwijzing. Niet handig dus. Je kunt dat verhelpen door de foto te spiegelen, een ander beeld te gebruiken of een call to action button te plaatsen op de plek van de kijkrichting. Visuele lijnen moeten dus altijd wijzen naar stukjes content. Ik weet dat het allemaal een beetje raar klinkt, maar zo werkt ons brein echt.”

Tot slot. Wat zijn nu echt de belangrijkste elementen wanneer je start met de bouw of herontwikkeling van je website? Jordanov: “Logisch nadenken is het belangrijkste. Veel valkuilen heb ik genoemd, zoals de tekstjes in invulvelden, kleurgebruik, te veel informatie op een pagina en het gebruik van beeld. Tegelijkertijd moet je ook altijd rekening houden met minder rationele keuzes van je bezoekers, want het blijven mensen. De hoofdvuistregels die ik heb genoemd moet je vertalen naar een tactiek, maar de website moet je altijd blijven testen. Testen, testen, testen, dat is wat succesvolle websites zo succesvol maakt. Natuurlijk kun je pas goed testen als je genoeg data hebt; met vijf tot tien bezoekers per dag heb je nog geen goede ‘sample size’. Maar ook dan kun je gewoon aan de slag. Verander gewoon wat je mooi vindt en voer logische dingen door. Als je een grotere sample size bereikt, dan kun je meer gaan testen op nuances. Je moet gewoon ergens beginnen, en als je je aan de vuistregels houdt, dan ben je al goed op weg.”

Blijf je graag op de hoogte?

Twee keer per week het actuele en relevante restaurantnieuws in je mailbox? Schrijf je hier in voor onze digitale nieuwsbrief en blijf op de hoogte.

Overig nieuws