Optimizar los emails marketing para el modo oscuro

En el editor de email, puede previsualizar cómo aparecerán los emails de marketing en modo oscuro mientras edita o generar vistas previas para clientes de email específicos. Esto puede ayudar a garantizar que los destinatarios que vean sus correos electrónicos de marketing en modo oscuro puedan verlos como estaba previsto. 

Vista previa del modo oscuro en el editor de correo electrónico

Para cambiar a una vista previa en modo oscuro de tu correo electrónico mientras lo editas:

1. En tu cuenta de HubSpot, dirígete a Marketing > Correo electrónico.
2. Haz clic en el nombre de un correo electrónico redactado.
3. En el editor de correo electrónico, haz clic en Opciones de visualización en la parte superior de la página y, a continuación, activa el interruptor Vista previa en modo oscuro .

Vista previa del modo oscuro en clientes específicos

Para ver cómo aparecerá tu correo electrónico en determinados navegadores o clientes de correo electrónico con el modo oscuro activado:

1. En tu cuenta de HubSpot, dirígete a Marketing > Correo electrónico.
2. Haga clic en el nombre de un correo electrónico redactado.
3. En el editor de correo electrónico, haz clic en Vista previa y prueba en la parte superior derecha y, a continuación, selecciona Vista previa en un cliente de correo electrónico.
4. En la pantalla de vista previa, haga clic en el menú desplegable Elegir tipo de vista previa situado en la parte superior izquierda y, a continuación, seleccione la casilla de verificación situada junto a cada tipo de vista previa. Para ver el tipo de vista previa disponible para el modo oscuro, escribe "oscuro" en la barra de búsqueda. 

5. En la parte superior derecha, haz clic en Vista previa.

Comprender las mejores prácticas para diseñar correos electrónicos para el modo oscuro

Los distintos clientes de correo electrónico y navegadores pueden representar el modo oscuro de forma diferente. Tenga en cuenta las siguientes sugerencias a la hora de diseñar mensajes de correo electrónico para su visualización en modo oscuro: 

• Utilice imágenes que se vean claramente tanto sobre fondos claros como oscuros: convierta las imágenes a formato .png para asegurarse de que aparecen correctamente si se invierte el color del fondo. 
• Asegúrese de que el texto tenga suficiente contraste de color: siga las directrices de accesibilidad de contenidos web y asegúrese de que haya suficiente contraste entre el texto y los colores de fondo.
• Añada una consulta de medios para el modo oscuro: algunos clientes de correo electrónico ofrecen una compatibilidad limitada con el estilo personalizado mediante consultas de medios. Puede utilizar la función prefers-color-scheme para ajustar cómo aparecerán las imágenes y el texto en el modo oscuro. Esta opción sólo está disponible para las plantillas de correo electrónico creadas en el administrador de diseño.