Cómo alinear todos tus correos con el manual de marca: un sistema en lugar de ajustar colores a mano

Los manuales de marca suelen escribirse para la web, las presentaciones y la imprenta: el correo casi nunca se describe aparte. El resultado es que algunas reglas funcionan tal cual en la bandeja de entrada, otras hay que adaptarlas y otras no funcionan en absoluto. Veamos qué se traslada directamente, qué hay que sustituir y cómo definir una vez un sistema de diseño para correos y dejar de ajustar colores a mano en cada envío.

Por qué no basta con reutilizar las reglas de la web

Un cliente de correo no es un navegador. Limita el conjunto de propiedades admitidas, sustituye fuentes y en modo oscuro puede invertir los colores por su cuenta. Una regla del manual como «los titulares van en la tipografía de marca con un interletrado de menos dos por ciento» se convierte en un deseo dentro del correo: para la mitad de los destinatarios la fuente será una del sistema.

• las tipografías personalizadas no se cargan en todas partes y se sustituyen por las del sistema
• los pesos finos se leen peor en pantallas móviles
• el texto gris claro sobre blanco puede volverse ilegible tras la inversión en modo oscuro
• los redondeos de marca no se ven en el Outlook clásico sin código adicional
• las imágenes de fondo no son compatibles con todos los clientes

Qué se traslada directamente

La buena noticia: el núcleo de la identidad de marca llega al correo casi intacto. Ese núcleo es el mínimo que hace reconocible un envío.

Qué hay que adaptar

Tres parámetros exigen una decisión específica para el correo, y conviene tomarla una vez en lugar de discutirla en cada campaña.

Primero, la pareja tipográfica. La fuente de marca va primero y detrás, obligatoriamente, una alternativa del sistema de proporciones parecidas. Si la marca se apoya en una grotesca estrecha, una alternativa mejor que Arial es algo más próximo en anchura; de lo contrario el correo parecerá ajeno a parte de los destinatarios.

Segundo, el contraste. Los tonos claros de marca que quedan bien en la web corren el riesgo de perderse en el correo, porque algunos clientes invierten los colores en modo oscuro. Define de antemano una variante de mayor contraste para el texto y compruébala sobre fondo oscuro.

Tercero, el comportamiento en pantalla estrecha. Los datos de Litmus muestran que la mayoría de las aperturas ocurren en Apple Mail y Gmail, y son sobre todo teléfonos. Fija de forma explícita los tamaños de titular, los espaciados y la altura de los botones para móvil en lugar de confiar en un escalado proporcional.

Cómo montar un sistema de diseño para correos

La idea es definir un conjunto de valores una sola vez y después montar los correos a partir de ellos, en lugar de sacar colores con el cuentagotas en cada maqueta nueva. El conjunto mínimo es este:

• colores principal, secundario y de acento
• color de fondo del correo y color de fondo de los bloques
• color del texto y color del texto secundario
• color del botón, color del texto del botón, radio de redondeo
• pareja tipográfica con alternativas
• tamaños de titulares y de texto para escritorio y móvil
• espaciado entre bloques
• ancho del contenedor
• tratamiento de cabecera y pie

Con el conjunto definido, cualquier correo nuevo se monta con valores listos. Cambiar el color de acento en el manual recolorea todas las campañas de golpe en lugar de convertirse en un repaso manual de treinta plantillas.

El modo oscuro merece apartado propio

El modo oscuro es donde más se rompe la identidad de marca. Los clientes lo tratan de forma distinta: unos invierten los colores por su cuenta y otros respetan tus ajustes. Una variante del logotipo para fondo oscuro, contraste suficiente en el texto y fondo transparente en las imágenes del logotipo resuelven la mayor parte del problema.

El nuevo Outlook añade una particularidad: ejecuta un postprocesado después de cargar el correo y reescribe los estilos en línea, con lo que parte del diseño puede perderse. Los desarrolladores recomiendan mantener el mismo radio de redondeo en los cuatro lados y evitar las imágenes de fondo.

También he visto cómo mis estilos desaparecen de repente del DOM y los encuentro reescritos en línea.

Cómo funciona en Mailvex

En Mailvex el manual de marca no es un documento sino un conjunto de valores que se aplica automáticamente a todos los bloques del correo. Puedes subirlo en PDF y que se extraigan colores, tipografías, logotipo y espaciados; rellenar un cuestionario breve; o definirlo todo a mano.

A partir de ahí cualquier plantilla de la biblioteca se recolorea a tu estilo con una sola acción. Equipos y agencias pueden compartir manuales de marca: varios clientes, un conjunto de valores para cada uno y cambio entre ellos sin rehacer los correos.

Preguntas frecuentes

¿Qué hago si no hay manual de marca?

Montar un conjunto mínimo con lo que ya existe: colores de la web, logotipo, tipografía. Con eso basta para que los envíos se vean coherentes. El manual completo puede escribirse más adelante; la falta de coherencia en los correos se nota de inmediato.

¿Puedo usar la tipografía de marca en el correo?

Puedes indicarla, pero no puedes confiar en ella. Algunos clientes cargarán la fuente personalizada y otros pondrán una del sistema. Por eso la alternativa es obligatoria y el correo debe verse digno en ambos casos.

¿Cómo lo gestiona una agencia con varios clientes?

Manteniendo un conjunto de valores por cliente y alternando entre ellos. Así la misma plantilla de campaña se recolorea para cualquier marca en un minuto, sin rehacer el correo.