Crear cuenta Mailrelay Crear cuenta Mailrelay Crear cuenta Mailrelay

Las 10 claves básicas para maquetar tu newsletter

Publicado por Florencia Tesone en octubre 7, 2014

10 claves para maquetar tu newsletter

En el artículo de hoy te contamos las 10 claves esenciales para maquetar tu newsletter.

Encontrarás algunos consejos que podrás aplicar ya mismo cuando te pongas a maquetar tu newsletter en todos los envíos que hagas desde nuestra plataforma de email marketing.

Vamos con las 10 claves que te harán mejorar de forma muy significativa tus newsletters.

¡Envía hasta 75.000 emails gratis!

 

1- Elige diseños simples,responsivos y livianos

Las newsletters deben tener un diseño sencillo que permita verse correctamente en todos los clientes de correo, como así también en diferentes plataformas.

Te recomendamos que al maquetar tu newsletter utilices tipografías estándar, fondos de colores planos, como así también reducir el uso de imágenes, en favor del texto.

Recuerda que, cuanto más livianas sean tus newsletters, más rápida será su descarga. No es conveniente que el peso de tu html sea mayor a 1 MB.

Utiliza diseños responsive

2- Utiliza HTML puro

El HTML que utilices debe ser lo más sencillo posible evitando scripts, estilos, efectos, formularios, etc.

Tus newsletters deben incluir en el mensaje, versiones HTML y de texto plano.

Por defecto el sistema Mailrelay genera el mensaje de texto plano desde el mensaje HTML, lo que es más efectivo, dado que la diferencia entre ambos textos puede derivar en el aumento de la spam score.

Aprovecha el HTML

3- Maqueta tu newsletter utilizando Tablas

A pesar del avance que significó el surgimiento del HMTL5 y CSS3, los clientes de correo aún no han incorporado completamente estas tecnologías y continúan utilizando tablas en la codificación del HTML.

Por eso te recomendamos que siempre maquetes tu newsletter utilizando tablas, para evitar resultados inesperados.

Utiliza las tablas en tus maquetaciones

4- No superes los 600px de ancho

Muchos de los clientes de correo no despliegan tu email a pantalla completa, sino a través de un panel de pre-visualización que posee un ancho de 600 px aproximadamente.

También debes tener en cuenta que, las imágenes que poseen un ancho mayor tienen más probabilidades de ser consideradas Spam.

Es importante que respetes esa medida, para que tus newsletters puedan ser visualizados correctamente.

No superes los 600px de ancho

5- Utiliza estilos en línea (Inline Styles)

Algunos clientes de correo, no soportan la etiqueta style en la cabecera del Email.

Para evitar este problema, sería mas conveniente que uses estilos en línea.

Por ejemplo, si quieres aplicar un tamaño de fuente a un elemento a través de la etiqueta span, es necesario codificarlo de la siguiente manera:

Codifica correctamente el estilo para evitar problemas en gestores de email

6-Evita resultados inesperados en tus imágenes

Cuando utilizas imágenes partidas o una imagen, al lado de otra, con una estructura de tabla, es necesario que cada imagen tenga el estilo “display:block”.

Ya que clientes de correo como Gmail, generan automáticamente un espacio blanco, no deseado, entre las imágenes, desarmando el diseño de nuestras newsletters tla y como puedes ver a continuación:

Ejemplo de como se ven dos imágenes en paralelo

7-Evita adjuntar archivos

Los filtros antispam los miran con malos ojos y más si son doc, exe, zip, etc. que pueden contener virus.

Es recomendable que los adjuntos se suban a un FTP insertando un enlace en el cuerpo del mensaje para que se lo puedan descargar los destinatarios.

Además así tendrás un feedback en estadísticas de quien ha abierto el archivo.

Evita los adjuntos

8- Optimiza tus imágenes

Para reducir el peso de tus imágenes, sin perder calidad, es necesario que las comprimas en un programa de edición o bien puedes utilizar una herramienta como por ejemplo Kraken.io, una aplicación web que funciona de maravillas.

Optimiza tus imágenes

9- Incluye siempre un texto legal

Para que tu web sea legal debe contener:

  • Una explicación de cómo se han obtenido los correos electrónicos
  • Un enlace a tu página de política de protección de datos
  • Una declaración de nuestra inequívoca voluntad de respetar las normas de envío de correos comerciales y un medio para solicitar un feedback a los suscriptores que deseen comunicar alguna queja o sugerencia

 

Incluye siempre un texto legal

10- Asegúrate de testar

Es necesario testar tus newsletter en distintos clientes de correo antes de enviar un mailing.

De esta manera, te aseguras que tus destinatarios las visualicen correctamente en todos los casos. Con Mailrelay puedes hacer envíos de prueba y asegurarte que tus newsletters lleguen sin inconvenientes.

Asegúrate de testar

Esperamos que estas claves te resulten útiles para aumentar tu conocimiento sobre como maquetar tu newsletter de forma óptimay crear emails vendedores.

A partir de aquí puedes seguir artículos de ejemplo de desarrollo de una plantilla, como por ejemplo:

Plantilla para tu newsletter tipo resumen de posts

Si tienes alguna pregunta o consulta sobre los temas hemos tratado, puedes dejarnos tus comentarios.

¡No dejes de compartir el artículo si te ha gustado!



Comentarios

  1. asa

    Hola,
    Buen post.
    Como puedo hacer una newsletter responsive si los estilos tienen que ser en linea. Donde pongo las media queries???

    26/10/2016 - 11:41:37 Publicar una respuesta
    • Mailrelay

      ¡Hola Asa!

      Pues el tema es que, no todos los clientes de correo soportan las media queries, los que si las soportan las podrán leer en el sitio habitual, dentro de las etiquetas

      26/10/2016 - 11:44:14 Publicar una respuesta
  2. Jrivero

    Saludos amigos de mailrelay, recien estoy viendo las maravillas que hacen en esta web. Los felicito!!
    En relación a este artículo, me parece excelente, aunque tengo una duda: Cómo hacer newsletter responsivos utilizando estilos en linea y tablas?

    02/02/2016 - 23:19:15 Publicar una respuesta
    • Mailrelay

      ¡Hola Jrivero! Utilizando tablas es bastante sencillo, utiliza anchos con porcentajes (100%, 50%, 80%, etc.) y así la newsletter se adaptará al ancho disponible. Igual con las imágenes. Es una solución bastante sencilla de implementar.

      03/02/2016 - 09:05:19 Publicar una respuesta
  3. Mariano

    Gracias chicos de Mailrelay!
    Excelente Post!
    No se si mencionaron en enlace de desuscripción.

    Saludosss!

    10/10/2014 - 00:48:16 Publicar una respuesta
  4. Johanna

    Excelente información, encierra todo lo que debemos hacer para no tener contratiempos con nuestro newsletter.

    Un saludo!

    08/10/2014 - 01:23:49 Publicar una respuesta
  5. Jose

    Excelente resumen. Sigo todas las indicaciones a excepción de las imágenes partidas que no sabía como solucionar. ¡¡ ahora ya sí !!
    Gracias.

    07/10/2014 - 15:26:18 Publicar una respuesta
    • Mailrelay

      ¡Me alegro que te sea útil Jose! El tema de las imágenes la verdad que siempre da problemas 🙂

      07/10/2014 - 15:52:09 Publicar una respuesta
  6. Mailrelay

    Si te ha parecido útil el artículo ¡Ayúdanos a compartirlo!

    07/10/2014 - 09:22:15 Publicar una respuesta

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *


Shares
Menu Title