Prácticas esenciales al maquetar Email a HTML

Sabemos que la maquetación de email a html a veces puede hacerse tedioso, ya que no es lo mismo que maquetar una página. Por ello, es necesario considerar algunos puntos para que sea visualizado correctamente por los clientes de correos:

• Familia de fuente: Se debe considerar que los textos sean lo más generalistas posibles, como por ejemplo: “Arial”, ya que los correos electrónicos no tienen soporte al @font-face, que si lo tiene las páginas webs.
• Imágenes: Las imágenes deben ser las más livianas posibles con el fin de mejorar la experiencia de usuario, se puede utilizar alguna herramienta online para mejorar la optimización como por ejemplo: tinypng.com
• Atributo ALT: Este atributo ayuda a visualizar el contenido (text0s equivalentes) en caso las imágenes no carguen en el cliente de correo (Gmail, Outlook, etc.) esto puede deberse por múltiples factores como: correo no deseado, spam, la IP pueda estar bloqueada, etc.
• Tablas: Usar tablas al maquetar toda la estructura del email con fin de lograr la mayor compatibilidad para todos los clientes de correos entre los más y menos usados en el mercado.
• CSS Inline: Todo el CSS que se vaya a utilizar, deberá ser colocado de manera inline, ya que los emails no tienen soporte el <style /> sino del style=”….”. Adicionalmente, se debe contemplar que todos los elementos deben ser reseteados para maximizar la compatibilidad en los clientes de correos.

Existen aún más, pero ya hablaremos en otro post 🙂 sino tienes alguna pregunta coméntanos.

Categoría: Maquetación EMAIL