Qu’est-ce que le mode sombre et comment l’utiliser ?
Le mode sombre est une option de schéma de couleurs destinée aux interfaces utilisateur, aux applications et aux systèmes d’exploitation, qui utilise une palette de couleurs plus sombres, généralement avec des arrière-plans noirs ou gris et du texte clair. Ce mode a gagné en popularité car il permet de réduire la fatigue oculaire, d’économiser la batterie et d’offrir une expérience visuellement agréable aux utilisateurs. De nombreux clients de messagerie et systèmes d’exploitation prennent désormais en charge le mode sombre, modifiant l’apparence des e-mails en fonction des paramètres de l’utilisateur.
Modèles dédiés au mode sombre dans GetResponse
GetResponse propose plusieurs modèles spécialement conçus pour s’afficher de manière optimale en mode sombre. Ils constituent un excellent point de départ si vous souhaitez que votre message s’affiche correctement quel que soit le mode ou le client utilisé.
Pour trouver un modèle compatible avec le mode sombre, saisissez dark mode dans le champ de recherche situé à droite de l’écran de sélection des modèles.
Aperçu en mode sombre
GetResponse propose une fonctionnalité d’aperçu en mode sombre dans l’éditeur, vous permettant de voir à quoi ressemblera votre message en mode sombre. Toutefois, cet aperçu peut ne pas refléter fidèlement l’apparence de votre e-mail sur tous les appareils ou clients de messagerie. Chaque système d’exploitation et chaque client de messagerie applique des règles différentes pour le traitement des messages en mode sombre, ce qui peut entraîner des variations d’apparence.
L’aperçu en mode sombre ne doit être utilisé qu’à titre indicatif, car il ne garantit pas que le message s’affichera exactement comme dans l’aperçu pour chaque destinataire utilisant le mode sombre. Nous vous recommandons de toujours tester votre message en envoyant un e-mail de test à un véritable client de messagerie, en gardant à l’esprit que chaque client peut l’afficher différemment.
Pour visualiser l’aperçu du message en mode sombre :
- Lors de la rédaction du message, passez la souris sur Test et aperçu, puis cliquez sur Aperçu dans le coin supérieur droit de l’écran.

- Déplacez le curseur Aperçu Mode sombre situé dans le coin supérieur droit de l’écran.

Si votre message nécessite encore des ajustements – par exemple, si un logo devient difficile à distinguer ou si les couleurs des boutons perdent en contraste – vous pouvez utiliser le CSS personnalisé pour affiner son apparence.
Problèmes courants et solutions
- Couleurs inversées : certains clients e-mail peuvent inverser les couleurs de votre message, ce qui le rend difficile à lire.
Pour y remédier, utilisez des images à fond transparent plutôt que des images de couleur unie, et évitez d’utiliser des images contenant du texte. - Contraste insuffisant : un texte clair sur fond sombre peut être difficile à lire.
Pour améliorer la lisibilité, augmentez le contraste entre les couleurs d’arrière-plan et celles du texte dans l’éditeur. Cela aidera également les clients e-mail à maintenir un contraste adéquat en mode sombre. - Éléments manquants ou invisibles : les éléments (tels que les images) de couleur sombre peuvent ne pas être visibles en mode sombre s’ils sont placés sur un fond blanc qui est inversé en noir par le client e-mail.
La solution la plus simple consiste à jouer sur les couleurs d’arrière-plan et celles des images utilisées afin d’obtenir un contraste satisfaisant. Vous pouvez parfois utiliser une image avec un arrière-plan non transparent pour qu’elle soit visible, si vous souhaitez éviter d’avoir recours à du code personnalisé. - Problèmes de visibilité du logo ou d’une image : votre logo peut manquer de contraste par rapport à l’arrière-plan du mode sombre, en particulier s’il possède un arrière-plan transparent.
Exemple : l’ajout d’un texte noir dans un fichier PNG servant de logo avec un fond blanc donnerait toujours un texte noir sur fond transparent sur le fond désormais inversé (noir ou gris), ce qui rendrait le logo invisible.
Les solutions possibles dans ce cas sont les suivantes : utiliser une autre couleur pour votre logo ; utiliser un fond non transparent pour le logo ; personnaliser le code du message afin d’adapter ses couleurs au mode sombre.