Maquetación de email promocionales

Aqui un apunte para un tema concreto. vía www.tallerd3.com

El arte de maquetar emails para que sean visualizables en todos los programas de correo es sumamente complicado. Cada cual soporta las propiedades de CSS que le parece. Haciendo un trabajillo reciente he encontrado estos consejos para maquetar emails en Scuain.com:

  • Maqueta usando tablas, con un HTML básico
    Desafortunadamente, nada de <div> en el código.
  • El uso de CSS está limitado
    Algunas propiedades como backgound-image o margin no suelen funcionar. Este listado es la mejor referencia para saber cuales puedes usar. Se actualiza periódicamente y existe una versión imprimible en PDF.
  • El CSS debe estar insertado en línea en cada etiqueta HTML
    Por ejemplo <p style=”font-size: 20px; color: #656565;”>. Si no quieres hacerlo a mano, Premailer es una herramienta que inserta las diferentes propiedades en cada una de las etiquetas.
    Si vas a usar clases, es necesario que dupliques el código CSS: debes insertarlo tanto en el <head> como en el <body>.
  • Usa el atributo alt en las imágenes
    Si el programa de correo o webmail bloquea las imágenes (la mayoría lo hacen por defecto), se podrá leer una pequeña descripción de esa imagen.
  • No adjuntes las imágenes
    Debes colgarlas en un servidor y poner la ruta absoluta (<img src=” http://www.midominio.com/mail/imagen.gif” … />)
  • No uses Flash ni JavaScript
    La gran mayoría de programas y webmails lo filtran o desactivan.
  • Usa la codificación ISO-8859-1
    Es la más habitual para emails en castellano. Además, y como medida de seguridad, es recomendable usar entidades HTML. Si te resulta más cómodo, puedes usar este conversor.
  • Comprueba el resultado
    Después de maquetarlo, hay que comprobar el resultado a través de los diferentes clientes (Outlook Express, Mozilla Thunderbird…) y webmails (Gmail, Hotmail, YahooMail…).
    Siempre existirán pequeñas diferencias entre uno y otro, así que el objetivo es conseguir un aspecto similar y que puedan leerse sin problemas.
  • Vigila el nivel de spam
    Actualmente, muchos de los emails no superan los filtros anti-spam. El nivel de spam aumenta si usas muchos links y poco texto, tamaños de fuente elevados, texto en mayúsculas, caracteres “raros” en el título… Puedes comprobar los niveles de tu email en http://spamcheck.sitesell.com/.

Leave a Reply