Grafisch ontwerp Geplaatst op: 8 augustus 2022, aangepast op: 3 december 2024
Bij het kiezen van kleuren voor je website komt meer kijken dan het kiezen van een aantal kleuren. In dit artikel gaan we in op hoe je de juiste kleuren kiest voor je website.
Je kon in ons eerdere artikel al lezen wat de betekenis is van verschillende kleuren is of hoe je een kleurenpalet maakt. Maar hoe pas je deze stappen toe op je website? Bij het kiezen van kleuren voor je website komt meer kijken dan het kiezen van een paar kleuren. In dit artikel lees je hoe je de juist kleuren kiest voor op jouw website.
De eerste, en waarschijnlijk ook de belangrijkste vraag, is natuurlijk welke kleur je moet kiezen. Rood, blauw of toch groen? Hier is geen eenvoudig antwoord op en het antwoord ligt eraan. Licht aan wat je als bedrijf (of persoon) wilt uitstralen en wie je doelgroep is. Je zult een andere kleur kiezen als je doelgroep uit professionele klusjesmannen bestaat of juist uit schoolgaande tienermeisjes. Hetzelfde geldt voor je bedrijf. Als je staat voor hoge kwaliteit en goede service, maak je een andere indruk als dan als je concurreert met lage prijzen.
Je huisstijlkleur, die je het liefst hebt gekozen na een doelgroep- en concurrentieonderzoek, kan je hierbij prima als leidraad nemen. Heb je nog geen huisstijlkleur? Lees dan meer over de betekenis van kleuren om er één te kiezen.
Kort gezegd kom je met drie kleuren al een een heel eind. Eén neutrale hoofdkleur, die je gebruikt voor de achtergrond, een kleur die je vooral gebruikt voor de tekst en een knallende accentkleur die je kunt inzetten voor call-to-actions of andere knoppen.
Maar als je goed kijkt naar een website, zul je zien dat er meerdere kleuren worden gebruikt. Bijvoorbeeld een achtergrondkleur, die het meeste van je achtergrond inneemt, de tekstkleur, die voldoende moet contrasteren met de achtergrond en de tekst van links, die weer tegen deze twee kleuren moet opvallen. En zo zijn er veel meer andere elementen die een andere kleur (of tint) moeten krijgen.
Omdat een website veel verschillende elementen heeft, zul je meer kleuren nodig moeten hebben dan andere vormen van media. Tegelijkertijd moet je website geen circusattractie worden. Er moeten niet teveel kleuren gebruikt die dat de gebruiker afleiden. In het algemeen heb je verschillende kleuren nodig voor:
Eventueel kun je nog andere kleuren gebruiken, zoals:
Als links naar andere pagina’s belangrijk zijn, kun je deze ook een andere kleur geven.
En hier eindigt het natuurlijk niet. Je kunt het zo gek maken bij het selecteren van kleuren voor op je website. Onthoud wel, dat hoe meer kleuren je hebt, het moeilijker wordt om kleuren te kiezen die goed bij elkaar passen.
Nu je een aantal kleuren hebt gekozen, en je weet waar je deze voor kunt gebruiken, kun je deze toepassen op je eigen website. Let hierbij op de basisprincipes van grafisch ontwerp en gebruik ze op zo’n manier dat je boodschap het beste wordt onderstreept. Is er bijvoorbeeld een belangrijke call-to-action die moet opvallen? Gebruik hier dan een felle kleur voor, en zorg dat deze goed contrasteert met de achtergrond.
Kleuren kunnen je ook helpen bij de hiërarchie van je website. Geef belangrijkere elementen, zoals een titel een opvallendere kleur dan bijvoorbeeld een bijschrift van een afbeelding. Bij het aanbrengen van kleur kun je ook de 60/30/10 regel gebruiken. Hierbij let je op de verhoudingen van de kleuren.
Als het goed is weet je nu hoe je kleuren moet kiezen voor op je website. Maar hoe zet je deze effectief in? Hieronder een aantal voorbeelden van websites met goed gekozen kleuren, voor jouw inspiratie.
Doriane is een designer gespecialiseerd in UI & UX, illustraties en usability. De website maakt gebruik van lila, gecombineerd met zwart en wit. Het lila geeft de website een vriendelijke uitstraling. Het zwart contrasteert erg goed op de lichte kleur. De lila achtergrond wordt verder omlaag vervangen door wit, wat de website een nog rustigere en minimalistische uitstraling geeft.
Oranje is een opvallende kleur die zeker je aandacht zal trekken. Vooral als deze wordt gebruikt om levensgrote letters van kleur te voorzien. Door de grote letters ook nog eens voor een close-up foto te leggen knalt het oranje nog meer van het scherm af. Het donkerblauw contrasteert trouwens ook mooi met de beige achtergrond. Voor de tekst is zwart gekozen, wat weer goed afsteekt op de lichte achtergrond.
Het oranje wordt verder zeer spaarzaam gebruikt als accentkleur, wat de verder een rustige uitstraling geeft. Het oranje zien we vooral gebruikt worden voor interactieve elementen, zoals het winkelwagentje en het menu aan de linker- en rechterzijde van de website. De Jean Shop is hierdoor een schoolvoorbeeld voor correct kleurgebruik.
Het oudroze van Rosaluna past perfect bij het lichte beige. Een lichte, bijna grijze, beige wordt hierbij gecombineerd. De warme tonen geven de website een natuurlijk gevoel, wat goed past bij de biologische uitstraling van het drankje.
Naast deze warme kleuren zien we hier en daar donkerblauw, wat mooi contrasteert met de rest van de website.
Een knalrode website is niet voor iedereen weggelegd, maar je maakt wel een opvallende indruk. De website van Stuidio NelNel gebruikt knalrood, met wit, donkerrood en roze op de homepage.
Doordat de kleuren in dit kleurenpalet monochroom zijn, passen ze goed bij elkaar.
De website van Vivera kiest de kleuren groen, turquoise en combineert deze met wit en oranje-rood. De groentinten geven de website een natuurlijke uitstraling, welke wordt versterkt door de organische vormen, en het wit maakt het geheel frisser.
Het felle rood contrasteert mooi met de andere kleuren en valt goed op. De smakelijke foto’s van eten voegen nog extra kleur toe en maken het geheel af.
Heb je nog meer inspiratie nodig voor het kiezen van een kleur van je website? Bekijk dan al onze kleuren of onze kleurenpaletten voor meer voorbeelden.
