Donkere modus

Wat is de donkere modus?

Je pakt je telefoon in bed voor het slapengaan, het licht is uit, en het witte scherm schijnt in je gezicht als een lamp. Precies voor dat moment bestaat de donkere modus.

De donkere modus (Dark Mode) is een manier om de schermen van een website of app te tonen met een donkere achtergrond en lichte tekst en pictogrammen, in plaats van de gewone zwarte tekst op wit. De inhoud blijft hetzelfde: dezelfde knoppen, dezelfde menu's, dezelfde woorden. Alleen de kleuren veranderen, zodat het scherm rustig is voor je ogen als er weinig licht om je heen is.

Je hoort ook wel nachtmodus of donker thema. Hij zit tegenwoordig in de systemen van telefoons en computers en in de meeste apps die we elke dag gebruiken. Mensen verwachten hem daarom ook van elke nieuwe website of app.

Hoe werkt de donkere modus?

Telefoon en computer hebben een algemene instelling waarin de gebruiker kiest tussen een lichte en een donkere weergave, en sommige apparaten wisselen bij zonsondergang vanzelf. Een goed gemaakte website of app leest die instelling en opent vanaf de eerste seconde in de juiste kleuren.

Er is ook een tweede manier. Een klein knopje in de website of app, vaak met een zon en een maan, laat de gebruiker zelf wisselen tussen de twee modi. Daarna onthoudt het systeem de keuze en springt het niet bij elk bezoek terug naar de lichte modus.

Achter de schermen maakt de ontwerper twee kleurensets voor alles op het scherm: de achtergrond, de tekst, de knoppen, de randen en de tabellen. Het systeem pakt dan de juiste set voor de modus. Zie het als een kamer met twee soorten verlichting, een voor overdag en een voor de avond, terwijl de meubels op hun plek blijven.

Waarom is de donkere modus belangrijk voor jou?

Heb je een website of app, dan openen je bezoekers die op allerlei momenten van de dag. Veel van hen surfen 's avonds. De donkere modus verandert hun ervaring op die uren duidelijk:

• Rust voor de ogen bij weinig licht: een donker scherm verblindt niet in een donkere kamer, zodat de lezer het artikel kan uitlezen of langer door de producten kan kijken zonder last.
• Zuiniger met de batterij: op telefoons met een OLED-scherm staat elk zwart puntje bijna uit en gebruikt het geen stroom. Daarom vraagt de donkere modus op deze schermen minder van de batterij.
• Minder vermoeidheid bij lange werkdagen: een medewerker die de hele dag voor een dashboard of beheersysteem zit, merkt het verschil aan het eind van de dag, vooral in nachtdiensten.
• Respect voor de keuze van de gebruiker: wie op zijn telefoon de donkere weergave heeft gekozen en dan jouw felwitte site opent, krijgt het gevoel dat de site niet op hem let.

Betekent dit dat de donkere modus altijd beter is? Nee. In de zon of in een goed verlicht kantoor lezen veel mensen zwarte tekst op wit makkelijker. Het doel is dat de gebruiker zelf kiest.

Lichte en donkere modus vergeleken

Zo ontwerp je een donkere modus die prettig is voor de ogen

Alleen de kleuren omdraaien geeft meestal een slecht resultaat. Een donkere modus waar mensen zich prettig bij voelen, vraagt om veel kleine keuzes:

1. Donkergrijs in plaats van puur zwart: puur zwart naast fel wit geeft een hard contrast dat de ogen vermoeit. Een donkergrijze of marineblauwe achtergrond is rustiger.
2. Lichte tekst die niet fel is: wit met een lichte grijze tint leest prettiger dan puur wit.
3. Genoeg contrast: contrast is het verschil tussen de kleur van de tekst en die van de achtergrond. Is het te klein, dan wordt lezen lastig, vooral voor ouderen en mensen die slecht zien. De toegankelijkheidsnorm WCAG legt hiervoor een minimum vast.
4. Zachtere merkkleuren: een fel blauw of rood ziet er op een donkere achtergrond schreeuwerig uit en heeft een iets rustigere tint nodig.
5. Logo en afbeeldingen die op beide achtergronden passen: een zwart logo verdwijnt op een donkere achtergrond en heeft een lichte versie nodig. Heel felle foto's moeten soms iets worden gedempt.
6. Tabellen en grafieken: in dashboards moet je de kleuren van staven en lijnen controleren, zodat ze in beide modi duidelijk blijven.

Veelgemaakte fouten bij het toevoegen van de donkere modus

• De donkere modus aanzetten op de homepage en andere pagina's vergeten, zoals de betaalpagina of het inlogvenster, die dan ineens wit oplichten.
• Bleke grijze tekst op een donkere achtergrond die bijna niemand kan lezen.
• De keuze van de gebruiker niet opslaan, zodat de site elke keer terugvalt op de lichte modus.
• De instelling van het apparaat negeren en iedereen één modus opleggen.
• De donkere modus voor de lancering niet testen op echte telefoons, terwijl kleuren er op elk scherm anders uitzien.
• Hem pas aan het eind van het project toevoegen, als het ontwerp al klaar is, zodat hij een lapmiddel wordt in plaats van een deel van de interface.

De donkere modus in de websites en apps die wij bouwen

Bij Linkysoft plannen we de donkere modus vanaf de eerste dag van het ontwerp, niet pas als het ontwerp af is. Elke website die we bouwen binnen onze dienst webdesign en websiteontwikkeling heeft een ingebouwde donkere modus, ondersteuning voor Arabisch en schrift van rechts naar links (RTL) en de toegankelijkheidsnorm WCAG 2.2. Voor de lancering testen we alles op echte telefoons.

Bij de ontwikkeling van mobiele apps ontwerpen we elke app vanaf nul met een lichte en een donkere modus en toegankelijke schermen, voor iPhone en Android. Daarna zetten we de app in de App Store en Google Play en zorgen we voor de updates.

Is je project een beheersysteem waar je team de hele dag mee werkt, zoals een systeem voor verkoop, voorraad of personeel? Dan bouwen we het binnen onze dienst webapplicaties en beheersystemen rond de manier waarop jouw bedrijf werkt, en het draait op elk apparaat. Hier verdient rust voor de ogen een plek in het plan, want hetzelfde scherm staat acht uur of langer open voor de medewerker.

Denk je na over een nieuwe website of app? Begin met een gratis adviesgesprek bij ons, en samen bekijken we wat je gebruikers overdag en 's nachts nodig hebben.