Nombre de la Categoría: > Otros

Diseño de HTML

Al iniciar una campaña de Email Marketing es fundamental que nuestro mensaje esté diseñado para poder visualizarse en su totalidad, rápidamente y sin riesgo de que sea clasificado como Spam. No cumplir con esta premisa hará cuesta arriba el éxito de nuestra campaña de correos y disminuirá su reputación con los clientes o prospectos con los que desea conectar. Para lograrlo de una manera sencilla y segura le presentamos los siguientes consejos, con los que optimizará el uso de nuestra herramienta y garantizará el éxito de sus campañas con DANAConnect.

 25_1

El HTML es el lenguaje de modelado que interpretan los clientes de correo en la actualidad, así que no es posible el uso de otros lenguajes como el Javascript, Flash o PHP por ejemplo.

25_2

Este código HTML no es exactamente el mismo utilizado para diseñar páginas webs. Ésto sucede porque, para el Email, tenemos algunas restricciones respecto a los tags y atributos, etc, que podemos utilizar al momento de diseñar nuestra comunicación.

Debido a que cada manejador de correo tiene sus propias restricciones, debemos tomar en cuenta algunos tips si queremos que nuestra comunicación llegue de forma efectiva a su destino. Algunas recomendaciones para el buen armado de una maqueta en HTML son:

  • Es recomendable cortar las imágenes del banner y footer de manera horizontal

25_3

  • Evitar el uso de la etiqueta <head>, y la etiqueta de información del documento, ya que la mayoría de los clientes de correo no aceptan la misma.

25_4

  • Es recomendable el uso de tablas <table> para armar la maqueta del Email, estas son aceptadas por todos los clientes de correo.

25_5

  • No es recomendable el uso de los DIVS, pues cada cliente de Email lo interpreta de manera diferente.

25_6

  • Las imágenes de fondo tienen poca compatibilidad con los clientes de correo, por lo que resulta ideal hacer uso de los colores en las celdas o tablas con el atributo BGCOLOR.

25_7

  • Copiar el código HTML desde la etiqueta  <table> hasta </table> y quitar todo el contenido informativo que contienen los documento HTML.

25_5

  • Gmail y Yahoo expanden las tablas dejando ver espacios en blanco entre cada celda. Es necesario tomar en cuenta ésto al momento de cortar las imágenes compensando con un fondo del mismo color.

25_8

  • Las imágenes del diseño deben ser subidas a los servidores.

25_9

  • El nombre de las imágenes debe mantenerse simple y sin espacios en blanco (omitir el uso de la ñ y los acentos)

25_10

  • Debes cargar las imágenes en el tamaño correcto. Muchos manejadores de correos no toman en cuenta la redimensión de las mismas.

Respecto a los estilos a utilizarse, deben estar embebidos. No es recomendable el uso de clases debido a que en algunos clientes de correos éstas no funcionan. Un ejemplo:

<p style="font-family: Verdana, Geneva, sans-serif; color: #333; font-size:12px">Texto de prueba </p>

Es altamente recomendable el uso de fuentes Standard, con ello garantizará que el mensaje se visualice de la manera correcta. En la herramienta de diseño de Email del Centro de Conversaciones de DANAConnect encontrarás todas las fuentes recomendadas. Las más usadas para el envío de Emails son, entre otras:

  • Arial
  • Comic Sans
  • Courier new
  • Georgia
  • Lucida Sans Unicode
  • Tahoma
  • Times New Roman
  • Trebuchet MS
  • Verdana

Haciéndolo compatible

En la actualidad no solo debemos hacer el email compatible con los diferentes clientes de correo electrónico, también debemos tomar en cuenta que cada vez es mayor la tasa de apertura a través de Smartphones y Tablets.

Además es necesario tomar en consideración que los navegadores web permiten mostrar contenido interactivo y dinámicos, que no es soportado por la mayoría de los manejadores de correo electrónico.

Así que, para garantizar que nuestra comunicación sea vista por el cliente o prospecto, es necesario tomar en cuenta las siguientes recomendaciones:

  • La medida ideal para el diseño del email va de 600px a 800px de ancho. Tomando en cuenta las campañas dedicadas a dispositivos móviles, las medidas oscilarán entre 320px a 480px aproximadamente.
  • Debido a que muchas personas no tienen la descarga de imágenes por defecto, agregar un texto alternativo con el atributo ALT es altamente recomendable. Así, aunque el cliente no vea las imágenes del mail, se mantiene la posibilidad de hacer llegar parte del mensaje.
  • Pruebe enviando el email en los principales manejadores de correo (Outlook, Gmail, Yahoo), antes de enviar la campaña .

Adicionalmente, no debe dejar de lado ciertos detalles en otros campos del Email que diseña, como por ejemplo:

  • La dirección desde la cual envía su campaña. Ésto influye en la tasa de apertura del Email, por lo que resulta ideal mantener coherencia entre el contenido y el remitente de la misma.
  • El uso de Mayúsculas mantenidas en el Asunto o contenido del correo electrónico genera un alto puntaje de SPAM. Es recomendable no usarlas de esa manera.

Tomando en cuenta estos consejos en conjunto con un excelente contenido, su organización garantizará que en cada campaña que ejecute a través de DANAConnect obtenga los mejores resultados.


Style Element Outlook 2007/10/13 + Outlook 03/Express/Mail iPhone iOS 7/iPad Outlook.com Apple Mail 6.5 Yahoo! Mail Google Gmail Android 4 (Gmail) +

Text & Fonts
font-family 1403563345_Check
font-style
font-variant
font-size
font-weight
letter-spacing
line-height
text-align
text-decoration
white-space 1403563336_Delete
word-spacing

Color & Background
color
background
background-color
background-image
background-position
background-repeat

Box Model
border
border-color
height
margin
padding
width

Positioning & Display
bottom
float
left
position
right
top

Tables
border-collapse
border-spacing
caption-side
empty-cells

Others
JavaScript
iframe
Flash
audio incrustado
video incrustado
forms

 

Es necesario realizar pruebas previas a la activación de la comunicación, ya que el elemento es aceptado sólo para algunas versiones del manejador de correo.


Ver Tambien:
« | »