Optimiser les e-mails marketing pour le mode sombre

Dans l’éditeur d’e-mails, vous pouvez prévisualiser l’affichage des e-mails marketing en mode sombre pendant que vous modifiez ou générez des aperçus pour des clients de messagerie spécifiques. Cela permet de s’assurer que les destinataires qui consultent vos e-mails marketing en mode sombre puissent les voir comme ils le souhaitent. 

Prévisualiser le mode sombre dans l’éditeur d’e-mails

Pour passer en mode sombre à l’aperçu de votre e-mail lors de l’édition :

1. Depuis votre compte HubSpot, accédez à Marketing > E-mail.
2. Cliquez sur le nom d'un brouillon d'e-mail.
3. Dans l’éditeur d’e-mails, cliquez sur Options d’affichage en haut de la page, puis activez l’option Aperçu du mode sombre.

Prévisualisation du mode sombre dans des clients spécifiques

Pour voir comment votre e-mail s’affiche dans des navigateurs ou clients de messagerie spécifiques avec le mode sombre activé :

1. Depuis votre compte HubSpot, accédez à Marketing > E-mail.
2. Cliquez sur le nom d’un e-mail rédigé.
3. Dans l’éditeur d’e-mails, cliquez sur Aperçu et test dans l’angle supérieur droit, puis sélectionnez Aperçu dans un client de messagerie.
4. Sur l’écran d’aperçu, cliquez sur le menu déroulant Choisir un type d’aperçu dans l’angle supérieur gauche, puis sélectionnez la case à cocher en regard de chaque type d’aperçu. Pour voir le type d’aperçu disponible pour le mode sombre, saisissez « sombre » dans la barre de recherche. 

5. Dans le coin supérieur droit, cliquez sur Aperçu.

Comprendre les meilleures pratiques de conception d’e-mails pour le mode sombre

Différents clients de messagerie et navigateurs peuvent afficher le mode sombre différemment. Gardez les suggestions suivantes à l’esprit lorsque vous concevez des e-mails à afficher en mode sombre : 

• Utilisez des images qui apparaîtront clairement sur les arrière-plans clairs et foncés : convertissez toutes les images au format .png pour vous assurer qu’elles apparaissent correctement si la couleur d’arrière-plan est inversée. 
• Assurez-vous que les couleurs du texte contrastent suffisamment : respectez les directives d’accessibilité du contenu web et assurez-vous qu’il y a suffisamment de contraste entre les couleurs du texte et les couleurs d’arrière-plan.
• Ajouter une requête média pour le mode sombre : certains clients de messagerie offrent une prise en charge limitée du style personnalisé à l’aide de requêtes média. Vous pouvez utiliser la fonction Média pour définir l’affichage prefers-color-scheme des images et du texte en mode sombre. Cette option est uniquement disponible pour les modèles d’e-mail créés dans le gestionnaire de conception.