← Terug naar blog

Dark mode op je website: wanneer is het zinvol?

Close-up van de maan tegen een donkere hemel

Op telefoons en laptops is dark mode allang geen niche meer: een flink deel van de gebruikers heeft het besturingssysteem permanent op donker staan, en apps schakelen automatisch mee. Websites blijven daarbij achter — de meeste zijn simpelweg alleen licht. Moet jouw website ook een donkere modus krijgen? Soms wel, vaak niet. Dit is een eerlijke afweging, plus de ontwerpregels voor wie ervoor kiest.

Wat is dark mode op een website?

Dark mode is een tweede kleurenschema van je website met donkere achtergronden en lichte tekst. De browser weet via de systeeminstelling of een bezoeker donker prefereert (technisch: de prefers-color-scheme-instelling die je in CSS kunt uitlezen), zodat de site automatisch in de juiste modus opent. Vaak krijgt de bezoeker daarnaast een schakelaar om zelf te wisselen.

De voordelen — en de eerlijke nuance

Donkere weergave is rustiger voor de ogen in donkere omgevingen, spaart batterij op OLED-schermen en sluit aan bij wat een groeiende groep gebruikers gewend is: wie ’s avonds van een donkere app naar jouw spierwitte website springt, krijgt letterlijk een flits in het gezicht. De nuance: voor de gemiddelde bedrijfswebsite waar bezoekers overdag vijf minuten rondkijken, is dark mode geen conversieverhoger. Het is comfort en uitstraling, geen omzetknop. De doorslag hangt af van je publiek en gebruiksmoment: developer-tools, dashboards, portalen waar mensen lang in werken en media die ’s avonds geconsumeerd wordt profiteren duidelijk; een brochuresite voor een installatiebedrijf niet.

Ontwerpen voor donker is meer dan kleuren omdraaien

  • Geen puur zwart en puur wit: wit op gitzwart geeft schittering. Gebruik donkergrijs (bijvoorbeeld antraciet) met gebroken wit voor tekst.
  • Demp verzadigde kleuren: je felle merkkleur die op wit prachtig oogt, kan op donker gaan “gloeien”. Maak accentkleuren iets lichter en minder verzadigd.
  • Controleer contrast opnieuw: de toegankelijkheidseisen (WCAG) gelden voor beide modi. Test elke tekst-op-achtergrond-combinatie apart.
  • Denk aan beeld en logo’s: een donker logo verdwijnt op een donkere achtergrond; transparante PNG’s met donkere randen worden lelijk. Vaak zijn aparte beeldvarianten nodig.
  • Diepte werkt anders: schaduwen vallen weg op donker; hiërarchie maak je er met tinten (lichter = dichterbij) in plaats van slagschaduw.

Wat betekent het voor bouw en onderhoud?

Technisch is dark mode goed te doen: als de site met CSS-variabelen voor kleuren is opgezet, is het tweede schema een kwestie van een tweede set variabelen plus een schakelaar die de keuze onthoudt. De echte kosten zitten in ontwerp en onderhoud: élk nieuw blok, elke banner en elke afbeelding moet voortaan in twee modi kloppen, en getest worden in twee modi. Reken dus niet alleen de bouw, maar ook het blijvende dubbele testwerk mee in je beslissing. Wie het halfslachtig doet — dark mode die op drie pagina’s klopt en op de rest kapot oogt — was beter af geweest zonder.

Conclusie

Dark mode is zinvol als je bezoekers lang of ’s avonds met je site werken, en gewoon overbodig voor menige bedrijfssite. Kies je ervoor, doe het dan volledig: gedempte kleuren in plaats van omgedraaide, opnieuw getest contrast, passende beeldvarianten en structureel dubbel testwerk. Een goede dark mode voelt als een cadeautje voor je gebruikers — een slechte als een kapotte website.

← Terug naar blog

Geplaatst in de categorie: Design