Modo oscuro para correos electrónicos: qué es y cómo optimizar los correos electrónicos

Si bien los diseñadores e investigadores discuten ampliamente si el modo oscuro para el correo electrónico es saludable y necesario, lo cierto es que la gente sigue usándolo cada vez más.

¿Qué es el modo oscuro?

El modo oscuro muestra textos de colores claros, íconos y elementos de la interfaz de usuario en fondos oscuros. 

¿Cómo funciona? Algunos creen que el modo oscuro cambia los colores por otros de contraste (opuestos a los de la rueda de colores) cuando se abre un correo electrónico en un dispositivo con el modo oscuro.

Sin embargo, esto no es del todo cierto. No invierte el verde al rojo, ni el azul al dorado o al amarillo. El modo oscuro utiliza tonos más claros de exactamente los mismos colores (en caso de que no haya establecido un color específico como fondo de contenido).

¿Cómo lo hace? Un cliente de correo electrónico detecta el color de fondo del contenido del correo electrónico. Luego aplica un fondo oscuro si no ha sido configurado y aplica sombras de contraste de los colores del contenido del correo electrónico.

(Correo electrónico en modo claro)

(correo electrónico en modo oscuro)

Sin embargo, cuando se trata de un fondo negro, el modo oscuro lo convierte en blanco en Gmail en iOS y en Android. El gris oscuro se vuelve gris claro, etc. 

¿Qué es lo que hace que el modo oscuro sea tan popular?

Esta característica se está volviendo muy popular por varias convicciones:

• está recomendada por oftalmólogos

Se dice que el texto claro sobre un fondo oscuro reduce la fatiga ocular. Sin embargo, el oftalmólogo todavía lo discute;

• está de moda hoy en día

Pues... Es cierto. Mucha gente lo enciende solamente porque es algo nuevo y quieren probarlo;

• es cómodo

A algunos usuarios les resulta más cómodo leer en pantallas oscuras, especialmente de noche;

• consume menos batería

Google confirmó que el modo oscuro en Android reduce el consumo de la batería hasta en un 50%. Sin embargo, esto se cumple solamente en las pantallas OLED.
Wired dice que el modo oscuro no incide en la duración de la batería si hablamos de las pantallas LCD, que son ampliamente utilizadas por Apple. Por cierto, Apple prometió desechar todas las pantallas LCD a favor de las OLED.

Lista de clientes de correo electrónico que soportan el modo oscuro y cómo se renderizan sus correos electrónicos en ellos

El modo oscuro se está volviendo popular. Solo las últimas versiones de los sistemas operativos lo soportan y procesan los correos electrónicos correctamente.

• Aplicación Gmail en Android (Android 10)

Invierte los colores por completo: no solo para la interfaz de usuario, sino que los correos electrónicos también se muestran en el modo oscuro.

Probamos una amplia variedad de correos electrónicos. Uno de ellos, inicialmente tenía un fondo oscuro y una fila/franja blanca con un menú. 

Android 10 no ha invertido los colores oscuros a claros, pero ha cambiado mi fila blanca a oscura.

(correo electrónico en Android 10, tema oscuro)

Importante:

Como dijimos antes, solo la última versión de Android, Android 10, procesa los correos electrónicos en modo oscuro. No obstante, hay otras condiciones obligatorias a las que se les debe prestar mucha atención si se desea ver correos electrónicos en el modo oscuro de Android. Son las siguientes:

1. Su aplicación de Gmail deberá descargarse desde Google PlayStore, no desde la aplicación que estaba en su teléfono de forma predeterminada. Los teléfonos Samsung no siempre las tienen.
2. Debe contar con la última versión de la aplicación Gmail, preferiblemente actualizada en noviembre de 2019. 

• Aplicación Gmail en iOS (iOS 13)

¿Qué hace la aplicación Gmail en iOS?

Mi correo electrónico estaba originalmente oscuro con la fila del menú claro. iOS ha invertido colores oscuros a claros y colores claros a oscuros.

Importante:

Gmail aún está implementando el Modo Oscuro para correos electrónicos en iOS. Se espera que esté plenamente visible y disponible para todos los usuarios en aproximadamente 2 semanas. Sin embargo, el mismo proceso para Android le tomó a Google aproximadamente dos meses en lugar de dos semanas. Todo lo que hay que tener es paciencia.

• La aplicación iPhone Native Mail (Native Mail en iOS)

La aplicación le permite activar el modo oscuro para la interfaz de usuario y el área de correo electrónico. Si ha configurado un color de fondo transparente, el iPhone Mail lo cambiará a oscuro.

De lo contrario, sus correos electrónicos se verán absolutamente iguales en ambos modos. 

• Apple Mail en macOS 

Aquí ocurre lo mismo. La aplicación permite activar el modo oscuro para la interfaz de usuario, pero no afecta el diseño de sus correos electrónicos HTML en modo oscuro.

• Gmail en macOS y Windows

No invierte los colores, o en todo caso lo hace parcialmente, llámelo como quiera.

La aplicación le permite activar el modo oscuro de la interfaz de usuario, pero el área de correo electrónico permanecerá clara, por lo que no afectará en absoluto a la representación del correo electrónico. Sus correos electrónicos se verán exactamente iguales en ambos modos.

• Aplicación Outlook (2019) en Android 

Se dice que invierte los colores parcialmente. Debo confesar que no pude probarla porque no tengo Outlook 2019 en mi smartphone.

• Aplicación Outlook (2019) en iOS

Se supone que invierte los colores parcialmente. Pero tampoco tengo la aplicación Outlook 2019 en iPhone.

• Outlook 2019 en macOS

Invierte los colores por completo. Al igual que Android 10, deja el diseño oscuro como está y convierte un fondo claro en oscuro.

• Outlook.com

La situación con Outlook.com es muy interesante.
Se supone que invierte los colores parcialmente. Sin embargo, cuando envío un correo electrónico con un diseño oscuro, Outlook.com cambia los colores para iluminar en un modo nocturno. Y cuando envío un correo electrónico con el diseño en colores claros, Outlook.com invierte los colores en oscuros.

Datos interesantes sobre el modo oscuro en Outlook.com:

1. Outlook.com no afecta en absoluto el diseño de los correos electrónicos de AMP.

Si ha establecido un fondo blanco, esto es lo que sus usuarios verán en este cliente de correo electrónico en particular, incluso con un modo oscuro activado.

2. Outlook.com le permite ver el correo electrónico en los modos claro y oscuro sin cambiar el color de la interfaz de usuario.

Para convertir los correos electrónicos de claros a oscuros y viceversa, solo tiene que hacer clic en este botón:

3. Outlook no invierte los colores del borde.

Consejos para optimizar correos electrónicos para el modo oscuro

No intente hackear el modo oscuro para que sus correos electrónicos se procesen como en los modos normales. Pues si las personas usan este modo, hay una razón. Y debemos respetar eso.

Entonces, para optimizar su plantilla de correo electrónico para el modo oscuro, deberá:

1. Funciona en las imágenes

a) Utilice iconos e imágenes con fondos transparentes o asegúrese de que sus fondos sean del mismo tamaño para evitar esto:

¿Coincide Ud. en que éste no es el mejor ejemplo de un correo electrónico de tema oscuro, dado que las imágenes blancas de diversos tamaños de fondo arruinan toda la importación?

b) Tenga cuidado con las imágenes transparentes

Se espera que Ud. utilice imágenes con fondos transparentes para las tarjetas de productos.

Sin embargo, las fotos de las personas se verían mejor si tuvieran un fondo específico. 

2. Funciona en logos

a) Que tus logos no tengan fondos

b) Que sus logos se escriban no en negro, cosa de renderizar correctamente los temas oscuros y claros

Algunos codificadores sugieren que usar dos logos e incluso proporcionar una muestra de código que garantice que el logo negro se muestre en el modo claro y blanco, en el modo oscuro.

Hicimos la prueba: el código no ayudó. Pero hizo que nuestro código de correo electrónico se volviera mucho más pesado.

c) Aplicar sombras claras a logos negros

Si su logo tiene que estar escrito en negro, añádale una sombra clara. Se verá bien y estará en línea con el diseño de su marca. 

(Source: Email newsletter from Litmus)

3. Establecer colores de fondo para contenedores de correo electrónico

Si no desea que el contenido de su correo electrónico tenga un fondo oscuro, puede establecer uno personalizado con Stripo.

El color que establezca como "Color de fondo del contenido" seguirá siendo exactamente el mismo en el modo oscuro.

Establezca el color "transparente" en la franja. En este caso, el color de fondo elegido se aplicará al contenido del correo electrónico, pero no a toda el área de correo electrónico.

Asegúrese de establecer el mismo esquema de color para todas las franjas/filas. 

4. Pruebe sus correos electrónicos

Siempre pruebe sus correos electrónicos HTML en apariencias regulares/claras y oscuras.

5. No añada ningún elemento de código adicional

A pesar de algunas recomendaciones para añadir elementos de código especiales en sus plantillas de temas oscuros que, según se dice, permiten que sus correos electrónicos se rendericen en modo oscuro, estos ejemplos de código no resuelven ningún problema aún. Al menos, esto es lo que se desprende de numerosas pruebas.

Por otra parte, las plantillas de correo electrónico funcionan bastante bien en la mayoría de los clientes de correo electrónico.

Por lo tanto, optimizar sus diseños de correo electrónico para el modo oscuro no es ninguna ciencia. Todo lo que tiene que hacer es trabajar en la apariencia del correo electrónico. No es necesario trabajar con códigos todavía.

¿Cómo afecta el modo oscuro a los correos electrónicos de texto plano?

Se dice que los correos electrónicos personales en un modo oscuro siempre se procesan correctamente en todos los clientes de correo electrónico que soporten esta nueva función.

Pero ¿es cierto? Veamos:

1. Gmail en ordenador de escritorio no invierte nuestros correos electrónicos en absoluto. Por lo tanto, no hace falta que nos preocupemos por eso.

2. Gmail, tanto en iOS como en Android, muestra una tipografía clara sobre fondo oscuro.

3. Outlook también invierte los colores de nuestros correos electrónicos de texto plano en un modo oscuro.

4. Las aplicaciones nativas de iPhone y Apple Mail invierten los colores de fondo de claro a oscuro y los colores de texto de oscuro a claro cuando se trata de correos electrónicos personales en el modo oscuro.

Sin embargo, hay algunas cosas sobre los mensajes de texto plano en Apple Mail y en el correo de iPhone que vale la pena mencionar:

• solo invierte colores si éste es el único o el primer correo electrónico de una cadena. A veces, el segundo y todos los correos electrónicos subsiguientes tendrán un fondo blanco y una tipografía oscura;

• incluso si este es el primer correo electrónico en una cadena, pero contiene una imagen, su correo electrónico personal en un modo oscuro bien podría quedar en blanco. El logo de su empresa incluido en su firma de correo electrónico también se considera una imagen;
• los correos electrónicos personales que le fueron enviados también pueden tener fondos blancos.

Reflexiones finales

Desde luego, teniendo en cuenta que sólo una pequeña parte de los usuarios puede ver el modo oscuro, bien podría surgirnos la siguiente pregunta: ¿merece realmente la pena el esfuerzo del modo oscuro? ¡La merece! Primero que nada, si las personas lo usan, hay una razón. Debemos respetar eso y optimizar nuestros diseños de correo electrónico para el modo oscuro. 

En segundo lugar, esta función se está volviendo cada vez más popular y, muy pronto, una cantidad mayor de nuestros suscriptores activará este modo.