Blog Email Màrqueting i SMS

Dark mode, així es veuen els teus emails

Categoria: Email màrqueting

Imagen Dark mode, així es veuen els teus em

El 2018 Apple va introduir al seu lector de correu d’escriptori el “Dark mode” o “mode fosc”. Poc després, Apple el va incorporar a l'iOS mail i el van seguir els grans de la indústria com Gmail i Outlook.com.

Actualment, el “mode fosc” és una opció utilitzada per molts usuaris i, per aquesta raó, és important assegurar-nos que els nostres emails es veuen bé en aquest nou entorn de lectura.

CONTINGUT

 

Què és el “mode fosc"?

El mode fosc (dark mode o night mode en anglès), és un esquema de color que s'aplica als lectors de correu i que consisteix a utilitzar colors clars per a icones, elements de la interfície d'usuari i tipografies, sobre fons de colors foscos. És una opció d'accessibilitat disponible tan en gestors de correu com en sistemes operatius i aplicacions.

 

Per què els usuaris utilitzen el “mode fosc"?

El mode fosc (o dark mode) és una tendència en auge per múltiples raons:

  • Redueix la fatiga visual: Els textos en colors clars sobre fons fosc, sobretot en entorns amb poca llum, fan que l'usuari experimenti menys fatiga visual.
  • Estalvi d'energia: En reduir la lluentor de la pantalla, la vida útil de la bateria és major.
  • Llegibilitat: Els textos són més fàcils de llegir per a molts usuaris.
  • Preferències: Molts usuaris simplement prefereixen utilitzar interfícies amb colors foscos.

 

Lectors de correu que suporten aquesta opció

Els usuaris poden triar utilitzar el mode fosc en els següents lectors de correu:

  • Aplicacions mòbils
    • Apple Mail
    • Gmail app (Android 10, iOs 13)
    • Outlook app (Android, iOs)
    • Yahoo app (Android, iOs)
  • Aplicacions d’escriptori
    • Apple mail (mac OS)
    • Outlook 2019 (mac OS, windows)
    • Windows 10 Mail
    • Mozilla Thunderbird
  • Webmail
    • Gmail
    • Outlook.com
    • Yahoo! Mail
    • Zoho Mail
    • AOL

 

Com apliquen els lectors el “dark mode” als meus emails?

No tots els lectors apliquen el mode fosc de la mateixa manera: uns només canvien la interfície d'usuari però no modifiquen els colors dels nostres emails, d'altres inverteixen parcialment els colors i n'hi ha que els modifiquen per complet.

Imagen Email marketing darkm

 

Sense canvis de colors

Alguns lectors, com Gmail, Yahoo mail i Apple mail, només canvien els colors de la seva interfície en aplicar el mode fosc. Això significa que el dark mode no afecta a com es renderitza el nostre email i es visualitzarà exactament com és.

Aquí teniu un exemple amb Gmail: El disseny del nostre email es conserva, sigui com sigui la manera en que s'utilitzi:

 

Inversió parcial de colors

En alguns navegadors el mode fosc només detecta les àrees del teu email que utilitzen fons clars i n'inverteix els colors de fons a fosc i els textos a colors clars. Les àrees que utilitzen fons foscos no es canvien. La resta d'elements, tampoc.

 

Aquest és el cas per exemple d'Outlook.com. Si us fixeu, veureu que la vora del botó de color negre l'ha mantingut i no ha fet cap canvi en els fons foscos:

Imagen email marketing p

 

Inversió total de colors

Altres lectors de correu, com Gmail per a iOS o Zoho mail, inverteixen tots els colors. És a dir, no sols canvien els fons clars a fosc, sinó els foscos a clars. Aquest esquema de color és el que aplica canvis més radicals al disseny del nostre email.

Imagen Post-d

 

Suport de mode fosc als lectors de correu

A continuació, us mostrem una taula de com actua cada lector de correu en aplicar el mode fosc. Aquesta taula pot anar canviant en el temps, ja que molts lectors, com Gmail, utilitzen el feedback dels usuaris per aplicar millores al seu tema dark mode.

Imagen correus co

 

Consells per optimitzar els teus emails per a dark mode

No tots els lectors utilitzen el mateix esquema de color quan l'usuari treballa amb el dark mode actiu. És a dir, els colors que utilitza cada lector per substituir els originals difereixen els uns dels altres. Per evitar que això succeeixi, podem especificar, a l'html, com volem que els nostres emails siguin renderitzats en mode fosc, però no tots els lectors permeten indicar-ho (per exemple, Gmail no ho accepta).

Si tenim coneixements d'html, podem utilitzar aquests dos mètodes per indicar al lector com ha de mostrar el nostre email:

@mitjana (prefers-color-*scheme: dark)

[data-ogsc] i/o [data-ogsb] , per a Outlook app (Android)

 

No obstant això, hi ha una sèrie de tècniques que podem aplicar als nostres emails perquè es visualitzin correctament en mode fosc sense necessitat de modificar l'html.

 

Provar el disseny en mode fosc i mode clar

Prova la teva campanya per assegurar-te que el teu disseny i la llegibilitat del contingut no es veu afectada en cas que l'usuari tingui el mode fosc actiu. Com hem comentat, cada lector aplica el seu propi esquema de color, per la qual cosa és recomanable comprovar el nostre email en els lectors més populars per veure el resultat en cadascun d'ells.

 

Utilitza imatges amb fons transparent

Si utilitzes imatges amb fons transparent, en invertir-se els colors amb el mode dark mode, el disseny del teu butlletí es veurà més uniforme i no tindrà una afectació tan visible.

A la següent imatge pots veure la diferència entre utilitzar el logotip amb i sense fons:

Imagen email marketing p

 

Afegeix un contorn blanc a icones i textos de color negre

Si utilitzem icones o textos en imatge de color negre, aquests no es veuran en el mode fosc. Per evitar-ho, afegeix una vora de color blanc. En mode “normal” no s'apreciarà i en mode fosc es visualitzaran correctament.

Imagen Dark-

 

Els clients de correu estan constantment canviant, sobretot pel què fa al dark mode, aplicant millores i modificacions en els seus esquemes de color per millorar l'experiència de l'usuari que utilitza aquesta manera de visualització dels seus correus electrònics. Per aquesta raó, és imperatiu fer proves als nostres emails per assegurar-nos que es renderitzen correctament en aquest mode als lectors més populars.


No et perdis res del nostre blog i uneix-te al nostre Telegram https://t.me/acrelianews



Articles relacionats


Encara no has provat Acrelia News?
Si t'ha agradat aquest article, t'agradarà molt més la nostra eina d'email màrqueting: professional, fàcil d'utilitzar i en català.

SOL·LICITAR DEMO