Podemos afirmar que, hoy en día, los usuarios digitales nos hemos vuelto tan, pero tan exigentes, que ya no nos andamos con rodeos: si recibimos -en nuestra bandeja de entrada de correo electrónico- unos 20 o 30 emails al día, y tenemos la «paciencia» de abrirlos todos, si uno de ellos no presenta un diseño responsive, lo más posible es que, directamente, lo tiremos a la papelera, ¿o no?
Por eso, se torna tan importante para las marcas contar, desde el inicio, con diseños de email totalmente responsive. Es más, no sería para nada sorprendente que, si vamos a diseñar -con nuestro equipo creativo-, ya sea una newsletter, post o incluso landing o página web, iniciemos nuestros wireframes y layouts directamente en formato mobile, adaptando después ese diseño al formato desktop. ¿Por qué? La respuesta a esto es fácil: porque, hoy en día, prácticamente todos los usuarios accedemos a nuestras consultas web a través de nuestro dispositivo smartphone.
E, impulsados por esta razón, en nuestro artículo de hoy vamos a darte una serie de tips para que sepas, perfectamente, cómo crear una newsletter responsive desde el principio.
Guía para crear emails responsive
Comienza con una plantilla de newsletter responsive
Antes de iniciar cualquier tipo de diseño, es importante partir de un layout que nos permita visualizar, esquemáticamente, el diseño de nuestro contenido; al igual que hacemos con los wireframes cuando vamos a empezar a diseñar y programar una landing page o página web.
Y, por supuesto, debemos tener muy presente que las pantallas de los dispositivos móviles cuentan con un diseño vertical, lo que nos obligará -queramos o no- a reducir el tamaño de todos aquellos recursos que dispongan de un tamaño mayor, o sumamente apaisado u horizontal.
Por tanto, a la hora de realizar nuestro layout te recomendamos optar por un diseño con una sola columna, ya que -de esta manera- te asegurarás que los navegadores y los servidores de correo electrónico se adapten a la perfección al diseño que estás mandando, y que será visualizado por tu comunidad de manera correcta.
Elige el tamaño adecuado de imágenes para tu diseño
Y, por supuesto, no olvides nunca incluir un Alt Text, que, dicho en otras palabras, hace referencia al texto alternativa que incluimos en una imagen, para que sea mostrado en el hipotético caso de que la imagen, por alguna razón, no pueda visualizarse en la pantalla del dispositivo del usuario. Así, le informarás de que, en ese lugar, debería aparecer una imagen pero que no es posible que se visualice.
También es importante que evites llenar o cargar demasiado tu newsletter de imágenes: porque, en primer lugar, el texto es necesario (aunque deba existir un equilibrio razonable, para que no «aburras» en exceso a tu usuario) y para que, también, evites -por ejemplo- el escenario de que el usuario, por cualquier razón, no pueda visualizar las imágenes y, como has cargado el diseño de estas, al final no pueda visualizar prácticamente nada de tu comunicado.
Tus llamadas a la acción (o CTA) deben ser ad hoc a una newsletter responsive
Como sabemos, uno de los elementos que nunca (bajo ninguna razón) deben faltar en una newsletter son los CTA, o llamadas a la acción que, dicho en otras palabras, se pueden definir como esos botones que, haciendo clic sobre ellos, nos llevarán a convertir la acción, ya sea para culminar una compra, cerrar un servicio, descargar un documento, etc, etc. Por eso, es importante que esos botones estén visibles en tu diseño y que, por supuesto, se adapten a tu formato responsive.
Porque, por ejemplo, imaginémonos que no tenemos en cuenta el formato responsive en una newsletter y lanzamos la misma sin pensar en que el usuario que está al otro lado no va a poder visualizar de primeras el CTA, teniendo que navegar o moverse dentro del propio diseño para llegar al botón. ¿No crees que, de primeras, esto ya generaría cierto rechazo por parte de éste? Te recomendamos que no dejes que esto llegue a suceder, y coloques tu CTA visible y centrado, directamente en un layout vertical adaptado a mobile.
Adapta tus textos a un diseño responsive
Al igual que sucede con los CTA y las imágenes, también es importante que los textos que coloques en tu diseño cuenten con una jerarquía y prioridades predeterminadas que hagan que el mensaje quede claro de primeras, en el primer momento en que accede a tu email; es decir, que sin necesidad de hacer scroll down, pueda leer qué es lo que está ofreciéndole tu newsletter y qué beneficio le reportará el hecho de seguir leyendo.
El tipo y tamaño de letra también es importante, sobre todo para asegurarte que estás utilizando una letra adecuada como para evitar que el usuario, por la razón que sea, necesite ampliar o ponerse las gafas para echar un vistazo a lo que tienes que contarle 🙂
Y, con esto, nos despedimos por hoy.
¡Sigue nuestros consejos y logra una buena newsletter adapta a responsive!
¡Suerte y hasta la próxima, querido e-marketer!