Molti client di posta elettronica hanno un'impostazione di modalità scura, il che può portare a incongruenze con l'aspetto delle vostre e-mail di marketing nei client con un aspetto più luminoso abilitato.
Per vedere come apparirà la vostra e-mail quando un contatto la aprirà in un browser o in un client con la modalità scura abilitata:
Quando si visualizza l'anteprima dell'e-mail con diversi client in modalità scura, tenere presente che ogni client può visualizzare l'e-mail in modo diverso. Ad esempio, se i vostri contatti aprono l'e-mail con Apple Mail, questa apparirà esattamente allo stesso modo, indipendentemente dal fatto che abbiano attivato o meno la modalità scura. Se invece un contatto attiva la modalità scura in applicazioni come Gmail o Outlook su Windows, si possono notare differenze più drastiche nello stile delle e-mail, come ad esempio colori di sfondo invertiti.
Per verificare che lo stile delle vostre e-mail sia coerente tra i vari client, consultate i suggerimenti riportati di seguito.
Convertite le immagini in file PNG prima di caricarle e aggiungerle alle e-mail, in modo da garantire che vengano visualizzate nei client di posta elettronica che invertono automaticamente il colore di sfondo delle e-mail in modalità scura. Se l'immagine contiene del testo, ad esempio un logo, è possibile aggiungere un contorno traslucido intorno al testo per farlo risaltare.
Progettare i contenuti delle e-mail in modo che siano accessibili è importante indipendentemente dal client di posta elettronica utilizzato dal destinatario. Aderire agli standard di accessibilità, ad esempio controllando il contrasto di colore del testo, aiuterà anche a far apparire le vostre e-mail correttamente in modalità scura. Per saperne di più sui colori accessibili sul web, consultate il blog di HubSpot.
Diversi client di posta elettronica, tra cui Apple Mail e Outlook.com, offrono un supporto limitato per il rilevamento e l'aggiunta di stili personalizzati tramite una media query. Se si utilizza l'editor di posta elettronica classico aggiornato e si dispone di risorse di sviluppo per apportare modifiche CSS alle e-mail, è possibile aggiungere una media query con la funzione prefers-color-scheme
media per configurare l'aspetto di immagini e testo in modalità scura e in modalità chiara.