Lo que NO debes hacer al maquetar correos electrónicos en HTML
Yacarlí Carreño · 24 Sep, 2015 · Email marketing avanzado · 3 min
Ya te hemos contado cómo crear tus propias plantillas de email marketing; ahora nos concentramos en lo que NO debes hacer al maquetar correos electrónicos en HTML. ¡Esperamos que te sea útil!
En nuestra plataforma ponemos a tu disposición una serie de plantillas fáciles de personalizar, responsize y que te permitirán crear tu campaña de email marketing en pocos minutos. Sin embargo, si aún prefieres crear tu propia plantilla, lo entendemos. Solo pretendemos ampliar nuestros consejos para que puedas programarla de la mejor forma posible. Recuerda: errores en el diseño de tu plantilla pueden repercutir negativamente en las estadísticas de tus envíos.
Si ya has revisado nuestra Guía fácil para maquetar un correo electrónico en HTML y las Normas básicas en HTML -que debes conocer- para evitar que tu email vaya a spam, te dejamos ahora un nuevo artículo profundizando en los errores que debes intentar cometer al crear tus propias plantillas.
Para crear tus correos electrónicos en HTML no solo basta tener conocimientos generales de programación, crear códigos para sitios web no es igual que hacerlo para una campaña de email marketing. Los navegadores no responden igual que los buzones de correo.
Cosas que NO debes hacer cuando maquetes emails con HTML
Puedes diseñar tu código, para comenzar, directamente en nuestra herramienta, o en un editor externo como Notepad++. Hablemos ahora de lo que NO debes hacer al maquetar correos electrónicos en HTML:
- Nada de estilos en cascada (CSS); estos estilos no son soportados por Gmail ni por algunos otros buzones de correo. La mayoría de los buzones solo soportan los estilos más básicos de HTML. No uses estilos avanzados como clear, float, z-index, etc. Los estilos deben ser en línea. Prueba nuestro CSS Inliner.
- Organiza tu plantilla por medio de tablas. Piensa bien en cómo distribuirás el contenido del mensaje (imágenes, texto, enlaces) y sobre esa planificación, diseña, no lo hagas al revés. Puedes ayudarte dibujando diseño a mano antes de comenzar. Crea una tabla que responda a las necesidades de tu diseño y coloca cada porción de contenido en cada celda.
- Agrega tantas filas y columnas como necesites, eso sí: recuerda mantener el ancho máximo entre los 600 y 650 píxeles.
- Evita formas cortas de código. Debes escribirlo completo.
- Puedes utilizar efectos sobre los enlaces como mouse_over o el efecto hover, pero no confíes en que funcionará en todos los buzones. Para cambiar el color de los enlaces, utiliza etiquetas <span> entre <a> y </a> para modificar el formato.
- Ten en cuenta que la mayoría de los buzones bloquean las imágenes y que el lector no las verá si no pulsa ¨mostrar imágenes¨. Evita diseñar todo como una imagen, la proporción texto, imágenes es fundamental. Recuerda cómo optimizar imágenes para enviar por emailing.
- No incluyas imágenes sin el atributo alt (texto alternativo).
- Usa celdas <td> para contener dentro el texto. Evita las etiquetas de bloque en nivel como <h1> o <p>.
- Evita utilizar Flash, JavaScript o TypeKit. La animación de los gifs no es soportada por todos los buzones, así como los formularios y las cajas de búsqueda, que tampoco suelen dar buenos resultados. Aquí profundizamos en la mejor manera de agregar GIFs a tus emails.
- No envíes tu correo sin hacer pruebas antes. Envía algunas pruebas a terceros que puedan echarte un ojo y revisa bien cómo se visualizaría la plantilla en distintos buzones de correo.
Recuerda que en nuestra plataforma te ofrecemos variedad de plantillas. Revísalas primero, quizás te gusten y ya no tengas que diseñarlas tu mismo. Si te decides a crear y tienes alguna duda, no dudes consultarnos a través del chat de soporte en nuestra web.
Tú creas el contenido. Nosotros lo enviamos.