Als ontwerper denk je misschien niet regelmatig aan kleurenpsychologie, maar je weet waarschijnlijk dat je van iets roods honger kunt krijgen en dat een heldere, zonnig gele kamer je een luchthartig en gelukkig gevoel kan geven.
Het toepassen van de psychologie van kleur op het webdesign van e-commercesites kan ook een emotionele impact hebben op bezoekers van de site. Welke kleuren u kiest voor het ontwerp kan helpen bij de merkherkenning en zelfs hoe waarschijnlijk het is dat een klant dit doet vertrouw op uw merk.
Kleurenpsychologie is in feite de manier waarop kleur de emoties en het gedrag van mensen beïnvloedt. Zorgt het ervoor dat ze een item willen kopen? Worden ze er blij van, of laat het een serieuze kant zien?
Kleurenpsychologie is echter niet zo eenvoudig als rood maakt je hongerig en blauw maakt je kalm. Er komt veel meer kijken bij kleurenpsychologie en het heeft veel gelaagde facetten. Meer nog, als je dit voor eCommerce-sites doet, is kleurenpsychologie des te belangrijker.
Er is geen universeel geaccepteerde standaard voor hoe kleur iedereen beïnvloedt. De emoties of gevoelens die kleur creëert, zijn zeer individueel van persoon tot persoon. Je eigen levenservaringen kunnen zelfs van invloed zijn op hoe je een specifieke kleur ziet en de gevoelens die het oproept.
In de Impact of Color in Marketing Study ontdekten onderzoekers dat: 90% van de eerste indrukken komen van de vraag of de bezoeker vindt dat kleur past bij branding en of het past bij wat er wordt verkocht.
Als de klant vindt dat de kleur niet bij het merk past, is de kans kleiner dat hij het bedrijf vertrouwt.
De afhaalmaaltijd?
Wees je bewust van kleurpercepties, zoals donkere kleuren, zwart en grijs voor stoere, mannelijke producten en roze en paars voor meisjesachtige producten. Wees echter niet zo gebonden aan kleurentheorie dat u branding of de algehele esthetiek van design negeert.
Begin met een echt geweldig responsief ontwerp en dan kunt u de kleuren aanpassen om de beste voor uw specifieke merk te vinden. U zult zich ook bewust willen zijn van de balans van de witruimte en of het algehele ontwerp aangenaam is voor het menselijk oog.
Kleurtheorie gebruiken bij het ontwerpen van e-commercesites sites
Als het gaat om het toepassen van kleurentheorie op eCommerce-ontwerp, is de beste plaats om te beginnen met welke kleuren gebruikers uw product willen kopen. Ongeveer 62-90% van de mening die een klant in de eerste 90 seconden op een website geeft, wordt alleen gevormd door de kleurkeuze.
Aanbevolen literatuur:
25+ beste e-commerce WordPress-thema's voor online winkels (2020)
Met dat in gedachten, kunt u zien waarom het van vitaal belang is om de juiste kleuren voor uw ontwerp te kiezen.
Het laatste dat u wilt doen, is klanten uitschakelen zodat ze uw website verlaten.
Zoals eerder vermeld, kan welke kleur lezers kunnen verleiden, afhankelijk zijn van uw algehele branding en of die klant het als passend voor uw merk beschouwt.
Als u bijvoorbeeld motoraccessoires verkoopt, zou u waarschijnlijk geen roze koopknop gebruikenless je verkoopt specifiek meisjesaccessoires aan vrouwen. U wilt wel enige consistentie hebben in het algehele ontwerp.
Dus als u besluit rode call-to-action (CTA)-knoppen te gebruiken, moeten uw CTA-knoppen die kleur gedurende het hele ontwerp behouden. De enige uitzondering hierop is als u alleen de aandacht wilt vestigen op een bepaalde knop en niet op de andere.
Wat waarschijnlijk nog belangrijker is dan de kleur die u uiteindelijk kiest, is ervoor te zorgen dat uw kleuren consistent zijn op uw hele site. Als je besluit om rood te gebruiken om een gevoel van energie en frisheid te creëren, blijf dan bij dat kleurenpalet van call-to-action-knoppen tot aanbevolen koppen.
Zorg ervoor dat u geen botsende kleuren gebruikt die een rinkelend symbool van ergernis voor websitebezoekers kunnen creëren.
Bron: WebpageFx
Navigeren door kleurkeuzes - hoe maak ik de beste keuze?
Weten welke kleuren wanneer moeten worden gebruikt, kan wat ingewikkelder zijn, maar het is mogelijk om erachter te komen wat het beste werkt voor uw site.
Als je bijvoorbeeld een gevoel van vertrouwen wilt creëren, kan blauw een goede keuze zijn. We zullen hieronder iets meer uitleggen over welke soorten emoties en gevoelens verschillende kleuren kunnen gebruiken.
Het is ook slim om te weten welke kleuren uw concurrenten gebruiken en te beslissen of vergelijkbare kleuren goed voor u zullen werken of dat u zich wilt onderscheiden van de concurrentie met zeer verschillende kleuren. Sommige sites gebruiken kleur heel goed. Hier zijn een paar voorbeelden:
- Dick's sportartikelen maakt gebruik van een donkergroen om aan het buitenleven te denken. Omdat ze buitenuitrusting verkopen, is dit de perfecte kleurkeuze voor hen. Je vindt deze kleur in hun headers, verkoopbanners en sommige CTA-knoppen.
- Rue 21 is een online kledingbedrijf dat zich richt op tieners en jonge volwassenen. Hun kleding is fris, goedkoop en leuk. Het is niet verwonderlijk dat de kleuren die op deze site worden gebruikt jong, fris, helder blauw en roze zijn. Merk ook op dat de focus ligt op de goedkope prijsstelling met kleine felroze bubbels die de verschillende prijsklassen in de winkel aangeven. Dit zijn bijna een oproep tot actie voor de sitebezoeker.
Doelpersona's en kleur - voor wie is mijn product bedoeld?
Het is van vitaal belang om uw doelgroep en de soorten kleuren die ze van uw type website verwachten, te begrijpen. Uw eerste stap bij het kiezen van een kleurenpalet zou dus moeten beginnen met het bestuderen van uw demografische doelgroep.
Als u nog geen gebruikerspersona voor uw doelgroep heeft gemaakt, moet u er ten minste één maken.
Dit is in feite een fictieve persoon die uw meest waarschijnlijke klant vertegenwoordigt. Je kunt hem of haar een naam, eigenschappen, potentiële carrière enzovoort geven. Dit kan je helpen het publiek voor wie je schrijft beter te begrijpen, en je kunt vervolgens je inhoud - en je kleurkeuzes - afstemmen op dit persoonlijkheidstype.
Zo is aangetoond dat mannen de voorkeur geven aan blauw met 57%, gevolgd door groen (14%) en zwart (9%).
Een voorbeeld van het gebruik van blauw in combinatie met een mannelijke uitstraling is Mountain Productions Rigging Equipment and Services. Merk op hoe de kleuren diep en donker zijn, waardoor de hele pagina een mannelijke uitstraling krijgt. Blauwe accenten zorgen voor een favoriete kleur, waardoor een sterke call-to-action ontstaat, en de pagina heeft voldoende witruimte om de hele look in evenwicht te brengen.
Vrouwen geven ook de voorkeur aan blauw met 35%, op de voet gevolgd door paars met 23% en rood met 9%.
Een goed voorbeeld van het gebruik van paars in een webdesign is te zien op de website van Claire's, die betaalbare mode en sieraden verkoopt. Deze website gebruikt enkele paarse banden, maar er worden ook sterke spatten van felle kleuren gebruikt om hun jeugdige kant te laten zien, vooral in het beeld van de jonge meisjes die Claire's accessoires dragen.
De site trekt echter ook een beetje blauw in, in het besef dat blauw een favoriete en vertrouwde kleur is bij vrouwen. Je zult zelfs wat rood op deze website zien, wat bewijst dat degenen die het hebben ontworpen duidelijk begrijpen dat de meeste vrouwen deze kleuren verkiezen boven anderen.
Uiteindelijk kun je echt niet fout gaan met blauw, aangezien de meeste mensen de kleur mooi vinden en het als betrouwbaar en rustgevend zien.
Kleuren en wat ze overbrengen
Hoewel u er rekening mee moet houden dat de impact van een kleur kan variëren op basis van de ervaringen van de mensen die een bepaalde pagina bekijken, zijn er enkele vuistregels over wat elke kleur betekent die u op uw ontwerpen kunt toepassen:
1. rood
Rood heeft de neiging om over te brengen:
- Energie
- Power
- Passie
- Liefde
Rood kan opwinding creëren en het trekt de aandacht. Merk op hoe het onderstaande website-ontwerp helder en energiek is.
Fantasy Shopping gebruikt rood in beide delen van de kop en om een vraag en in het ontwerp zelf sterker te benadrukken. Merk op hoe het rood je aandacht vestigt op waar de ontwerper het wil hebben.
XStore biedt een zachter sjabloon met een rood thema, maar het blijft een gewaagd statement met de diagonale lijnen die naar het midden komen. Het focuspunt leidt je direct naar de hoofdtekst.
2. Geel
Geel roept vaak op:
- Vreugde
- Energie
- Warmte
- Vrolijkheid
Geel creëert vaak gevoelens van geluk en lichtheid.
Lipton Tea doet uitstekend werk door geel te gebruiken om een heldere en zonnige sfeer te creëren. Ijsthee wordt niet alleen geassocieerd met gelukkige tijden, maar ook met zonnethee en zomer.
De felle gele kleuren in dit ontwerp maken je blij en kunnen je helpen je het plezier van een barbecue in de achtertuin voor te stellen. Het zorgt ervoor dat je meteen naar buiten wilt rennen en wat thee wilt kopen, zodat je je eigen sun tea-brouwsel kunt maken, nietwaar?
Merk op hoe zelfs de productfoto's dit gebruik van zonnig geel weerspiegelen.
Citroen's sjabloon ook straalt warmte en levendigheid uit door hun ontwerp met een vleugje geel op de verschillende pagina's.
Gebruikers worden aangemoedigd om hun cursor over de bovenste navigatiebalk te bewegen, waardoor het doorschijnende zwart verandert in een gele lijn. Dit ontwerp benadrukt niet alleen energie, maar nodigt ook anderen uit om zich verjongd te voelen terwijl ze door hun site scrollen.
3. Zwart en grijs
Zwart en grijs creëren vaak een gevoel van:
- Autoriteit
- Power
- Sterkte
- Mannelijkheid
- Neutraliteit
Deze kleuren creëren ook een gevoel van vertrouwen en betrouwbaarheid.
Harley Davidson gebruikt zwart en grijs zeer effectief om een krachtige, mannelijke website te creëren die spreekt over macht en autoriteit. Merk op hoe de kleuren allemaal redelijk donker zijn, behalve de oranje CTA-knop.
Je kunt niet anders dan je oog laten vallen op die knop, die de sitebezoeker effectief doorsluist naar waar het bedrijf wil dat ze gaan.
Lees meer over zwarte websites en donker webdesign hier.
Phoenix-thema gebruikt ook zwart en grijs binnen zijn sjabloon en heeft een sterke en verfijnde persoonlijkheid. Het is een gelikte sjabloon met minimale afleiding.
Dit type site spreekt de zakelijke leiders aan die geen gimmicks willen en voor één doel naar de site zijn gekomen. Als je geïnteresseerd bent in het implementeren van minimalistische webontwerptechnieken en meer, wil je misschien eens kijken dit artikel over minimale WordPress-thema's.
4. Oranje
Oranje heeft de neiging om:
- Geluk
- Opwinding
- Warmte
- raffinement
Net als rood en geel kan oranje een gevoel van energie en geluk creëren. Het wordt echter ook gezien als een meer verfijnde kleur. Een goed voorbeeld van het gebruik van oranje in een ontwerp is Sunny Delight Beverages. Aangezien dit drankjes met sinaasappelsmaak zijn, is het logisch dat ze deze kleur in hun ontwerp zouden gebruiken.
Onthoud dat een deel van de psychologie van kleuren het gebruik van kleuren is die de sitebezoeker zou verwachten dat uw merk zou gebruiken. Sunny D past dit concept goed toe. Het ontwerp maakt gebruik van oranje randen, oranje navigatieknoppen en oranje in hun afbeeldingen en logo. Het naast elkaar plaatsen van de diepblauwe en witte ruimte biedt een verfijnde uitstraling die laat zien dat de drank niet alleen voor kinderen is, maar voor alle leeftijden.
Merk op hoe de sjabloon van Omega zoveel levendigheid heeft door hun ontwerp vanwege de gedurfde oranje balk. Het is een uitnodigende lay-out en alle functies die ze willen benadrukken, zijn oranje. Esthetisch gezien zou dit eenvoudige ontwerp veel waarde kunnen hebben voor een potentieel bedrijf.
5. Groen
Groen brengt vaak over:
- NATUUR
- Geld
- Vruchtbaarheid
Groen roept gevoelens van rust en ontspanning op. Je zult vaak merken zien die milieuvriendelijk zijn of gerelateerd zijn aan het buitenleven die deze kleur gebruiken. Ook kunnen financiële bedrijven groen gebruiken om te laten zien dat u geld kunt verdienen - denk aan banken, geldblogs, enz.
John Deere is een goed voorbeeld van het gebruik van groen in een website-ontwerp.
Ze gebruiken een heel specifieke tint groen en die is over de hele wereld bekend. De tractoren van het merk zijn verkrijgbaar in de kleuren groen en geel, en daarom is het alleen maar logisch dat deze kleuren in het ontwerp van de website van John Deere te zien zijn.
Er zijn immers zelfs countrysongs geschreven over "John Deere Green".
Merk op hoe het onderstaande voorbeeld van de site het heldere groen gebruikt, maar het heeft ook een mooie balans van neutrale kleuren om te voorkomen dat het groen te overweldigend wordt.
Een professionele ontwerper kan kijken naar de algehele balans van de pagina en ervoor zorgen dat de tekst wordt weergegeven op een manier die leesbaar is, maar dat de kleuren nog steeds aansluiten bij het algehele merkconcept, zoals hoe Badgeland in NZ gebruikt de kleur groen om hun merk op de site weer te geven.
Dit is een van de beste voorbeelden van een site die gebruik maakt van wat al bekend is over de kleur van hun merk en dit op een slimme manier vertaalt naar hun ontwerpconcept.
Adeline Fashion combineert omgevingsprikkels en hun markt binnen de template. Het bevat natuurlijke esthetiek in het ontwerp en laat zien hoe een merk dat meer op de natuur is gericht, deze sjabloon kan aanpassen en toch een organische aantrekkingskracht kan hebben.
6. Blauw
Blauw wordt meestal gezien als:
- Betrouwbaar
- Rustig
- Wijs
- Sereen
Er zijn veel verschillende tinten blauw en elke tint kan een andere emotie oproepen. Een diep koningsblauw kan bijvoorbeeld de indruk wekken van royalty en rijkdom. Dit is een goede kleur voor luxe merken om te gebruiken. Aan de andere kant kan een heldere aqua een gevoel van jeugd en nonchalance creëren. Een lichtblauw kan een gevoel van rust creëren.
Denk na over de dingen waarmee je verschillende tinten blauw associeert en welke tint jouw merk het beste vertegenwoordigt. Er zijn veel verschillende voorbeelden van bedrijven die de kleur blauw in hun ontwerp gebruiken.
Onthoud dat blauw een favoriete kleur is van zowel mannen als vrouwen, dus het is logisch dat deze kleur vaak voorkomt in verschillende website-ontwerpen.
Een voorbeeld van de kleur blauw die effectief wordt gebruikt in een ontwerpconcept is Skype.
Alleen al de naam doet je denken aan de lucht - en hemelsblauw. Skype neemt deze verwachting op in hun logo en in hun hele ontwerp. Merk op hoe ze een balans creëren met enkele neutrale kleuren en vervolgens een vleugje kleur in blauw toevoegen met hun oproep tot actie.
Bovendien kan het gebruik van felle kleuren duiden op jeugd, plezier of vrouwelijkheid. Zorg er wel voor dat u die kleuren met mate gebruikt, anders loopt u het risico het ontwerp en de sitebezoeker te overweldigen. De algehele esthetiek moet aangenaam en eenvoudig te navigeren zijn.
Houd er ook rekening mee dat u geel en andere lichte kleuren gebruikt die mogelijk niet op wit verschijnen of de ogen kunnen vermoeien.
Sommige mensen gebruiken liever felle kleuren op een donker webdesign.
Een dark webdesign komt echter mogelijk niet helemaal overeen met de toon van uw productaanbod. Houd er rekening mee dat een donker ontwerp een imposante, zware en mannelijke uitstraling kan creëren. Het bovenstaande voorbeeld van Harley Davidson werkt heel goed met donkere, gedurfde kleuren.
Als je echter nagellak probeert te verkopen, is deze look waarschijnlijk niets voor jou.
VG Strepre beschikt over een vergelijkbaar kleurenpalet met zijn sjabloon en gebruikt ook afgeronde knoppen. De complementaire kleur benadrukt specifieke CTA's en past goed bij het overgevoel van de site.
Het laatste dat u wilt, is dat uw CTA's overweldigend aanvoelen.
Gesplitste tests om te zien welke kleuren het beste bij uw publiek passen
Omdat individuele perceptie zo'n impact kan hebben op welke kleuren het beste werken, is het slim om op je eigen website uit te zoeken aan welke kleuren je eigen doelgroep de voorkeur geeft. Je zou ze kunnen onderzoeken, maar de antwoorden zijn misschien niet zo nauwkeurig als het uitvoeren van een aantal eenvoudige split-tests om te zien op welke ze het beste reageren.
U kunt verschillende bestemmingspagina's instellen en de resultaten van conversies, tijd doorgebracht op de pagina enz.
Sommige dingen die u misschien wilt testen, zijn onder meer:
- Kleur van koppen
- Kleur van CTA-knoppen
- Kleur van achtergrond
- Balans tussen hoofdkleur en neutrale kleuren
Probeer verschillende combinaties en kijk welke het beste werken voor uw site. Gebruik heldere, gedurfde kleuren voor uw CTA (rood, felroze, blauw).
Nature Air heeft bijvoorbeeld 17 verschillende landingspagina's uitgeprobeerd om te zien welke betere conversiepercentages had. Via A/B-tests ontdekten ze dat de meer prominente CTA-kleuren de conversies met maar liefst 591% verhoogden.
Daarnaast deed Performable een test waarbij ze de CTA-knop van hun startpagina van groen naar rood verwisselden en een toename van 21% in conversies zagen.
Rood trekt de aandacht, hoe je het ook snijdt, en het is een kleur die je op zijn minst af en toe in je site zou moeten opnemen voor een oproep tot actie. Doe je eigen A/B-testen met dit concept en kijk wat voor resultaten je behaalt.
Afhaalrestaurants voor kleurpsychologie
Kleurenpsychologie heeft zoveel verschillende elementen omdat mensen unieke individuen zijn. Zelfs de cultuur waaruit een persoon afkomstig is, kan verschillen creëren in hoe ze verschillende kleuren zien.
Uw eerste stappen bij het bepalen welke kleuren u in het ontwerp moet gebruiken, moeten beginnen met het uitzoeken wie uw demografische doelgroep is. Dit is een essentiële stap voor kleurpsychologie en eCommerce-sites.
Houd vervolgens rekening met de kleuren die de meeste mensen associëren met het type product dat wordt aangeboden. Kijk naar uw concurrentie om te zien welke kleuren zij gebruiken. Hoewel u uniek wilt zijn, wilt u zich ook aan ten minste enkele conventionele normen houden.
Voer tot slot wat A/B-tests uit om er zeker van te zijn dat je alles correct hebt geanalyseerd en sta open voor het veranderen van dingen indien nodig.
Het begrijpen van kleurenpsychologie is belangrijk, maar wees er niet zo mee bezig dat je elementaire ontwerptechnieken of gezond verstand negeert.
Alstublieft laat een nuttig geef commentaar met je mening, deel dit dan op je Facebook-groep (en) die dit nuttig zouden vinden en laten we samen de vruchten plukken. Bedankt voor het delen en aardig zijn!
Disclosure: Deze pagina kan links bevatten naar externe sites voor producten die we geweldig vinden en die we van harte aanbevelen. Als u producten koopt die we aanbevelen, kunnen we een verwijzingsvergoeding verdienen. Dergelijke vergoedingen hebben geen invloed op onze aanbevelingen en we accepteren geen betalingen voor positieve beoordelingen.
en nog veel meer ...