La mayoría de los clientes de email no tienen la misma aceptación para los estándares web modernos que la que tendrían los navegadores. Crear un newsletter o campaña de email marketing y pretender que esta se vea correctamente entodos los clientes de correo no es tarea fácil. Si eres nuevo en el mundo del email (o has empezado hace poco con el html y css), aprender cómo codificar un email correctamente puede resultar un poco complicado. Cada cliente de correo tiene sus reglas y los mismos clientes de correo pueden tener diferentes reglas según con qué navegador seabran (no es lo mismo abrir un email en Hotmail o Gmail des de Firefox que des de Explorer).
Con la llegada del móvil se evoluciona un poco en las posibilidades de maquetación que ofrecen dichos clientes de correo, acercándose cada vez más al sistema de codificación html utilizada para web. Aun así, hay cosas que no cambian y existen programas de correo como Outlook2007 y 2010 que utilizan el procesador de Microsoft Word para renderizar el html. Es por eso que, para poder llegar a todos nuestros usuarios tenemos que acatar los mismos estándares de maquetación que teníamos hace 20 años.
Un cuidadoso estudio de los dispositivos que utilizan nuestros clientes para abrir los correos, así como el cliente de correo que utilizan para ello; definirá el tipo de maquetación por el que deberíamos apostar. Si nuestros usuarios utilizan herramientas como Apple Mail o Thunderbird, podremos jugar un poco con propiedades más divertidas como el uso de gifs animados, probar el vídeo en html5, utilizar sombreados y otros estilos de CSS3, etc. Si por el contrario nuestros clientes utilizan Outlook deberemos ser más conservadores con nuestros diseños.
Hemos creado una serie de artículos con consejos y conceptos básicos de maquetación (HTML y CSS) para newsletters y las mejoras en estos campos que ofrecen las nuevas tecnologías.
Aquí tienes los ingredientes para la receta de un newsletter 100% compatible:
1. Utilizar las herramientas adecuadas
2. Maquetar con tablas anidadas
3. CSS en línea y atributos de tablas
