fbpx
Nieuwsbrief

Schrijf je nu in voor onze nieuwsbrief en blijf op de hoogte van de laatste artikelen!

Kleurselectie tools die het leven van een webdesigner makkelijker maken

  • Published: 18/11/2020
  • Latest update: 06/01/2023

In dit artikel lees je hoe je het leven van een webdesigner makkelijker maakt. Ook duiken we een klein beetje in de kleurentheorie.

Een kleurenselectie maken is een van de belangrijkste onderdelen van het ontwerpen van een website. Met een verkeerde keuze kan je zomaar de plank volledig misslaan. Het klopt dan ook dat kleuren een psychologische impact hebben op mensen. De kleurentheorie toepassen kan vaak al helpen bij het kiezen van de eerste kleur. We behandelen eerst een stukje kleurentheorie en verder in dit artikel behandel ik 6 tools die het leven van een webdesigner makkelijker maken.

Waarom is kleurselectie zo belangrijk?

De eerste indruk van consumenten is voor 62 tot 90 procent gebaseerd op kleurkeuze. Dat betekent dat het vinden van het juiste kleurenschema voor je site niet alleen een esthetische beslissing is, maar ook een zakelijke. De kleuren bepalen waar jij als bedrijf voor staat en wat je daarmee uitstraalt. Het is dan van belang als ondernemer om niet gewoonweg je lievelingskleur te kiezen. Stem de kleuren af op de doelstellingen en doelgroep van je bedrijf. Stel je zelf voortdurend de vragen:

  • Wat wil je uitstralen
  • Wie is je doelgroep?
  • Waar staat mijn bedrijf voor?
  • Wat doet mijn concurrentie?

 

Als je kijkt naar de eerste tien concurrenten zie je vaak dat zij over het algemeen voor dezelfde kleurencombinaties hebben gekozen. Dit is meestal geen toeval en waarschijnlijk had je deze kleuren zelf ook in gedachten. Dat is jammer, zo val je niet op tussen je concurrenten. Wat moet je dan doen? Je kunt deze kleuren terug laten komen, maar op een creatievere en subtielere wijze. Een klant zal dan namelijk eerder geneigd zijn slechts één van die tien bedrijven met een generieke uitstraling naast jouw eigen opvallende ontwerp te leggen.

De eerste indruk van consumenten is voor 62 tot 90 procent gebaseerd op kleurkeuze. Dat betekent dat het vinden van het juiste kleurenschema voor je site niet alleen een esthetische beslissing is, maar ook een zakelijke.

De kleurentheorie in het kort

De kleur rood

De kleur rood wordt geassocieerd met energie, oorlog, gevaar, kracht, vastberadenheid maar ook met passie, verlangen en liefde. Het is een zeer emotionele en intense kleur, die staat voor stimulerend en activerend. Rood verhoogt de hartslag en ademhaling en wekt eetlust op. Het is gebruikelijk om deze kleur toe te passen voor websites van bijvoorbeeld kinderspeelgoed, restaurants of autosites.

De kleur blauw

De kleur blauw staat voor diepte en stabiliteit. Het symboliseert vertrouwen, loyaliteit, wijsheid, zelfverzekerdheid, intelligentie, geloof, waarheid en de hemel. Het impliceert loyaliteit, kalmte, kou, weinig emotie, status en macht. Daarom wordt blauw veel gebruikt in zakelijke logo’s, bijvoorbeeld op websites voor advocatenkantoren, vliegtuigmaatschappijen, software en -computer services en farmaceutische bedrijven.

De kleur geel

Focus, doelgerichtheid en positiviteit, dat is waar de kleur geel voor staat. Het is de kleur van de zon en daarmee een vrolijke en opvallende kleur. Geel stimuleert het brein, denkproces en zenuwstelsel en het wordt geassocieerd met energie, een nieuw begin, levensplezier en geluk. Door de stimulatie van het brein staat de kleur voor kennis, wijsheid, volwassenheid, maar ook voor creativiteit en fantasie. Geel kan ook negatieve associaties hebben. Denk bijvoorbeeld aan jaloezie, onbetrouwbaarheid, verraad en lafheid. Het verblijven in een overwegend gele ruimte maakt onrustig en je verliest er snel je geduld. Geel wordt vaak niet als hoofdkleur gebruikt maar meer voor accenten, waardoor het gebruikt kan worden in advertenties met aanbiedingen.

De kleur groen

Groen wordt geassocieerd met genezing, gezondheid en balans. Het is dan ook de kleur van de natuur en ontspant het zenuwstelsel en onderdrukt honger. Het kan ook de bloeddruk verlagen en is rustgevend. Het is de kleur van verse producten, vruchtbaarheid, duurzaamheid, voorjaar en nieuw leven. Een positieve kleur met associaties als balans, harmonie, evenwicht, vernieuwing, veiligheid en voorspoed. Groen wordt veelal gebruikt voor onroerend goed, warenhuizen, voeding, bedrijven die zich inzetten voor duurzaamheid en voor organische, milieuvriendelijke en diervriendelijke producten.

Merkkleuren per branche (bron: towergateinsurance.co.uk)

merkkleuren branche betekenis van kleuren
merkkleuren branche betekenis van kleuren

Je kleur afstemmen op je doelgroep

Mannen en vrouwen verschillen van elkaar, dat wordt door de meeste mensen wel erkend. Daarom is het belangrijk om naast de keuze van de juiste basiskleur(en) van je website op basis van psychologische kleurassociaties rekening te houden met de kleurvoorkeuren die mensen hebben, oftewel je doelgroep.

Als meer dan 70 procent van je doelgroep bestaat uit vrouwen dan is het zinvol om je kleurkeuze af te stemmen op wat vrouwen aanspreekt en vice versa. Voor de kleurvoorkeur van mannen en vrouwen kun je het Colour Assigment-onderzoek van Joe Hallock bestuderen (een van de betere studies op dit gebied). Opvallend is dat blauw voor beide doelgroepen de meest populaire kleur is. Een ander opmerkelijk verschil is de populariteit van paars onder vrouwen, waar deze bij mannen het minst wordt genoemd.

inspelen op man vrouw favoriete kleuren
inspelen op man vrouw favoriete kleuren

Leuke weetjes

Evolutie
Biologen uit het vakblad Current Biology hebben een verklaring voor het voorkeursverschil tussen mannen en vrouwen. In de prehistorie gingen de mannen op jacht en waren de vrouwen verantwoordelijk voor het verzamelen en plukken van voedsel. Die voorkeuren moeten in het brein zijn gekerfd. Mannen houden als jagers van blauw, de kleur van de nacht. Vrouwen geven de voorkeur aan roodachtige kleuren. Het was van levensbelang dat de vrouwen tegen alle, vooral groene achtergrondkleuren, rood herkenden. Dat is namelijk de kleur van het rijpe fruit. En bovendien de kleur van een vitale levenspartner.

Eventjes omdraaien
Van jongs af aan stimuleren we genderstereotypen bij kinderen. Blauw voor jongens en roze voor meisjes. Kinderen ontwikkelen hun kleurvoorkeuren in lijn met het beeld van hun geslacht. Gek genoeg was deze kleurverdeling tot begin vorige eeuw nog precies andersom. Vooral bij katholieken droegen jongetjes rood of roze en meisjes blauw. Jezus werd vaak in de kleuren rood en roze afgebeeld en Maria in het blauw. Daarom stonden rood en roze vroeger voor mannelijkheid en stond blauw symbool voor vrouwelijkheid.

Ecological Valence Theory
Volgens de Ecological Valence Theory (EVT) wordt ons gevoel bij een kleur voor een groot deel bepaald door de gebeurtenissen uit ons leven. Volgens de EVT ontwikkelen we kleurvoorkeuren op basis van onze eigen ervaringen met deze kleur. Jongens krijgen blauw speelgoed, meisjes roze. Daarom houden vrouwen van warmere kleuren en mannen van koelere kleuren. Mannen geven daarnaast voorkeur aan hoge helderheid en een hoge verzadiging, terwijl vrouwen liever een lage helderheid en lage verzadiging als voorkeur hebben.

Er valt nog veel meer te vertellen over kleurenpsychologie met de daarbij horende associaties, methodes en voorkeuren. Daarover kunnen we nog duizend kantjes vol schrijven, maar dat gaan we niet doen. We zijn uitgekomen bij het doel van dit artikel. Het leven van een webdesigner makkelijker maken met de volgende handige tools.

Inspiratie voor webdesigners kleurselectie
Inspiratie voor webdesigners kleurselectie

Blijf op de hoogte van het laatste nieuws

"*" geeft vereiste velden aan

Dit veld is bedoeld voor validatiedoeleinden en moet niet worden gewijzigd.

6 webdesigner tools die het leven gemakkelijker maken

Over de kleurentheorie valt heel veel te vinden en vertellen. Maar hoe weet je welke kleuren goed bij elkaar passen? Gelukkig hoef je geen meester te zijn in kleurentheorie om een werkbaar kleurenpalet samen te stellen. Een beetje gevoel voor kleur zou natuurlijk wel fijn zijn als designer. Om je te helpen bij deze belangrijke taak van kleurselectie geef ik je hier enkele van de beste gratis tools.

Het Zweedse digitale bureau Future Memories heeft een tool voor het ontdekken van kleuren gebouwd met de naam Picular. Ook wel bekend als ‘Google, maar dan voor kleuren’.

Zoals we eerder in dit artikel beschreven, heb je bij veel producten een associatie met betrekking tot de kleur. Soms hebben we een kleur nodig voor een specifiek doel of product. Als je bijvoorbeeld “oceaan” typt, dan toont de tool alle tinten blauw die relevant zijn voor de zoekopdracht. De resultaten komen in de vorm van gekleurde vormen en bieden ook de bijbehorende hex-code.

Picular is niet alleen een uitstekende tool voor designers, het helpt marketeers ook om beter te begrijpen waar merken voor staan of door welke kleuren ze kunnen worden weergegeven.

1. Picular.co – Google, maar dan voor kleuren

Het Zweedse digitale bureau Future Memories heeft een tool voor het ontdekken van kleuren gebouwd met de naam Picular. Ook wel bekend als ‘Google, maar dan voor kleuren’.

Zoals we eerder in dit artikel beschreven, heb je bij veel producten een associatie met betrekking tot de kleur. Soms hebben we een kleur nodig voor een specifiek doel of product. Als je bijvoorbeeld “oceaan” typt, dan toont de tool alle tinten blauw die relevant zijn voor de zoekopdracht. De resultaten komen in de vorm van gekleurde vormen en bieden ook de bijbehorende hex-code.

Picular is niet alleen een uitstekende tool voor designers, het helpt marketeers ook om beter te begrijpen waar merken voor staan of door welke kleuren ze kunnen worden weergegeven.

2. Make Tints and Shades

Make Tints and Shades

Het doel van deze tool is om tinten (lichtere varianten) en tinten (donkere varianten) van een bepaalde Hex-kleur nauwkeurig te produceren in stappen van 10 procent. Handig als je al een paar basiskleuren hebt, maar nog aanvullende of ondersteunende kleuren zoekt voor verlopen, randen, achtergronden, schaduwen of andere elementen.

3. Color.review – Testing colors accessibility

Color.review – Testing colors accessibility

Dit is een eenvoudige tool om de toegankelijkheid van kleuren te testen. Hiermee kun je controleren of de tekst leesbaar zal zijn. Je voert twee kleuren in en je bent klaar om te gaan. Vanwege de manier waarop onze ogen werken, wordt blauwe tekst op een witte achtergrond veel makkelijker gelezen dan een gele tekst. Wanneer je ontwerpt voor mensen, in welk medium dan ook, is dit iets om altijd in gedachten te houden.

Nog belangrijker is dat naar schatting 217 miljoen mensen met een visuele beperking leven. Om ervoor te zorgen dat je designs door zoveel mogelijk mensen kunnen worden gebruikt en gelezen, is het belangrijk om het relatieve contrast tussen je kleuren in de gaten te houden. Dit zorgt ervoor dat iedereen de kans heeft om je inhoud te bekijken, ook mensen met kleurenblindheid.

4. Sip – A better color picker for your Mac

Sip – A better color picker for your Mac

Persoonlijk een van mijn favorieten en ik gebruik hem dagelijks. Helaas alleen te gebruiken voor Mac gebruikers. Sip is een ontwerptool waarmee je kleuren kunt verzamelen, ordenen en bewerken. Het geeft je de mogelijkheid om kleuren met iedereen te delen en ze te koppelen aan de andere tools in je werkflow. Het is gemakkelijk in gebruik en bedoeld om er te zijn als je het nodig hebt en weg te gaan voordat je het weet. Je kan de tool downloaden en 15 dagen gratis gebruiken. Daarna word je geacht een licentie te kopen. Maar geen paniek, die is niet duurder dan 10 euro per jaar (verschilt per aantal devices).

Sip, A better color picker for your Mac
Sip, A better color picker for your Mac

5. Colormind

Colormind is een kleurenschema-generator die gebruik maakt van ‘deep learning’. Het kan kleurstijlen leren van foto’s, films en kunst. Zo kun je een kleurenpallet maken dat gelijk wordt toegepast op een demo-pagina. En daarnaast haalt Colormind ook kleurenpaletten uit afbeeldingen. In plaats van de meest representatieve kleuren te vinden, probeert het goede kleuren te vinden die samenwerken in een kleurenpalet.

6. ColorSpace

ColorSpace

ColorSpace is de tool om gemakkelijk en razendsnel kleurenpaletten en gradients te creëren. Wat nog meer een genot is is dat de tool gelijk de CSS code van de gradient genereert.

Blijf op de hoogte van de alle webdesign trends

"*" geeft vereiste velden aan

Dit veld is bedoeld voor validatiedoeleinden en moet niet worden gewijzigd.

Focus op wat nodig is, niet op allemaal wat mogelijk is

Er zijn miljoenen verschillende kleuren en tinten. De meeste kleurencombinaties zijn al een keer gedaan of bedacht. Neem vooral niet de moeite om alles te gaan bekijken om een kleurenschema te vinden dat bij jouw merk past. Door je te concentreren op je merk en de daarbij horende ‘ideale doelgroep’ kun je al snel een keuze maken wat betreft je primaire kleuren. Zodra je eenmaal die keuze hebt gemaakt, kun je door middel van deze online generators je eigen palet, tinten of gradiënt samenstellen. Met de juiste aanpak maak je een kleurenschema voor je website dat je kan gebruiken als startpunt van je ontwerpproces.

Laat dat maar over aan de professionals

Kom je er ook met deze tools toch niet helemaal uit? Mis je de professionele uitstraling die je voor ogen had? Dan is het moment aangebroken om een professional in te schakelen. Gelukkig voor jou hebben we bij Goeiezaak een aantal handige en creatieve designers die wel raad weten met het ontwerp – en natuurlijk de kleurselectie! – van jouw website. Neem gewoon eens contact met ons op. Dan kijken we samen hoe we jou kunnen helpen.

Neem contact op

Meer interessante artikelen

X