¿Debería enviar correos electrónicos HTML?
Este es sin duda un tema debatido, pero en última instancia, digo que si tiene un mensaje que cree que se beneficiaría de un correo electrónico bien diseñado, debe hacerlo. Si solo quiere hacerlo porque todos los demás en su cuadra también lo están haciendo, no lo haga. Si decides hacerlo, estos son los que considero los cinco reglas de oro de correos electrónicos HTML:
- Envíe correos electrónicos únicamente a las personas que optaron por recibirlos.
- Asegúrese de crearlo para que se vea lo mejor posible en todos los clientes de correo electrónico.
- No se exceda. Semanal es probablemente con demasiada frecuencia.
- Envíe una alternativa de texto sin formato.
- Ofrezca un enlace de exclusión voluntaria y hágalo honor.
Actualización: este artículo tiene aproximadamente una década cuando actualizo esto. Probablemente ya no sea una gran fuente de información. Una buena fuente de información sobre CSS en el correo electrónico HTML es la guía de Campaign Monitor.
ESCRIBA su correo electrónico antes de diseñarlo
Lo primero que debe hacer es escribir la versión de texto sin formato de su correo electrónico. Hacer esto primero, mientras está fresco, conducirá a una mejor copia, un mejor plan para el diseño y, en última instancia, un mejor correo electrónico. Deberá hacer esto de todos modos, ya que una de las reglas de oro es enviar una alternativa de texto sin formato a los correos electrónicos HTML. El envío de AMBOS un mensaje de texto sin formato y un correo electrónico HTML en un correo electrónico combinado se denomina formato de correo electrónico multiparte / alternativo, o MÍMICA. La mayoría de los clientes de correo electrónico lo admiten, es lo que aparece y te pregunta si quieres enviarlo en texto sin formato, HTML o ambos, como en esta captura de pantalla de Thunderbird:
Un par de consejos rápidos para su correo electrónico de texto sin formato: ajuste sus líneas a 60 caracteres y escriba las URL completas en lugar de usar etiquetas de anclaje.
Diseñe primero para el mínimo común denominador.
Una vez que haya terminado la versión de texto sin formato de su correo electrónico, comience a pensar en el diseño. Cada cliente de correo electrónico que lea su correo electrónico tendrá sus propias reglas sobre cómo trata los correos electrónicos HTML, por lo que tendrá que diseñar para el mínimo común denominador. ¿Cree que es un fastidio tener que probar sitios web en 4-5 navegadores diferentes? Es mucho peor con el correo electrónico. Aquí hay una lista parcial: AOL (múltiples versiones), Comcast, Earthlink, Gmail, Hotmail, Lotus Notes, Mail.com, Outlook (múltiples versiones), Thunderbird, Windows Live, Yahoo !, Mail.app. Por no hablar de los clientes móviles.
Suponiendo que tiene una lista bastante grande a la que está enviando y no tiene idea de qué tipo de clientes de correo electrónico están utilizando, deberá pensar en términos de lo que no puede hacer más de lo que puede hacer.
Lo que NO PUEDES hacer:
- Incluir un
<head>sección con<style>. Apple Mail.app lo admite, pero Gmail y Hotmail no, por lo que es un no-no. Hotmail admitirá una sección de estilo en el cuerpo, pero Gmail aún no lo hace. ACTUALIZAR: En 2020, esto está mucho mejor respaldado. - Enlace a una hoja de estilo externa. No muchos clientes de correo electrónico admiten esto, es mejor olvidarlo.
- Imagen de fondo / Posición de fondo. Gmail también es el culpable de este.
- Limpia tus flotadores. Gmail de nuevo.
- Margen. Sí, en serio, Hotmail ignora los márgenes. Básicamente, cualquier posicionamiento CSS no funciona.
- Font-cualquier cosa. Es probable que Eudora ignore todo lo que intente declarar con fuentes.
Hay algunas cosas más que debe tener en cuenta. Para obtener una gran lista completa de qué servicios de correo electrónico en línea admiten qué, consulte este artículo.
Lo que puedes hacer.
En dos palabras estilos en línea. No es tan terrible como podría pensar, ya que básicamente estamos desarrollando un correo electrónico único, los estilos en línea no son tan atroces como usarlos en un sitio web. ¿Necesita un título verde grande para un bloque de texto?
AHORA $ 159
- El gran se puede hacer es imagenes. Piense de forma creativa en lo que puede hacer con las imágenes.
- Dado que utilizará tablas, piensa en cuadrícula. Las cuadrículas son amigos de los diseñadores, hay muchas cosas que puedes hacer con una cuadrícula.
Las tablas siguen siendo el estándar.
Eche un vistazo al código de casi cualquier correo electrónico HTML que haya recibido. Apuesto a que está formateado con una tabla. Las tablas siguen siendo la mejor manera de lograr resultados consistentes en todos los clientes de correo electrónico. El correo electrónico equivalente a la ventana del navegador es la “ventana gráfica”, o el área de un cliente de correo electrónico dedicada a mostrar el correo electrónico real. Esto varía bastante. Una técnica muy común es colocar una mesa con un ancho del 100% con una mesa anidada dentro de ella que esté centrada con un ancho estático. Esto parece funcionar muy bien. La tabla exterior también es su gran oportunidad para establecer el color de fondo de todo el correo electrónico. Lástima que no podamos usar un div con márgenes automáticos izquierdo y derecho para centrar, pero no funcionará con la mayoría de los clientes de correo electrónico.
¡Ayudar!
Si simplemente no quiere pensar en todos estos desagradables estilos en línea que arruinan su código y todas las pequeñas reglas de lo que funcionará y no funcionará, ¡no se preocupe! Existe un servicio de verificación previa realmente agradable (y gratuito) llamado Premailer. Con Premailer, simplemente diseña su correo electrónico como una página web (aún piense en tablas), luego envíe su URL. Premailer analizará el HTML y convertirá todos sus estilos en estilos en línea por usted, además de brindarle una lista de advertencias CSS sobre las cosas que está haciendo que podrían ser peligrosas y para qué clientes de correo electrónico son peligrosos. ¡Práctico!
También son proveedores de marketing por correo electrónico HTML de servicio completo. Más notablemente, MailChimp. Con MailChimp, usted diseña sus correos electrónicos directamente en su editor web. Todavía tiene una buena cantidad de control, la plantilla prefabricada es bastante buena y MailChimp hará todo lo posible para asegurarse de que el correo electrónico se vea absolutamente mejor en todos los clientes de correo electrónico. Solo eso vale las tarifas razonables ($ 30 / mes para listas de hasta 2500 y sube y baja desde allí). Sin embargo, MailChimp ofrece más, un servicio que es casi invaluable al administrar sus listas por usted. Obtiene una página web personalizable a la que puede enviar personas para que se registren para recibir sus correos electrónicos, que los agregará automáticamente a su lista. Aún mejor, también manejan las cancelaciones de suscripción automáticamente. Ambas cosas pueden ser tan transparentes para ti como quieras. Se proporcionan estadísticas sobre sus correos electrónicos.
Hay una versión de prueba gratuita para el servicio disponible. Incluso si nunca terminas usando el servicio, deberías visitar el centro de recursos de MailChimp. Tienen TONELADA de información útil sobre marketing por correo electrónico, información técnica y consejos de diseño. Incluso ofrecen un PDF de 64 páginas totalmente gratuito llamado Diseño, codificación y entrega de correo electrónico HTML: una guía de supervivencia para principiantes, que es un lugar increíble para comenzar a comprender estas cosas.
¡Consejos rápidos!
- Recuerda usar caminos completos a imágenes, no a rutas relativas. (por ejemplo, http://www.yourserver.com/email/images/logo.gif). Además, enlace a imágenes de su propio servidor, no de nadie más.
- Consulte con su ISP antes de salir a enviar miles y miles de correos electrónicos, es posible que piensen que es un spammer.
- Prueba, prueba y prueba de nuevo con tantos clientes de correo electrónico diferentes como pueda tener acceso. Definitivamente querrá probar los principales clientes en línea como Gmail, Yahoo y Hotmail, pero también definitivamente verifique Outlook, Mail.app y tantos otros clientes de escritorio como sea posible.
- No pases de 600px de ancho. Incluso eso lo está empujando. Si su diseño puede manejarlo, 440px está más cerca de lo ideal.
- Piense en cualquier CSS adicional que pueda usar como compatibilidad ascendente. Siempre puede incluir algún CSS de estilo de encabezado si lo desea, pero considérelo como una ventaja para las personas que utilizan clientes de correo electrónico que lo admiten. Luego apáguelo por completo y asegúrese de que el diseño aún tenga sentido.
- Trate de no parecer SPAM. Bastante obvio, pero solo escribir un buen código y una copia honesta debería mantenerte fuera de la lata aquí. Su correo electrónico HTML definitivamente NO es el lugar para una broma sobre Viagra.
- Al igual que en el diseño web, no está de más piensa por encima del pliegue. Es decir, lo que los usuarios verán antes de tener que desplazarse.
- Use su pie de página como un pie de página. Este es un gran lugar para muchas cosas, incluidos números de teléfono y direcciones, información, opciones para cancelar la suscripción y quizás un pequeño recordatorio de qué es este correo electrónico y por qué el lector está en la lista.
- OBEDECER LA LEY. La ley CAN-SPAM se convirtió en ley el 1 de enero de 2004. Dice que hay muchas cosas que debe hacer como correo electrónico comercial. Los aspectos destacados son básicamente no engañosos y DEBES incluir una dirección postal física, así como un enlace para cancelar la suscripción que funcione.
Ejemplos.
Creo que todos estos son ejemplos bastante efectivos. Papa John’s es un delincuente por el envío de correos electrónicos con mucha frecuencia, pero sus correos electrónicos suelen ser bastante atractivos.
¡Buena suerte!