Email

Herramienta Correo electrónico de HubSpot: Mejores prácticas

Última actualización: March 9, 2016

¿Quieres que tus campañas de email marketing sean tan exitosas como sea posible? Sigue estas mejores prácticas sobre el contenido y las plantillas de correo electrónico para garantizar la capacidad de entrega de los correos y promover la interacción con el destinatario.

Crear plantillas de correo electrónico

Mantener tu plantilla simple

Tus campañas de correo electrónico deben centrarse más en el mensaje y no tanto en el diseño de tu correo electrónico. Al igual que con tu sitio web, el contenido siempre debe ser lo más importante.

Mantener el ancho del correo electrónico por debajo de los 600 píxeles

Esto garantiza que los usuarios de clientes de correo como Outlook puedan ver tu correo electrónico en su panel de vista previa vertical. Puedes establecer un ancho del cuerpo en tu configuración de correo electrónico de HubSpot.

Cumplir con la normativa CAN-SPAM

Debes incluir una opción para cancelar la suscripción en cada correo electrónico, así como también el nombre y el domicilio de tu empresa. En HubSpot, no puedes guardar una plantilla de correo electrónico sin incluir este elemento. Para tu conveniencia, busca a continuación documentación útil sobre cómo configurar tu información de CAN-SPAM dentro de HubSpot.

Crear plantillas con el creador de plantillas de HubSpot
La codificación para lograr consistencia a través de los distintos clientes de correo electrónico requiere comprender las pequeñas diferencias entre los lenguajes HTML y CSS de cada cliente. Para omitir esta dificultad, utiliza las herramientas integradas de HubSpot para crear correos electrónicos y asegurarte de que se vean bien en todos los clientes principales de correo electrónico y que sean responsivos en los dispositivos móviles.

Utilizar un software adecuado para códigos

Al copiar y pegar un código personalizado externo en los módulos de texto enriquecido, utiliza un editor de texto simple como Notepad o Sublime Text. Al copiar contenido desde Word y otros editores WYSIWYG típicos, se suele agregar código extra que hará que tu correo electrónico no pueda visualizarse correctamente en ciertos clientes de correo electrónico. Como una alternativa, puedes crear tu contenido directamente en el editor de correo electrónico de HubSpot.

Diseñar con tablas

A pesar de que el diseño de páginas web con tablas ya no forma parte de las mejores prácticas, las tablas son fundamentales al diseñar correos electrónicos. Es la única manera de que tu diseño sea representado correctamente en varios clientes de correo electrónico. Asegúrate de ajustar el tamaño de la tabla, dentro del código fuente, para que coincida con la capacidad de respuesta de tu correo electrónico.

Uso de CSS en línea

Los servicios de correo electrónico basados en navegador, como Gmail o Hotmail, eliminarán tus etiquetas DOCTYPE, BODY y HEAD, así que deberás usar CSS en línea.

Imagen añadida por el usuario
Imagen añadida por el usuario

Evitar las abreviaturas de CSS

Este es un ejemplo de una abreviatura de CSS: <p style=”font: italic 14px Verdana; color: #000”></p>.

Este es un ejemplo de una CSS correcta: <p style=”font-style: italic; font-size: 14px; font-family: Verdana; color: #000000”></p>.

Evitar los ID o las clases CSS internas o externas

Todo lo que empieza con <style> tendrá resultados diferentes en los distintos clientes de correo electrónico. En cambio, utiliza CSS en línea.

Evitar javascript u otros scripts dinámicos

A pesar de que un filtro de SPAM te permite enviar tu correo electrónico, la mayoría de los clientes de correo electrónico no permitirán el funcionamiento de estos scripts.

Evitar Flash o incrustaciones de videos

La capacidad de ver archivos multimedia en los correos electrónicos suele estar desactivada de forma predeterminada en la mayoría de los clientes de correo electrónico. En su lugar, incluye una imagen de tu reproductor de video (con un botón de «reproducir») que enlace al archivo multimedia en una página de sitio web.

Utilizar viñetas de estilo de texto sin formato

Además de imágenes, otro elemento que suele aparecen en las representaciones de correos electrónicos en HTML son las viñetas de estilo de HTML. Para evitar que el destinatario reciba viñetas invisibles o desparejas, usa una alternativa de texto sin formato, como asteriscos (*) o guiones (—), que suelen representarse sin ningún inconveniente.

Evitar las imágenes de fondo

Outlook no reconocerá las imágenes de fondo. En su lugar, usa un color de fondo y puedes utilizar imágenes de otras maneras en tu correo electrónico.

Utilizar las rutas de imágenes absolutas

Si cargas una imagen a un correo electrónico individual a través de la biblioteca de imágenes de HubSpot, esta acción ocurre automáticamente. Si quieres incluir una imagen en una plantilla de correo electrónico, aloja la imagen en tu sitio web. Puedes cargar la imagen a tu administrador de archivos de HubSpot. Luego, haz que las rutas de tu imagen se dirijan a la dirección URL completa, como: http://www.yoursite.com/yourimage.jpg.

Ejemplo de HTML de imagen correcto: <img src="http://www.yoursite.com/images/yourimage.jpg">

Ejemplo de HTML de imagen incorrecto: <img src="/images/yourimage.jpg">

Notificar la altura y el ancho de la imagen

Esto garantiza que el diseño de tu correo electrónico mantendrá su estructura cuando las imágenes sean desactivadas por los clientes de correo electrónico.

Optimizar el tamaño de la imagen

Haz que el tamaño del archivo de tu imagen sea tan pequeño como sea posible, sin perder su integridad visual. Esto evitará extensos tiempos de carga de los correos electrónicos.

Evitar el uso de imágenes PNG

Lotus Notes no admite formatos de imagen PNG. En cambio, utiliza un formato como JPG o GIF.

Evitar el uso de mapas de imágenes

Hotmail no reconoce los mapas de imágenes.

Encontrar un equilibrio entre el texto y las imágenes

Si utilizas una imagen muy grande como todo tu correo electrónico, o demasiadas imágenes en general, es probable que tu correo electrónico termine en la carpeta de mensajes SPAM de los destinatarios.

Evitar el uso de texto invisible

Este es un truco común que utilizan los que envían SPAM, por lo que representa una bandera roja instantánea para los filtros de SPAM.

Usar texto de vista previa

Incluye una breve descripción en la parte superior de cada correo electrónico. Este texto aparecerá al lado del asunto en la bandeja de entrada de algunos clientes de correo electrónico y se puede generar en la sección de Texto de vista previa de tu correo electrónico de HubSpot.

Imagen añadida por el usuario
Imagen añadida por el usuario

Tener siempre una versión de texto sin formato del correo electrónico

Algunos navegadores, clientes de correo electrónico y dispositivos móviles no pueden representar HTML. A pesar de que muchos clientes de correo electrónico te permiten que el correo en HTML sea la configuración predeterminada, algunos también permiten a los usuarios ver únicamente mensajes de correo electrónico de texto sin formato. Si no se soluciona este tipo de problemas para los suscriptores de estos correos electrónicos, los profesionales del marketing corren el riesgo de perder una parte de su base de suscriptores. Además, un correo electrónico HTML sin un equivalente del correo en texto sin formato es una bandera roja para los filtros de SPAM. HubSpot facilita la obtención del texto de la versión HTML de tu correo electrónico en una versión de texto sin formato.

Imagen añadida por el usuario
Imagen añadida por el usuario

Mantener la copia igual a tu versión HTML

No tener una versión de texto sin formato de tu correo electrónico HTML es una señal para los filtros de SPAM de que tu correo electrónico podría ser no deseado. Sin embargo, lo mismo sucede con los correos electrónicos de texto sin formato con una copia que es muy diferente a su versión HTML. Evita utilizar tu copia de texto sin formato para redireccionar a los destinatarios a la versión web de tu correo electrónico o para visitar una determinada página en tu sitio web.

Usar mayúsculas en los encabezados

Debido a que los elementos de formato, como texto en negrita, cursiva, encabezados, etc., que podrías usar para destacar texto importante en tus correos electrónicos HTML no se mostrarán en las versiones de texto sin formato, considera el uso de técnicas como emplear solo mayúsculas para determinados textos, como los encabezados, para resaltar las partes importantes de tu correo electrónico o para separar una sección de otra.

Utilizar viñetas

Otra forma de separar bloques de texto o resaltar los puntos importantes es a través del uso de viñetas. Igual que con los correos electrónicos HTML, esto se puede lograr con asteriscos (*) o guiones (—).

Utilizar las mejores prácticas de los correos electrónicos de gran eficacia

Usar llamadas a la acción (CTA) claras

De la misma manera que incluyes CTA en tu sitio web que enlazan a tus páginas de destino, deberías hacer lo mismo en tus correos electrónicos. Haz que tu CTA principal se destaque y deja bien en claro cuál es el beneficio de hacer clic en esa CTA. Una vez que los destinatarios de correo electrónico se reconvierten en tu sitio, sabrás que son prospectos más calificados.

Enlace a las preferencias de suscripción

Además del enlace de cancelación de suscripción, incluye un enlace para actualizar las preferencias del suscriptor. De esta manera, los destinatarios pueden darse de baja solo de un tipo de correo electrónico, en lugar de cancelar la suscripción de todos. HubSpot ofrece preferencias de suscripción.

Imagen añadida por el usuario
Imagen añadida por el usuario

Utilizar rutas absolutas en lugar de adjuntos

Si hay algo que te gustaría enviar a tus destinatarios, como un archivo PDF o un documento de Word, no lo adjuntes al correo electrónico. Para minimizar la posibilidad de que el correo electrónico sea bloqueado por los filtros de SPAM y reducir el tiempo de carga de tu correo electrónico, carga el adjunto a tu sitio web y crea un enlace a la ubicación del archivo en tu correo electrónico a través de una CTA eficaz. La herramienta de adjuntos de HubSpot en el editor de correo electrónico realiza esta acción automáticamente; simplemente resalta una parte del texto o una imagen y haz clic en el ícono del adjunto. HubSpot convertirá ese texto o esa imagen en un enlace que redireccionará a ese adjunto.

Imagen añadida por el usuario
Imagen añadida por el usuario

Incluir una sección «Sígueme»

Agrega botones o enlaces de seguimiento para Facebook, Twitter, LinkedIn o cualquier otro canal de redes sociales en el que desees participar activamente. Para más información acerca de cómo agregar un módulo «Sígueme» en una plantilla de estilo «arrastrar y soltar», consulta este artículo.

Permitir a los destinatarios compartir en sus propias redes

La herramienta Correo electrónico de HubSpot te permite agregar opciones de «compartir» en redes sociales en cada uno de tus correos electrónicos. Aprovecha esta función para ayudar a que tu contenido se viralice.

Imagen añadida por el usuario
Imagen añadida por el usuario

Permitir que los destinatarios vean el correo electrónico en un navegador web

Siempre ofrece esta opción. Incluso después de haber realizado todos los pasos para garantizar el diseño adecuado del correo electrónico, un cliente de correo electrónico igual puede tener problemas al mostrar el mensaje. Incluye un enlace en todos los correos electrónicos para ver el correo como una página web. HubSpot hace que esta tarea sea fácil para ti.

Imagen añadida por el usuario
Imagen añadida por el usuario

El enlace de la versión de página web debería verse de la siguiente manera:

Imagen añadida por el usuario

Probar varios clientes de correo electrónico

Utiliza nuestra función Vista previa en otras bandejas de entrada para enviar un correo electrónico de prueba y observar cómo se ve el diseño de tu correo en cada cliente de correo electrónico.

Optimizador de correo electrónico
Nuestra herramienta Optimizador de correo electrónico proporciona información adicional para garantizar que los aspectos importantes del mensaje de correo electrónico sean revisados y resueltos (de ser necesario) antes de que se envíe el mensaje real.