Crear el diseño de un email no es lo mismo que crear el de un sitio web. Ante todo es conveniente alejarse de diseños complejos, ya que a mayor complejidad, más posibilidades existen de que el email no se vea bien en todos los tipos de correo (Outlook, Thunderbird, Hotmail, Gmail, Yahoo, etc.). En la sencillez no solo está la elegancia, sino la seguridad de que los destinatarios de nuestro email serán verdaderos receptores de nuestro mensaje publicitario. La prueba y el error también nos ayudarán a saber cuál es el código más óptimo para cada proveedor de correo.
En cualquier caso, es importante seguir las siguientes recomendaciones:
1- Utilizar tablas para la maquetación de contenido, no div’s
La única forma de que el diseño de nuestro email cuente con una estructura es utilizando tablas. Los div’s son realmente útiles, pero solo en el diseño de sitios web. Si los utilizamos en email, no lograremos alinear nuestros contenidos.
2- Los CSS siempre in-line
Para dar formato al contenido de nuestro email hay que definirlo dentro de las tablas o (preferiblemente en los TD), pero nunca en hojas de estilo aparte, ni en el head de nuestro HTML. Recomendamos utilizar las etiquetas <style></style> dentro del <head></head> únicamente para el diseño responsive mediante media queries.
3- Equilibrio de imágenes y texto
Si abusamos de las imágenes hay más probabilidades de que nuestro email acabe en la bandeja de spam. Por ese motivo lo mejor es lograr un equilibrio entre éstas y el texto.
4- Alojar las imágenes en un servidor
La mayoría de los clientes de webmail no soportan imágenes embebidas ni tampoco muy pesadas. La clave es alojar las imágenes en un servidor, desde nuestro diseño, mediante una URL.
5- Cuida el peso de los emails
Es especialmente importante cuidar el peso de las imágenes y optimizarlas para web si queremos una buena recepción de nuestros emails. Incorporando en nuestro diseño una imagen de 300 dpi, lo único que conseguiremos es que el tiempo de carga de la misma sea demasiado largo. En realidad podemos mostrar la misma imagen a 72 dpi haciendo que el tiempo de espera del usuario sea mucho menor.
6- Definir los ALT’s
Existen muchos destinatarios que tienen la navegación por imágenes desactivada. La definición de los ALT’s hará que quien tenga la navegación por imágenes desactivada pueda saber, por ejemplo, donde hay una llamada a la acción, donde hay una imagen del producto, etc.
7- Recordar siempre que un email no es una página web
No podemos utilizar javascript, PHP o flash, ya que no se cargarían o harían que el correo fuera a parar directamente a la bandeja de spam.
8- Evitar el uso de imágenes cortadas horizontalmennte
Para evitar que se generen espacios extra entre imágenes, hay que añadir el siguiente código en cada una de las <td> en las que haya imágenes: style=”border:none; font-size:0; line-height:0; letter-spacing:0; padding:0px; margin:0px;”.
9- Evitar el uso de rowpans
Es importante también evitar el uso de rowspans cuando se codifica el email. Algunos proveedores de correo como Lotus y Hotmail no lo mostrarán correctamente, por lo que la mejor alternativa es el uso de colspans o bien las tablas.
- SERVICIOS
- QUIENES SOMOS
- CASE STUDIES
- CLIENTES
- BLOG
- EBOOKS Y DESCARGAS
+34 93 611 60 34
