L’impact du mode sombre dans l’Emailing

Le dark mode (night mode ou encore mode sombre en français) est une fonctionnalité permettant d’adapter les couleurs de l’affichage d’un email (ou d’une application, d’une page web…) pour qu’il soit plus sombre.

En règle générale, il s’agit de rendre un fond clair en un plus foncé, et d’adapter l’UI en conséquence. Il peut s’agir d’afficher, par exemple, un texte de couleur claire sur un fond ou un arrière-plan sombre. L’UI correspond à Interface Utilisateur, c’est-à-dire le design général d’un site, d’une application ou d’un email.

Cela signifie qu’au lieu du texte sombre par défaut affiché sur un écran clair, appelé par opposition Light Mode, un texte de couleur claire est présenté sur un écran sombre. Il s’agit donc d’un paramètre d’affichage

Cette fonctionnalité a été popularisée par Apple sur iOS et sur MacOS en 2019, mais tous les OS proposent désormais cette fonctionnalité.

De plus en plus de plateformes utilisent et proposent dorénavant un mode sombre, que ce soit Chrome, Gmail, Instagram ou même YouTube. Nous avons déjà parlé du mode sombre dans cet article, découvrez-le pour découvrir les dernières tendances liées à l’email marketing en 2022 !

Pourquoi utiliser le mode sombre ?

Utiliser le mode nuit et ainsi activer le thème sombre est avantageux à plusieurs niveaux. Voici les trois principales raisons qui sont données par les utilisateurs du fond sombre :

  • Vos yeux se reposent

    Il fatigue moins les yeux que le fond blanc lorsque l’utilisateur se trouve dans un environnement sombre (la nuit par exemple) et utilise moins de lumière bleue, ce qui améliore donc la santé visuelle

  • Une meilleure visibilité

    Il permet une meilleure visibilité lorsque l’usager est là aussi dans un environnement peu lumineux

  • Consomme moins de batterie

    Il est plus économe en énergie sur les écrans OLED (si un fond noir #000000 est utilisé. Cela ne fonctionne pas avec du bleu foncé par exemple). Google a ainsi confirmé lors d’un webinar que le mode sombre permettait d’économiser jusqu’à 50% de la batterie des appareils possédant cette technologie.

Quelles sont les compatibilités ?

Comme il s’agit d’une technologie encore assez récente, ce mode n’est pas compatible et disponible avec la majorité des clients email. Voici une liste des messageries qui peuvent adopter cette fonctionnalité actuellement : 

  • Gmail

    Via l’application gmail sur smartphone

  • Outlook

    Via Outlook 2019 (Mac OS & Windows), Outlook.com et les app Outlook iOS & Android

  • Apple

    Ayant démocratisé le mode sombre, toutes les applications Apple Mail proposent cette option (iOS, iPadOS, MacOS)

  • Hey.com

    Un service d’emailing moderne sorti en 2020 similaire à Gmail et Outlook

Tous ces clients ne prennent pas bien en charge le mode sombre. Par exemple, Outlook.com va inverser certains fonds de couleur automatiquement. D’autres ne prendront pas du tout en charge le ciblage du mode nuit via du code (comme Gmail sur Android qui inversera les couleurs à sa convenance). 

Pour l’heure, cette technologie est encore peu mature dans les emails puisqu’elle n’est pas bien supportée. Les bons élèves sont, comme souvent, dans le développement d’emails, les applications d’Apple (MacOS, iOS, iPadOS) ainsi que hey.com, qui prennent parfaitement en charge les médias queries (commande qui permet de cibler l’affichage en fonction du type d’écran et nécessaires au dark mode.) 

Comment activer le mode sombre dans vos emails ?

Certains outils de création d’emails dits « drag & drop » permettent cette intégration (comme stripo), mais si vous codez vos emails comme le font nos experts MailSoar, voici les lignes de code que nous vous recommandons d’utiliser :

1   Dans le header de votre email marketing par exemple, il faut ajouter les lignes suivantes :

				
					<meta name="color-scheme" content="light dark"> 
<meta name="supported-color-schemes" content="light dark">

				
			

2   Dans votre style, il faut ajouter cette ligne :

				
					:root { color-scheme: light dark; supported-color-schemes: light dark; }
				
			

3  Ensuite, il faut ajouter des classes dans votre style, en spécifiant que vous ciblez le dark mode. Par exemple, pour la couleur de fond de votre email :

				
					@media (prefers-color-scheme: dark ) {
.dark-background { background-color: #272623 !important; }
}

				
			

4 – Il faudra ensuite dupliquer ces classes pour les rendre compatibles avec Outlook sur Android. Par exemple :

				
					[data-ogsc] .dark-background { background-color: #272623 !important; }

				
			

5 –  Il faudra cibler ensuite ces classes dans votre code HTML pour activer le dark mode

Vous voulez inclure le dark mode dans vos campagnes d'emailing ?

Contactez-nous dès maintenant et un de nos experts vous assistera pour l'intégration de vos codes HTML

Les bonnes pratiques du mode sombre dans l’emailing

  • Utilisez un format PNG transparent pour vos images afin d’avoir un arrière-plan et un fond transparent 
  • Pour vos textes, utilisez des couleurs avec un contraste important dans le but de garantir une lisibilité optimale de vos contenus 
  • Lorsque vous utilisez des images incorporant du texte, prenez en compte le dark mode : en effet, la couleur du texte va changer mais pas la couleur de l’arrière-plan. Il faut donc veiller à ce que même en mode sombre, le texte soit toujours lisible.
  • Comme d’habitude, testez vos emails sur différents appareils / ISPs (avec Email on Acid par exemple)
 

Comme vous l’aurez compris, peu de clients de messageries sont actuellement compatibles avec ce mode sombre. Mais si votre audience est majoritairement constituée de personnes utilisant hey.com ou les apps d’Apple, il sera tout de même intéressant d’intégrer ces fonctionnalités, qui feront de vous un « early adopter » !

MailSoar est une agence de délivrabilité vous aidant à faire croitre vos délivrabilité et par conséquent votre activité commerciale

Que vous soyez un expérimenté en emailing voulant perfectionner votre délivrabilité ou que votre ROI est fortement lié à vos campagnes emailing, notre équipe d’experts se dévoue à gérer la délivrabilité de grands envoyeurs d’emails de toutes industries.

Contactez MailSoar pour optimiser la délivrabilité de vos emails et augmenter votre réputation d’emailing avec les meilleures solutions.

Partagez cet article

À Découvrir également

Vous souhaitez améliorer votre chiffre d'affaires grâce à vos campagnes emailing ?

Nous pouvons vous aider !

Discuter avec l'un de nos experts