Affichage d’infolettres en mode sombre
Le mode sombre, un casse-tête pour les infolettres!
ADAPTEZ VOS INFOLETTRES À CETTE FONCTIONNALITÉ!
Saviez-vous qu’une proportion non-négligeable de vos destinataires voient vos infolettres d’une manière complétement différente en raison de leur sélection d’affichage?
Disponible à l’ensemble de vos destinataires, l’option d’affichage en « mode sombre » altère l’affichage des couleurs dans la quasi-totalité des environnements lorsqu’elle est sélectionnée par l’utilisateur.
Saviez-vous qu’une proportion non-négligeable de vos destinataires voient vos infolettres d’une manière complétement différente en raison de leur sélection d’affichage?
Disponible à l’ensemble de vos destinataires, l’option d’affichage en « mode sombre » altère l’affichage des couleurs dans la quasi-totalité des environnements lorsqu’elle est sélectionnée par l’utilisateur.
Quelle est la provenance du mode sombre?
Antérieurement disponible uniquement aux utilisateurs de certains sites web ou applications mobiles, Apple et Google ont pullulé l’affichage des éléments graphiques en « mode sombre » depuis l’été 2019. À compter de ce moment, cette nouvelle fonctionnalité n’a pas cessé d’être favorisée par les utilisateurs d’iPhone et d’Android, se propageant dans les navigateurs de recherche et même dans les systèmes d’exploitation tel que Windows.
Quels sont les bénéfices pour le consommateur?
Selon plusieurs études, les bienfaits proviendraient d’une baisse d’exposition à la lumière des écrans :
Augmentation de la qualité du sommeil :
En soirée, notre cerveau produit de la mélatonine, une hormone favorisant le sommeil. L’exposition prolongée à la lumière de nos appareils peut cesser cette production. En activant le « mode sombre », le consommateur réduit de manière significative l’exposition à la lumière.
Prolongement de la santé oculaire :
Le « mode sombre » permettrait d’éviter les maux de tête reliés à l’exposition de la lumière tout en préservant la qualité oculaire des consommateurs d’écrans.
Accentuation de la durée de vie de la batterie des appareils :
En produisant moins de lumière, le « mode sombre » augmenterait non seulement la durée de vie de la charge de votre batterie, mais également de votre appareil électronique.
Il semble donc relativement intéressant de passer du « côté sombre » pour le consommateur, mais cela n’est pas sans conséquences pour les développeurs d’applications, de sites web et d’infolettres!
Comment activer le mode sombre?
Vous pouvez aisément activer le « mode sombre » de votre appareil de cette manière :
iPhone et iPad
Mac
Android
Windows (Outlook)
Navigateurs
iPhone et iPad
| Modifiez l’affichage des couleurs de vos appareils à l’aide des étapes suivantes : | ||
 |
Dans les versions iOS plus récentes, simplement balayez votre appareil à partir du coin supérieur droit afin d’accéder aux fonctionnalités rapides, puis sélectionnez le « mode sombre ».
 |
|
| * Système d’exploitation : iOS13 et plus. | ||
Mac
Activez le « mode sombre » de votre Mac à l’aide du menu « Apple » de cette manière :
* Système d’exploitation : iOs13 et plus.
- Cliquez sur le menu « Apple » dans le coin supérieur gauche de votre écran.
- Sélectionnez « Préférences Système ».
- Cliquez sur l’icône « Général ».
- Activez le « Mode sombre ».
* Système d’exploitation : iOs13 et plus.
Android
Activez le « mode sombre » de votre appareil de cette manière :
- Balayez votre écran à partir du coin supérieur gauche de votre appareil.
- Accédez à vos paramètres en cliquant sur l’icône d’engrenage.
- Défilez jusqu’à la section « Affichage ».
- Activez le « Mode sombre ».
* Système d’exploitation : Android10 et plus.
Windows (Outlook)
Passez votre Outlook au « mode sombre » à l’aide du menu « Windows » de cette façon :
* Système d’exploitation : Windows10 et plus.
- Cliquez sur le menu « Windows » dans le coin inférieur gauche de votre écran.
- Sélectionnez l’icône « Paramètres » situé au-dessus de l’icône d’alimentation.
- Cliquez « Couleurs » dans le menu latéral.
- Activez le « Mode sombre ».
* Système d’exploitation : Windows10 et plus.
Navigateurs
L’activation du « mode sombre » diffère selon le navigateur utilisé :
Firefox
Edge
Chrome
Le « Mode sombre » est disponible sur le navigateur Chrome à partir d’une extension.
Firefox
- Cliquez sur le menu hamburger situé dans le coin supérieur droit du navigateur.
- Défilez jusqu’à l’option « Paramètres » du sous-menu.
- Activez le « Mode sombre ».
Edge
- Cliquez sur les trois petits points situés dans le coin supérieur droit du navigateur.
- Défilez jusqu’à l’option « Paramètres » du sous-menu.
- Sélectionnez la catégorie « Apparence » dans le menu latéral.
- Activez le « Mode sombre ».
Chrome
Le « Mode sombre » est disponible sur le navigateur Chrome à partir d’une extension.
- Cliquez sur les trois petits points situés dans le coin supérieur droit du navigateur.
- Défilez jusqu’à l’option « Paramètres » du sous-menu.
- Sélectionnez la catégorie « Apparence » dans le menu latéral.
- Cliquez sur « Thème ».
- Faites une recherche pour « Dark mode » dans la barre de recherche.
- Sélectionnez l’extension « Dark mode » tel que présenté ci-dessous.
- Cliquez sur « Ajouter à Chrome », puis confirmez l’ajout
- Cliquez sur la « Pièce de casse-tête » figurant à droite dans le menu du navigateur et activez l’extension.
Quels sont les changements de couleurs du mode sombre?
Lorsque sélectionné par les utilisateurs, le « dark mode » modifie l’affichage des couleurs claires d’un appareil pour leurs alter-egos foncés. Les utilisateurs naviguent désormais dans un environnement foncé, ce qui inclus leurs boîtes de réception et… l’affichage des infolettres reçues!
Mais attention : si l’objectif est toujours de passer du clair au foncé, les techniques utilisées par leurs créateurs diffèrent d’un système à l’autre. Conséquemment, les résultats ne sont pas pareils d’un environnement à l’autre!
Certains systèmes modifieront l’affichage de l’ensemble du système d’exploitation ce qui inclura les applications et leurs contenus tandis que d’autres se limiteront à l’environnement de l’appareil.
Ainsi, le mode sombre n’altérera pas forcément les couleurs de vos infolettres, car trois (3) résultats du mode sombre sont possibles :
Inversion immuable :
Malgré l’activation du mode sombre, l’infolettre demeure inchangée. Seulement l’environnement autour du courriel est assombri, tel que la boîte de réception.
Cette situation est applicable dans les environnements suivants :
- Apple Mail (MacOS)
- Application native iPhone | iPad (iOS)
- Toutes les boîtes de réception consultées dans un navigateur, et ce, même si le navigateur et le système d’exploitation utilisent le mode sombre.
Inversion partielle :
Dans certains environnements tels que les applications, seules les couleurs pâles des infolettres sont affectées par le mode sombre. Elles seront ainsi remplacées par des couleurs foncées. Les textes et les couleurs de fond seront notamment affectés.
Les inversions partielles ont été notées dans les applications suivantes :
- Outlook app (iOS)
- Outlook app (Android)
- Gmail app (Android)
- Yahoo! (Android)
Inversion complète :
La complexité réelle du mode sombre réside dans les environnements dans lesquelles une inversion complète des couleurs est appliquée. Outre le blanc, le gris pâle deviendra foncé, le jaune clair deviendra brun, etc.
L’inversion de la palette complète des couleurs est associée aux environnements suivants :
- Outlook (PC)
- Gmail app (iOS)
- Yahoo! (iOS)
Comment optimiser vos infolettres pour le mode sombre?
Le mode sombre entraînera forcément des altérations de vos infolettres et vous devez adapter vos techniques d’intégration en fonction de cette réalité. Vous devez donc contrer le mode sombre, et ce, spécialement pour les environnements à inversion complète de la palette de couleurs.
Particulièrement, les éléments visuels et textuels de vos infolettres doivent demeurer visibles et l’esthétisme de vos infolettres doit demeurer professionnelle malgré les potentielles modifications qu’ils vont subir.
Voici trois (3) conseils à suivre pour optimiser vos infolettres :
Les images sur fond transparent (.PNG)
L’utilisation des .PNG permet de créer des images avec des arrière-plans transparents. En intégrant ce type d’images à vos infolettres, l’arrière-plan de vos images deviendra homogène au reste de votre infolettre.
En d’autres mots, cette technique permettra de refléter la couleur de l’arrière-plan qui aura subi une transformation à même l’image intégrée.
Quand utiliser des arrière-plans transparents?
- Dès que vous n’utilisez pas une image complètement carrée/rectangulaire.
- Lorsqu’il s’agit d’un élément visuel de design.
- Lorsque votre logo n’est pas composé de noir ou de blanc.
Entourez vos images d'une couleur pâle
Votre texte et vos arrière-plans seront affectés lors de l’inversion des couleurs, ce qui n’est pas le cas de vos images. Conséquemment, vos images deviendront invisibles lors de l’activation du mode sombre si celles-ci contiennent une couleur noire et que vous les disposez sur un fond blanc.
Cela devient particulièrement néfaste lorsqu’il s’agit d’un logo ou d’un appel à l’action (CTA).
Comment entourer ces éléments visuels?
- Entourez vos images d’une boîte blanche, spécialement votre logo afin qu’il demeure visible.
- Utilisez un trait blanc autour des éléments de conception noirs permettra une lisibilité du visuel.
Optez pour des couleurs alternatives
Nous préconisons de ne pas utiliser des couleurs pures dans vos conceptions d’infolettres, et ce, spécialement pour le blanc et le noir. Utilisez plutôt des variantes de noir et de blanc afin que vos éléments demeurent visibles.
Se faisant, vous serez assuré que toute l’information sera au moins compréhensible s’il y a inversion des couleurs. De plus, le résultat confère un style esthétique aux logos et autres images de vos infolettres.
Remplacer quelles couleurs?
- Remplacez le blanc #FFFFFF par la couleur #F7F7F7 ou une variante similaire.
- Utilisez la couleur noire #252525 au lieu du #000000 afin de demeurer visible.
Optimisez l'accessibilité de vos infolettres
Nous vous partageons un secret : « testez, testez et testez encore » vos infolettres! Vous savez que l’intégration d’infolettres dynamiques est un processus complexe qui requiert des connaissances avancées des boîtes de réception, mais le mode sombre nous plonge dans une toute nouvelle sphère d’optimisation multiplateforme.
Devant déjà composer avec les différents navigateurs et appareils mobiles comme tous les sites web, les infolettres doivent également s’assurer d’avoir une bonne compatibilité avec les boîtes de réception de courriel majeures.
Comme pour toute autre fonctionnalité, le seul moyen de vous assurer que votre courriel donne le résultat escompté en mode sombre partout, est de tester le résultat final partout. Évidemment, vous ne pouvez tester toutes les combinaisons de plateforme. On vous recommande cependant fortement de tester les outils les plus utilisés, soit :
- Mobiles : iPhone et Android.
- Navigateurs web : Google Chrome et Safari.
- Boîtes de réception : Gmail et Hotmail.
Alors voilà! C’est vrai qu’il est surprenant qu’une petite mise à jour de nos appareils puisse avoir un tel impact sur le courriel, mais celui-ci n’est généralement pas un grand fan du changement.
Vous voudriez approfondir votre compréhension sur le sujet ou sur une autre branche du courriel qui nécessite de l’optimisation multiplateforme, n’hésitez-pas à contacter notre équipe d’experts. Ils seront heureux de partager avec vous leur expertise en marketing par courriel!
Francis Sauvé
Directeur marketing
Vous souhaitez obtenir des conseils?
Les stratégies de communication adaptées au marketing par courriel n’ont plus de secrets pour ce spécialiste de la plateforme d’expédition de courriel.
Obtenez plus de détails sur le mode sombre des infolettres en communiquant avec lui dès maintenant! Il sera en mesure de vous proposer des solutions novatrices et créatives pour vos campagnes de marketing par courriel.
C : fsauve@adnetis.com
T : 1-877-638-6584