Dark mode neemt in rap tempo de inbox over. Verschillende browsers, apps en besturingssystemen geven gebruikers de mogelijkheid om te schakelen naar de donkere modus. Denk aan: Apple OS en iOS, Android telefoons, Microsoft Outlook, YouTube & Google. Spotify heeft zelfs altijd al een donker design gehad. Ook in verschillende e-mail clients komt dark mode steeds vaker voor. In deze blogpost lees je meer over wat dark mode nou eigenlijk is en de mogelijkheden van dark mode voor jou als e-mailmarketeer.

• Voordelen van dark mode zijn alleen van toepassing in een donkere omgeving
• Niet alle e-mail clients ondersteunen dark mode
• Drie dark mode versies: dark UI, gedeeltelijke kleuraanpassing en auto-invert
• Praktische tips voor het werken met dark mode

De donkere modus zorgt voor een hoger contrast door e-mails een donkere achtergrond te geven en de voorgrond juist licht te maken, zoals een lichte typografie. Voor veel mensen maakt dit een e-mail prettiger leesbaar, omdat het minder vermoeiend is voor de ogen. Vooral in een donkere omgeving, denk aan ’s nachts.

Met de dark mode worden donkere componenten in de e-mail lichter en lichte componenten juist donkerder. Dat resulteert vaak in een donkere achtergrond met lichte teksten. Daarbij wordt er gekeken naar de CSS van de gehele e-mail of van HTML-attributen. Dit betekent dat afbeeldingen niet automatisch worden aangepast naar dark mode. Het kan dus gebeuren dat een afbeelding opeens een witte rand heeft als de e-mail in de donkere modus wordt geopend.

Waarom kiezen gebruikers voor dark mode in plaats van light mode? Dit heeft drie redenen. Allereerst verbruiken OLED en AMOLED schermen in de donkere modus minder energie. Als je een LCD-scherm gebruikt, dan valt de vermindering in energieverbruik relatief mee.

Ten tweede wordt ook geclaimed dat het beter zou zijn voor je ogen. Dit gaat echter alleen op als de omgeving donker is. Onze ogen zijn het namelijk gewend om objecten op een lichte achtergrond te bekijken als de omgeving is verlicht met zonlicht of een lamp. De spieren van onze ogen zijn zo erg getraind op dat contrast dat ze overdag weinig moeite hoeven te doen om een donkere tekst op een witte achtergrond te lezen.

Als je je e-mails nog even checkt wanneer je in bed ligt, dan is dark mode wel prettiger. Je ogen beginnen dan te wennen aan de donkere kamer en kunnen beter hun werk doen als het scherm ook donker is.

Tot slot kiezen veel gebruikers voor de donkere modus omdat ze dat persoonlijker mooier of fijner vinden.

Iedere e-mail client ondersteunt dark mode op een andere manier. Allereerst is het belangrijk om te weten welke e-mail clients dark mode überhaupt wel of niet ondersteunen. Hiervan vind je een lijstje hieronder.

Daarnaast verschilt het dus per e-mail client welke versie van dark mode wordt ondersteund. Er zijn drie versies.

Sommige e-mail clients, zoals Apple Mail, bieden de gebruiker de mogelijkheid om de app zelf in donkere modus te gebruiken. Als een gebruiker hiervoor kiest wordt alleen de inbox zelf zwart met witte letters. Dit heeft verder geen impact op de e-mails zelf, die houden hun oorspronkelijke kleur.

Als een e-mail client deze versie ondersteunt, wordt er in de e-mail gekeken of er een lichte achtergrond is en/of een donkere tekst. Zo ja, dan wordt dit omgezet. Mocht je e-mail al donkere vlakken bevatten, dan worden deze niet aangepast.

Bij deze versie worden alle kleuren automatisch omgedraaid, waardoor e-mails met een donkere achtergrond en lichte tekst juist een lichte achtergrond en donkere tekst krijgen. Het design wordt dus volledig omgedraaid. Dit gebeurt ook andersom.

Hieronder zie je een overzicht waarin per e-mail client staat aangegeven welke versie van dark mode wordt ondersteund.

Wat nu als je als developer je eigen kleurthema voor je e-mails hebt ontwikkeld? Je wilt dat het kleurenthema behouden blijft of in ieder geval mooi wordt weergegeven in dark mode. Hiervoor moet je in de CSS duiken. Met ‘prefers-color-scheme’ kan je verschillende voorkeuren schrijven in de CSS van je e-mail. Dit kun je op twee verschillende manieren doen.

1. @media (prefers-color-scheme: dark) werkt voor Outlook op Apple en Apple Mail.
2. [data-ogsc] en/of [data-ogsb] werkt voor Outlook op Android-systemen. Zie hier een voorbeeld van in de afbeelding hieronder.

Bij alles is het dus belangrijk dat je weet welke e-mail clients het meest worden gebruikt door jouw e-mailontvangers. Je kunt bovenstaande CSS ook met elkaar combineren, zodat de e-mail goed leesbaar is in meerdere e-mail clients.

Dark mode is een snel opkomende ontwikkeling. Steeds meer e-mail clients zullen dit ondersteunen. Daarom is het belangrijk om jezelf als e-mailmarketeer de vraag te stellen: Zijn mijn e-mails in de donkere modus nog goed leesbaar of moet ik aanpassingen doorvoeren?

Verder hebben we nog een aantal praktische tips voor je:

• Gebruik plaatjes met een transparante achtergrond en in .png-formaat. Zo veranderen ze op een mooie manier mee in de omschakeling naar dark modus. Geen witte kaders op een donkere achtergrond.
• Voeg een witte subtiele rand toe om je donkere content. Als je donkere afbeeldingen met een transparante achtergrond gebruikt, zullen deze wegvallen als de achtergrond ook donker wordt.
• Gebruik geen witte teksten in je e-mails. Zo ben je er zeker van dat de teksten in je e-mails altijd goed te lezen zijn, in welke modus die ook worden bekeken. Je kunt beter kiezen voor een kleur die niet donker en niet licht is, zoals blauw. Met deze tool, contrast-ratio, zie je het contrasteffect van een bepaalde kleur als je switcht tussen dark mode en light mode.
• Maak bij vaste plaatjes, zoals je logo, twee versies op. In de HTML van je e-mail kun je dan aangeven welke van de twee versies getoond dienen te worden in welke situatie.

Dark mode is een leuke uitdaging geworden voor e-mailmarketeers. Smartphone-gebruikers kunnen bij steeds meer e-mail clients instellen of ze een e-mail in dark mode willen lezen. Ze kiezen daar ook graag voor. Het leest prettiger in het donker, voor veel telefoons werkt de dark mode zuiniger en ze hebben er een persoonlijke voorkeur voor.

Aan jou als e-mailmarketeer de taak om te kijken hoe jouw e-mails er in dark mode uit komen te zien. Blijft de e-mail die je hebt gebouwd goed leesbaar ongeacht de modus waarin deze wordt gelezen? Maar ook: welke e-mail clients gebruiken jouw e-mailontvangers? Dit is niet altijd een eenvoudige klus, maar hiermee speel je in op de voorkeuren van je subscribers.

Bij 100%EMAIL is jouw ambitie onze drijfveer, want ieder e-mailvraagstuk verdient het een succesverhaal te maken. Met onze gestructureerde en volledige aanpak én ons gedreven en ervaren team van e-mailexperts halen we buitengewone resultaten. Zo creëren we samen met onze klanten succesverhalen.

Je hebt direct contact met je eigen e-mailexpert en daarachter een team van experts. Je krijgt dus niet te maken met dure tussenlagen, zoals projectmanagers of accountmanagers. Bovendien zijn we software onafhankelijk, dat betekent dat we verder werken in jouw e-mailsoftware of marketingplatform.

Dus, zeg het maar… Gaan wij samen van jouw e-mailambitie een succesverhaal maken?

Bel ons gerust voor een vrijblijvend gesprek over jouw uitdagingen. Je kunt ons per telefoon bereiken op 010 – 254 03 20, of een e-mail sturen naar info@100procent.email.