Bekijk en optimaliseer hoe uw e-mailontwerpen eruit zullen zien in de donkere modus

Veel e-mailclients hebben een instelling voor een donkere modus, wat kan leiden tot inconsistenties met hoe uw marketinge-mails worden weergegeven in clients met een helderder uiterlijk ingeschakeld.

Bekijk hoe uw e-mail eruitziet in de donkere modus van bepaalde clients

Om te zien hoe uw e-mail eruitziet wanneer een contactpersoon deze opent in een browser of client met donkere modus ingeschakeld:

• Navigeer in uw HubSpot-account naar Marketing > E-mail.
• Klik op de naamvan een bestaande e-mail die is opgesteld.
• Klik rechtsboven in de e-maileditor op het vervolgkeuzemenuActies en klik vervolgens op Voorbeeld.
• Klik boven in het voorbeeldscherm op Clients.
• Schakel onder Donkere modushet selectievakje innaast de client waarvan u een voorbeeld wilt bekijken.

• Klik rechtsboven op Testmijn e-mail nu.

Beste praktijken bij het ontwerpen van e-mails voor de donkere modus

Wanneer u een voorbeeld van uw e-mail bekijkt met verschillende clients in de donkere modus, moet u in gedachten houden dat elke client uw e-mail anders kan weergeven. Als uw contactpersonen uw e-mail bijvoorbeeld openen met Apple Mail, ziet de e-mail er precies hetzelfde uit, of ze de donkere modus nu wel of niet hebben ingeschakeld. Maar als een contactpersoon de donkere modus inschakelt in apps als Gmail of Outlook op Windows, zie je mogelijk drastischer verschillen in de opmaak van je e-mail, zoals omgekeerde achtergrondkleuren.

Lees de onderstaande tips om te controleren of de opmaak van uw e-mail consistent is tussen verschillende clients.

Gebruik afbeeldingen die zowel op een lichte als donkere achtergrond goed uitkomen

Converteer uw afbeeldingen naar PNG-bestanden voordat u ze uploadt en toevoegt aan uw e-mails. Zo bent u er zeker van dat ze worden weergegeven in e-mailclients die automatisch de achtergrondkleur van e-mails in de donkere modus omkeren. Als uw afbeelding tekst bevat, zoals een logo, kunt u ook een doorschijnende omlijning rond de tekst toevoegen om deze te laten opvallen.

Kies voor webtoegankelijke kleuren

Het is belangrijk dat de inhoud van uw e-mail toegankelijk is, ongeacht de e-mailclient die uw ontvanger gebruikt. Door de toegankelijkheidsnormen in acht te nemen, zoals het controleren van het kleurcontrast van uw tekst, zullen uw e-mails ook in de donkere modus correct worden weergegeven. Lees meer over webtoegankelijke kleuren op de HubSpot blog.

Geef een media-query op voor styling in donkere modus in iOS

Verschillende e-mailclients, waaronder Apple Mail en Outlook.com, bieden beperkte ondersteuning voor het detecteren en toevoegen van aangepaste styling via een media-query. Als je de bijgewerkte klassieke e-maileditor gebruikt en je beschikt over ontwikkelaarsbronnen om CSS-wijzigingen in je e-mails aan te brengen, kun je een media-query toevoegen met de media-functie prefers-color-scheme om te configureren hoe afbeeldingen en tekst eruit zullen zien in donkere modus en lichte modus