13 mejores diseños de correo electrónico y ejemplos llamativos y atractivos de 2020

Aquí hay 13 consejos y ejemplos de diseño para el marketing por correo electrónico que los implementan bien:

1. Mantenga su diseño consistente con el estilo de su marca

Así como reconoces a tus amigos o familiares de sus rostros, la gente recuerda tu negocio con tu marca.Al crear una marca consistente en sus correos electrónicos, usted ayuda a fortalecer el reconocimiento de la marca y establecer una relación más fuerte con sus lectores.Esa relación, si se cuida adecuadamente, hará que vuelvan a usted por sus necesidades.

Aunque puede cambiar elementos como el color, algunas entidades de diseño deben seguir siendo coherentes.Por ejemplo, incluya su logotipo en la parte superior de cada correo electrónico.Si su marca tiene una voz informal y amigable, mantenga esa voz consistente en sus correos electrónicos.Si su negocio tiene un sitio web minimalista, utilice mucho espacio en blanco e imágenes y texto mínimos.Su línea de firma también debe ser marcada.Los lectores no deben sorprenderse por la forma en que estas características aparecen en su correo electrónico.

JetBlue, por ejemplo, tiene un tono casual y divertido en su sitio web.No tiene miedo de romper las reglas de puntuación y gramática, como lo hacemos en una conversación informal con amigos.El resultado es un tono accesible que ayuda a construir relaciones individuales con los lectores.JetBlue extiende ese tono a sus correos electrónicos, luego agrega otras características de diseño que promueven el reconocimiento de la marca, incluyendo colocar el logotipo encima de cada correo electrónico y usar los colores de la marca tanto como sea posible.

Ejemplo de correo electrónico de JetBlue

Un ejemplo de un correo electrónico de JetBlue.Fuente

Consejo profesional: Si aún no tienes un logotipo, puedes obtener uno diseñado en cuestión de segundos desde Tailor Brands.Simplemente visite la página del creador de logotipos de marcas sastre y rellene un cuestionario corto.Las marcas a medida generarán algunos logotipos para elegir.Después de elegir un logotipo, regístrese para obtener un plan de logotipos (a partir de $3.99 por mes) para obtener características adicionales como la capacidad de adaptar el logotipo para campañas de temporada, agregar marcas de agua y cambiar el tamaño del logotipo según sea necesario.

2. Sea conciso y claro

En promedio, tienes unos 11 segundos antes de perder la atención de tus lectores.Los lectores también se sienten más atraídos por los gráficos que por la copia, por lo que es probable que sus ojos se graviten primero a las imágenes.En pocas palabras, le queda poco tiempo precioso para atraer a los lectores a hacer clic en su CTA.Esto significa que debe ser fácilmente consumible con un mensaje simple que convence sin perder el tiempo con un mensaje confuso.

Según un estudio boomerang, los correos electrónicos entre 75 y 100 palabras (unas cinco frases) tienen una tasa de respuesta del 51%, mientras que los que tienen 200 palabras tienen una tasa de respuesta del 48%.Además, la elección de la palabra es importante.Los correos electrónicos escritos en el nivel de lectura de tercer grado tienen una tasa de respuesta un 36% más alta que los escritos en el nivel de lectura de la universidad.Para una tasa de respuesta similar, mantenga la línea de asunto y los títulos entre tres y cuatro palabras.

Por ejemplo, la comunidad de cocina en línea food52 utiliza un lenguaje sencillo.Utilice palabras para una sílaba que un estudiante de tercer grado pueda entender.No se mencionan las palabras de la industria como "cocina".En su lugar, lo mantienen simple con "comida".En lugar de "discutir", usan "hablar".La copia del correo electrónico contiene poco más de 80 palabras.El título es de cuatro palabras sencillas: "Todos somos amigos aquí".

Muestra de correo electrónico de Food52

Food52 Ejemplo de correo electrónico: conciso y claro.Fuente

3. Utilice dos colores contrastantes

Además de contrastar los botones cta, utilice el contraste a lo largo de su correo electrónico para resaltar partes clave de su correo electrónico.Para evitar un efecto caótico que distraiga de su mensaje, el contraste debe limitarse a dos colores para el cuerpo principal de su dibujo por correo electrónico.El uso de una rueda de color digital ayuda a garantizar que sus colores funcionen bien juntos.El contraste también facilita la lectura de su correo electrónico para aquellos que podrían tener problemas de visión como daltonismo.

Si ya has seleccionado colores de marca complementarios, a menudo usa estos colores para aumentar el reconocimiento de marca en tus lectores.A veces puedes desviarte por un efecto más estacional (como hizo Harry en Tip #4) para crear relevancia.Una manera fácil de entender los mejores colores contrastantes es utilizar una rueda de color digital.Utilice una herramienta gratuita como Calculadora de color para probar fácilmente diferentes colores.Simplemente elija un color en el primer paso y, a continuación, elija una opción complementaria.

Interfaz de calculadora de color

Elegir colores complementarios contrastantes usando la calculadora de colores.Fuente

Consejo profesional: Para asegurarse de que los colores elegidos resaltan el mensaje clave para todos los lectores, instale una aplicación como Color Oracle (disponible en macOS, Linux y Windows).Una vez instalada, la aplicación coloca un menú desplegable en la parte superior del navegador que le permite elegir diferentes tipos de colores.Elige un tipo de daltonismo (Deuteranopia, Protanopia o Tritanopia), para ver tu correo electrónico a través de esta lente para garantizar la legibilidad de los lectores con discapacidad visual.

4. Incluir botones de llamada a la acción (CTA) que llaman la atención

Los botones cta de correo electrónico se utilizan a menudo para traer a su lector de correo electrónico de vuelta a su sitio web u ofrecer página de destino, a continuación, atraerlos para completar una acción.Para lograr sus objetivos de marketing, un botón CTA es la parte más importante de su correo electrónico, y todas las demás copias de correo electrónico deben centrarse en hacer clic en el lector.Al hacer clic en el botón puede ser una pequeña conversión, normalmente es el primer paso para una conversión más grande.Para ser eficaces, hazlos audaces, tentados y claros.

Su CTA debe indicar a sus lectores qué valor pueden recibir haciendo clic en el botón.En lugar de "Haga clic aquí", pruebe el texto del botón que promete valor como "descargar nuestro libro electrónico gratuito" o "obtener una demostración gratuita."Para asegurarse de que sus lectores vean el botón, utilice un color de botón que contraste con el resto de su correo electrónico.Si tiene un fondo de correo electrónico azul, por ejemplo, considere un botón naranja.

Harry – una marca de maquinillas de afeitar para hombres – quería presentar a los suscriptores a su nuevo set de regalos de invierno.Para mostrar su estacionalidad, eligió un fantástico fondo verde y azul para las vacaciones.Luego, explicó el valor al lector: un simple regalo para adquirir para cualquier hombre en sus vidas.Su llamado a la acción fue simple pero tentador: "¿Todavía necesitas un regalo?No es demasiado tarde."A continuación, un botón naranja brillante contrastaba con un fondo azul e invitaba a los lectores a "Comprar ahora".

Harry's Winter Set Muestra de correo electrónico con cta button

Harry's Winter Set Email Example – botón CTA.Fuente

5. Centrarse en la personalización

Las campañas de correo electrónico de tamaño único no suelen generar conversiones.Para ello, debe personalizar el mensaje.Según Instapage, aunque el 70% de las marcas no personalizan los correos electrónicos, las marcas que disfrutan de una tasa de clics un 27% más alta y seis veces más porcentaje de transacciones.Para ello, primero segmente su lista de suscriptores en función de las necesidades e intereses de los lectores, luego elija una lista y cree un mensaje rico en valores solo para ellos.Repita para todas las listas.

Herramientas como Contacto constante le permiten asignar direcciones de correo electrónico recopiladas a través de formularios de captura de correo electrónico a sus listas designadas.Esto crea listas de suscriptores segmentados en función del contenido que los usuarios vieron cuando se inscribieron.Una lista podría ser para las personas que enviaron su correo electrónico para descargar el libro electrónico del producto.A partir de ahí, usa las plantillas de correo electrónico de Constant Contact y el constructor de arrastrar y soltar para crear correos electrónicos que saluden a los suscriptores por su nombre y atraigan clientes potenciales para comprar ese producto.

Muchas marcas de comercio electrónico profundizan.Por ejemplo, a medida que las personas se inscriben en Birchbox para probar nuevos productos de belleza mensualmente, Birchbox sabe que sus clientes siempre están buscando el próximo producto que les hará las delicias.Por lo tanto, Birchbox realiza un seguimiento del historial de navegación y las compras de los clientes, por lo que utilice el correo electrónico para recomendar productos que los clientes probablemente apreciarán.Por lo tanto, los clientes obtienen exactamente el valor que estaban buscando cuando se inscribieron en los correos electrónicos de Birchbox.

Ejemplo de correo electrónico personalizado de Birchbox

Ejemplo de un correo electrónico personalizado de Birchbox.Fuente

6. Utilice iconos para reemplazar el texto siempre que sea posible

Hablamos de limitar la copia del correo electrónico a cinco frases.Sabemos que esto puede ser difícil.Una forma de hacer esto posible es usar iconos para reemplazar el texto en los correos electrónicos.Los iconos son imágenes pequeñas que representan palabras.Por ejemplo, puede ofrecer una lista de los servicios y, en lugar de escribir uno, reemplazar nombres de servicio por iconos que describan lo que hace."Escribir contenido" podría estar representado por lápiz y papel y "Análisis" con un gráfico.

Algunas marcas utilizan iconos para acompañar texto.De esta manera, si la gente no lee el texto, probablemente todavía tendrá una buena idea del mensaje.Por ejemplo, JetBlue utilizó iconos (como se muestra en el primer consejo) para acompañar el texto dentro de su correo electrónico e incluso actuar como subtítulos.Para mostrar un aniversario de adquisición de clientes de un año, se utilizó un icono de calendario.Sin embargo, otras marcas utilizan iconos para reemplazar completamente el texto, como readdle hace para reemplazar su lista de aplicaciones a continuación.

Muestra de diseño de correo electrónico readdle - Trabajar con iconos

Ejemplo de diseño de correo electrónico de readdle: uso de iconos.Fuente

7. Ofrezca primero información clave

Recuerde que sólo tiene 11 segundos para atraer a su lector de correo electrónico a hacer clic.Para aprovechar al máximo ese corto período de tiempo, necesitas atraer a tu lector y convencerlos de que vale la pena seguir leyendo o interactuando con tu correo electrónico.Al final, todo el correo electrónico simplemente debe atraer a los lectores a hacer clic sin mensajes adicionales que distraigan de este objetivo.

Para ello, utilice una pirámide al revés que atraiga primero la atención de los lectores.A continuación, construir su anticipación y finalmente darles una acción para realizar.Comience con un título de tres o cuatro palabras que resalte el valor clave que los lectores recibirán al leer su correo electrónico.Siga esto con algunas frases que incitan a los lectores a hacer clic mostrándoles el valor que necesitan para hacerlo.Por último, cuenta con un importante botón CTA que indica a los lectores exactamente qué hacer.

Además, las imágenes colocadas en la parte superior de su correo electrónico deben ayudar a atraer los ojos de sus lectores al centro del correo electrónico y el botón CTA.Por ejemplo, en este correo electrónico de Behavior Tech, la superposición de triángulos muestra la imagen en la parte superior dibuja naturalmente al lector del cielo al atardecer, a través del agua (entre el acantilado y las rocas) y copiando el correo electrónico.A partir de ahí, se anima a los lectores a hacer clic con un mensaje fuerte pero corto.Finalmente, reciben una cta prominente.

Ejemplo de diseño de correo electrónico triángulo invertido con superposición de triángulo - Tecnología de comportamiento

Ejemplo de diseño de correo electrónico de triángulo invertido con superposición de triángulos – Tecnología de comportamiento.Fuente

8. Crear proyectos con capacidad de respuesta móvil

Según Blue Corona, el 75% de los correos electrónicos se controlan a través de dispositivos móviles.Esta cifra se eleva al 81% entre las personas de 18 a 24 años. Esto significa que si tus correos electrónicos no responden a dispositivos móviles, perderás hasta el 81% de tus lectores.Por extensión, esto significa que pierde el 81% de las conversiones de correo electrónico potenciales.Conclusión: Enviar correos electrónicos que no son compatibles con dispositivos móviles es un gran error.

Un correo electrónico con capacidad de respuesta móvil (también conocido como correo electrónico optimizado para dispositivos móviles) es el que se muestra bien tanto en dispositivos de escritorio como móviles.Crear correos electrónicos responsivos no es difícil.Cuando diseñas manualmente tu correo electrónico, estos son algunos consejos:

  • Sea conciso en su mensaje, manteniendo todo el texto del correo electrónico en unas cinco frases.
  • Seleccione una plantilla de correo electrónico de una sola columna (la mayoría del software de marketing por correo electrónico los ofrece).
  • Incluya solo un botón de llamada a la acción.
  • Utilice un carácter de título mínimo de 22pt y un carácter de cuerpo de 14pt.
  • Elija un color de fuente que contraste fuertemente con el fondo.

Por ejemplo, el correo electrónico siguiente fue enviado por Casper.Muestra texto mínimo, fuentes de copia y encabezado grandes, colores de texto altamente contrastados y un botón CTA, todos perfectamente alineados en una columna para una experiencia de visualización ideal en cualquier dispositivo.

Diseño de correo electrónico con capacidad de respuesta móvil de Casper

Diseño de correo electrónico con capacidad de respuesta móvil de Casper.Fuente

Consejo profesional: Muchos software de marketing por correo electrónico (como Constant Contact) solo ofrecen plantillas de correo electrónico de respuesta móvil.Por lo tanto, en lugar de limitar todos los proyectos de escritorio a correos electrónicos a una columna, puede crear un correo electrónico para verse muy bien en los ordenadores de escritorio, y el software lo ajustará automáticamente para que se vea muy bien en cualquier dispositivo.

9. Incluir animación

Un GIF parece un vídeo corto que se ejecuta cada pocos segundos.En realidad, es una serie de imágenes mostradas rápidamente que, juntas, parecen movimiento.Según Litmus, los GIF en correos electrónicos son bastante populares, con la mayoría (56,6%) de los vendedores de correo electrónico que los utilizan.Muchas marcas recurren a gifs para aumentar la interacción por correo electrónico inculcando emociones (como nostalgia o intriga) en sus correos electrónicos.Otros lo utilizan para mostrar cómo funcionan sus productos o aparecen tridimensionalmente.

Crear un GIF no solo es fácil sino gratuito.Por ejemplo, muchos usuarios de Mac recurren a GIF Brewery para crear GIF, mientras que los usuarios de Windows a menudo utilizan GIF Animator como su herramienta preferida.Por ejemplo, para usar GIF Brewery, descargue la aplicación GIF Brewery desde mac Apple Store.Por lo tanto, importa un video o haz una grabación desde tu Mac.A continuación, utilice herramientas de edición GIF de cervecería para cambiar el tamaño, recortar, establecer la longitud GIF, aplicar filtros y agregar subtítulos o imágenes superpuestas.

Un ejemplo de un GIF que induce emociones es el GIF del Black Friday de Amazon.A tiempo para llegar a los lectores de correo electrónico que se están preparando para las vacaciones y disfrutando (o queriendo que estén disfrutando) noches agradables junto al fuego, cada pantalla del dispositivo electrónico dentro del GIF muestra un fuego crepitante.El efecto acogedor o incluso nostálgico atrae la atención de los lectores y los hace querer experimentar el concepto más.

Null

Null

10. Usar más texto que imágenes

Cuando utiliza demasiadas imágenes y poco texto en un correo electrónico, corre el riesgo de que el servidor rechace o filtre el correo electrónico como spam.Algunos clientes de correo electrónico bloquean las imágenes de forma predeterminada, es decir, si todo el correo electrónico es una imagen, no aparecerá cuando los suscriptores hagan clic en el correo electrónico.Además, es probable que los correos electrónicos con imágenes excesivas se agreguen a los filtros de spam por correo electrónico

Para evitar esto, recuerde que el 80% de su correo electrónico debe ser texto y sólo el 20% de ellos deben ser imágenes.A continuación, evite diseñar una imagen de correo electrónico (como un formato infográfico, por ejemplo) —que incluya todas las copias del cuerpo y las imágenes— y, a continuación, envíe la imagen.En su lugar, el correo electrónico debe ser componentes independientes del texto y las imágenes.Además, el texto debe incluir suficiente información para fomentar la lectura continua incluso si las imágenes no se muestran.

Sin embargo, si usted siente el impulso irresistible de utilizar una gran cantidad de imágenes o una imagen para todo el correo electrónico, crear un equilibrio mediante la adición de texto pie de página.Esto podría incluir información y recursos útiles, como enlaces de cancelación de suscripción, recordatorios de autorización, dirección comercial e invitaciones para seguirle, o obtener más información sobre sus otros canales de marketing (como las redes sociales o su sitio web).Por ejemplo, tenga en cuenta el texto del pie de página y el saldo general de imagen a texto en el correo electrónico de Adobe a continuación.

Ejemplo de correo electrónico de Adobe - Informe de texto a imagen

Ejemplo de correo electrónico de Adobe: informe de texto a imagen.Fuente

Consejo profesional: Claramente, si tu correo electrónico debe contener solo el 20% de las imágenes, esas imágenes deben ser contadas.Las imágenes de stock rara vez se prestan al valor de un correo electrónico como una imagen que ha sido hecha a medida para complementar su mensaje.Esto significa que es mejor crear sus propias imágenes personalizadas.Si, como la mayoría de los empresarios, no eres un diseñador gráfico, puedes contratar fácilmente uno por tan solo $5 por imagen de Fiverr.Sólo tiene que abrir una cuenta gratuita, a continuación, buscar "diseñadores gráficos".

11. Añadir características interactivas o dinámicas

El diseño interactivo de correo electrónico atrae a los lectores, razón por la cual una de las mayores tendencias de diseño de correo electrónico fue nombrada en 2018 por el 44% de los encuestados de Litmus.No sólo hace que los lectores se regocijen y presten atención, sino que un estudio realizado por el Content Marketing Institute encontró que el 66% de las marcas dicen que el contenido interactivo aumenta la participación para sus negocios.

¿Cómo utilizan las marcas el contenido interactivo dentro de los correos electrónicos?Algunos usan menús interactivos que ayudan a los suscriptores de correo electrónico a expandir el contenido que rodea el producto del que están específicamente interesados en obtener más información, directamente desde los correos electrónicos que han recibido.Nordstrom es un ejemplo de una de estas marcas, como se puede ver en el siguiente correo electrónico.

Ejemplo de correo electrónico de Nordstrom - Menú interactivo

Nordstrom Email Sample – Menú interactivo.Fuente

Sin embargo, otros como Forever 21 están jugando con el sentido de curiosidad de los lectores mediante la incorporación de rascadores interactivos; los usuarios deben rascar un área para revelar un código para ganar un descuento.Al final, las marcas crean experiencias para recordar y convertirse en marcas a recordar.

Null

Null

12. Utilizar el espacio en blanco estratégicamente

El espacio en blanco es el espacio alrededor de imágenes y bloques de contenido.No tiene que ser blanco, pero no tiene que ser contenido como texto o imágenes.Utilizado estratégicamente, el espacio en blanco le permite organizar el contenido, hacerlo más consumible y dirigir los ojos de los lectores al contenido clave.También puede agregar espacio para respirar alrededor de su contenido, ayudando a reducir los tiempos de carga, evitar pantallas de lector abrumadoras y evitar clics no deseados.

Por ejemplo, al copiar, el espacio en blanco distingue los puntos clave, haciendo hincapié en ellos.Los encabezados antes y después ayudan a que la copia sea escaneable.Cuando se utiliza en torno a imágenes de productos, llama la atención de los lectores sobre las imágenes y aumenta la concienciación sobre los productos.Del mismo modo, atrae los ojos de los lectores a contenido que induce la participación, como botones, experiencias interactivas y GIF.Por último, garantiza que los lectores solo interactúen con el contenido que pretenden (sin clics accidentales) en pantallas pequeñas.

La prueba de fuego, por ejemplo, utiliza espacios en blanco para enfatizar contenido clave que estimula la curiosidad y fomenta la lectura continua."¡Guarda las fechas!"Los botones CTA están rodeados de un amplio espacio en blanco, atrayendo los ojos de los lectores hacia ellos y asegurándose de que los lectores no hagan clic accidentalmente en características no deseadas en pantallas pequeñas.Esto significa conversiones trazables de alta calidad.Por último, para evitar una pantalla desordenada, se burlan de más valor y dirigen a los lectores a aprender más a través de su feed de Twitter.

Ejemplo de correos electrónicos de los estantes: uso estratégico del espacio en blanco

Ejemplo de correos electrónicos de los estantes: uso estratégico del espacio en blanco.Fuente

13. Elija No más de dos caracteres legibles

Hay dos categorías principales de personajes, serif y sans serif.Los caracteres Serif tienen esas pequeñas líneas que se extienden desde el final de cada trazo hasta letras y símbolos.Estos detalles adicionales los hacen más imaginativos y le dan a su correo electrónico un aspecto más sofisticado o formal.Las fuentes Sans Serif carecen de estos detalles adicionales y por lo tanto ofrecen un ambiente más informal.Es importante que coincida con la fuente que usas en tu correo electrónico con la imagen de tu marca, incluso si es formal o casual.

No todas las fuentes que ves en la web están instaladas en todos los dispositivos.Si el usuario usa un dispositivo que no tiene instalada la fuente elegida, el cliente de correo electrónico la reemplazará por una que lo sea y, a continuación, modificará el aspecto de su correo electrónico.Sin embargo, hay algunos que se ofrecen en todos los dispositivos, como Arial, Georgia, Times New Roman y Courier.Haga clic aquí para obtener una lista completa.Para asegurarse de que su correo electrónico es coherente en todos los dispositivos, elija las fuentes de correo electrónico de esta lista.

Por ejemplo, Kate Spade combina sofisticados caracteres de encabezado con caracteres de texto de cuerpo concretos y casuales.El resultado es un correo electrónico que fabrica prendas y accesorios elegantes y sofisticados al alcance de las mujeres de todos los días.

Ejemplo de correo electrónico de Kate Spade: personajes mixtos

Ejemplo del correo electrónico de Kate Spade: personajes mixtos.Fuente

En conclusión

Cada correo electrónico empresarial debe crearse y enviarse teniendo en cuenta un objetivo de marketing específico.Para la mayoría de las empresas, esto significa que los correos electrónicos deben animar a los lectores a hacer clic en un botón de llamada a la acción.Para crear este propósito, las marcas deben prestar atención a cómo utilizan imágenes, texto y espacio en blanco, y la experiencia colectiva de suscriptores que su diseño crea para los suscriptores en todos los dispositivos.