Gebruikersgerichte
lay-out en kleurinvloed

Elke gebruiker is uniek, dus een pagina zal niet door iedereen op dezelfde manier of in dezelfde volgorde worden bekeken. Desondanks is er in grote lijnen enige voorspelbaarheid in hoe een bezoeker dit zal doen. Een goede webdesigner houdt hier rekening mee en zal daarnaast proberen een bepaald pad uit te stippelen om de bezoeker de juiste richting in te leiden.

Focuspunten

Een goed ontworpen webpagina heeft enkele focuspunten waarnaar de meeste aandacht toe zou moeten gaan. Focuspunten zijn elementen op de pagina die extra opvallen en waar je ogen als het ware als vanzelf naar toe gaan. Een conversiebutton, die de bezoeker moet verleiden tot het overgaan tot een bepaalde actie, is bijvoorbeeld zo'n focuspunt. Als de pagina teveel opvallende elementen bevat, wordt de aandacht verdeeld en verliest het juist zijn kracht. Het benadrukken van een element kan op verschillende manieren, bijvoorbeeld door grootte, kleurgebruik, met beeld of bijvoorbeeld door het gebruik van een kader rondom het element. In dit artikel gaan we in het bijzonder in op de invloed van kleurgebruik in webdesign.

De beleving van kleuren op websites

Behalve dat je met kleur de aandacht kunt leggen op elementen, wekt het ook emotie op. Over het algemeen worden geel, bruin, beige, rood en oranje gezien als warme kleuren en groen, grijs, paars en blauw als koud. Pure verzadigde kleuren zoals fel rood en knalgroen kunnen een jeugdige en energieke uitstraling geven. Ze zijn gewaagd en hebben karakter, maar kunnen bij overmaat wel vermoeiend zijn aan de ogen.

Als je wilt dat een website betrouwbaarheid of zakelijkheid uitstraalt zijn koele kleuren vaak de beste keus. Koele kleuren kunnen voor veel doeleinden ook goed gecombineerd worden met warme kleuren. Het is wel belangrijk om het bij 2 of 3 kleurtonen te houden om het niet te chaotisch te maken.

Kleurgebruik en usability

De juiste toepassing van kleur kan ook bijdragen aan de gebruiksvriendelijkheid op een webpagina. Je kunt bijvoorbeeld overeenkomsten of juist verschillen tussen elementen duidelijk maken. Zoals al gezegd kan je met kleur ook de hiërarchie van elementen aangeven op een pagina, dus de volgorde van prioriteit.

De achtergrond van een webpagina mag bijvoorbeeld nooit de aandacht opeisen. Een goed uitgangspunt kan zijn om warme kleuren op de voorgrond te gebruiken en koude kleuren op de achtergrond. Als je naar buiten kijkt zijn dingen in de verte vaak blauwer dan op de voorgrond. Ook geldt dat hoe verder weg, hoe zachter en vager iets is, dit geldt voor zowel de vorm als de kleur. Door dit toe te passen op webdesign, creëer je de beleving van diepte en dit zorgt ervoor dat bezoekers weten waar ze naar moeten kijken.

Smart

Afbeelding 1: website mijnsmart.nl

Op de website www.mijnsmart.nl (zie afbeelding 1) draagt de vage, lichtgroene achtergrondkleur bij aan de juiste sfeer en uitstraling en ligt de nadruk op de auto's. Uiteraard wordt de aandacht ook getrokken naar de elementen in het knaloranje die moeten leiden tot een conversie.

Lay-out als geheel

Naast het feit dat de verschillende elementen op de site duidelijk moeten zijn voor de gebruiker, is de lay-out van een webpagina als geheel net zo belangrijk. Het bepaalt in grote mate of een bezoeker blijft of direct vertrekt. Dus ook al heb je je aan alle regels van usability gehouden, een bezoeker kan al vertrokken zijn voordat hij de inhoud van de pagina echt heeft bekeken, omdat het geheel geen juiste uitstraling heeft. Factoren als symmetrie, orde, esthetiek en herkenbaarheid spelen dan ook een belangrijke rol in de beleving en het gedrag van een bezoeker op een webpagina en dus bij webdesign.

Welke kleur is het beste?

Ondanks alle usability-tests en onderzoeken naar gedrag op websites is er geen 'one size fits all' antwoord op de toepasbaarheid van kleuren op websites. De juiste kleur van bijvoorbeeld een conversiebutton is afhankelijk van het onderwerp en doel van de site, de doelgroep en de rest van de lay-out op de pagina. Oranje wordt door velen gezien als de ultieme kleur voor een conversiebutton, maar als deze kleur al teveel op de hele pagina wordt gebruikt zal het niet werken. Ook als de kleur niet goed past in de rest van de lay-out kan het juist een conversiekiller zijn. Dit soort vraagstukken zijn echter op een geweldige manier te beantwoorden door middel van een A/B-test.

Meer informatie?

Wilt u meer weten over de mogelijkheden van webdesign en usability voor uw website? Stel ons gerust uw vraag!