|
Obviamente,
un buen diseño en HTML conlleva una mejor
imagen de marca, mayor usabilidad y mensajes más
atractivos que la alternativa de los mensajes
de texto. Pero cuando el HTML no está concebido
especialmente para email puede ser ilegible para
muchas plataformas de correo, no funcionar correctamente
o ser bloqueado por los filtros anti-spam.
En
este artículo vamos a proponer una serie
de buenas prácticas en el diseño
de HTML para emailings en tres áreas: formato,
funcionalidad y usabilidad. Los problemas más
habituales afectan a la visualización (cómo
los destinatarios ven los mensajes en sus clientes
de correo) y a calidad de la entrega (que probabilidad
tienen los emails de ser bloqueados o filtrados
como spam).
Recomendaciones referentes al formato:
1.-
No usar Frontpage, ya que añade código
extra que causa errores con ciertos clientes de
correo. Mejor Dreamweaver y que luego un programador
repase el código para eliminar código
innecesario.
2.
Evitar las tablas anidadas. Algunos clientes de
correo como Lotus Notes y Netscape en particular,
pueden visualizarlas incorrectamente.
3.
No usar imágenes como fondo (background),
ya que no se visualizan correctamente en la mayoría
de clientes de correo. Para celdas individuales
se pueden utilizar imágenes como background
pero en particular Lotus Notes no las visualizará.
4.
No incrustar las imagenes en el email. Es preferible
alojarlas en un website, ya que algunos filtros
de ISPs bloquean los emails con imágenes
incrustadas.
5.
Evitar las imagenes gif de 1x1 pixel como espaciadores,
ya que muchos spammers las utilizan y puede marcar
tu email como spam.
6.
Evitar el uso de CSS (Hojas de Estilo en Cascada).
Los CSS en el diseño de un website pueden
simplificar el proceso de diseño, pero
usados en un emailing pueden causar una visualización
incorrecta en algunos clientes de correo. Si estás
obligado a utilizar CSS hazlo como "inline",
es decir, incrustando el Estilo entre los dos
body tags y no en el header.
7.-
Mantén la anchura de los emails de 500
a 650 pixels. Anchuras mayores fuerzan al destinatario
a hacer scroll horizontal. Además, emails
que son demasiado anchos son especialmente problemáticos
cuando los destinatarios sólo nos otorgan
algunos segundos de atención en el preview
pane.
8.-
Mantener el peso del email por debajo de 100 KB.
Aunque la mayoría de los clients de correo
soportan ficheros pesados, los destinatarios que
aún se conectan a través de modem
y teléfono pueden no tener la paciencia
de dejar entrar un fichero grande. Además,
por encima de 100 KB pueden entrar en acción
los filtros del ISP.
Recomendaciones referentes a usabilidad:
El
uso del "preview pane" y el bloque por
defecto de la descarga de imagenes y de los hipervínculos
externos son dos de los mayores retos para el
diseño de emailings en HTML.
9.-
Validar el código HTML. Código HTML
inválido o roto puede causar problemas
tanto de visualización como de calidad
de entrega. Existen en el mercado algunas utilidades
que permiten validar la integridad del código.
10.-
Evitar scripts si es posible. Las vulnerabilidades
del Script provocan problemas de seguridad, por
lo que los emails con scripts pueden ser bloqueados
o que el script sea inhibido. En lugar de incluir
los scripts en el email es preferible mover a
los destinatarios hacia nuestro website donde
el uso de componentes dinámicos es más
seguro.
11.-
Añadir el "si no ves bien haz clic
aquí" al principio del mensaje. Esto
beneficia a aquellos destinatarios cuyo cliente
de correo no puede visualizar nuestro emailing
correctamente. De la misma manera también
es conveniente crear una versión texto
del email en HTML y enviarla como multipart, para
que aquellos destinatarios que tengan configurado
su cliente de correo para visualizar texto no
tengan problemas.
12.-
Usar alt tags para las imágenes. Estas
etiquetas muestran una o dos palabras que describen
una imagen o una acción cuando la imagen
no se visualiza por retraso en la descarga o bloqueo
de la misma.
13.-
Procurar que el mensaje principal del emailing
sea texto HTML y no una imagen.
Recomendaciones
referentes a funcionalidad:
Esta
sección cubre las ventajas cruciales que
el HTML aporta al email, tales como búsqueda,
navegación e hipervinculación hacia
nuestro website.
14.- Proporcionar numerosos hipervínculos
hacia contenido en nuestro website. Varios estudios
demuestran que añadiendo hipervínculos
-hacia contenidos especiales u ofertas, información
complementaria, etc. - se incrementa sensiblemente
el clic-through y la conversión.
15.-
La navegación por nuestro emailing debería
reflejar la navegación por nuestro site.
Evitar el uso de terminología distinta.
16.-
Canales de compra o funciones clave de nuestro
website deberían estar hipervinculados
desde nuestros emailings, pero también
hay que diseñar la navegación de
nuestro email de forma que refleje las acciones
principales que queremos que los destinatarios
realicen a partir de él.
17.-
Añadir con cuidado funcionales adicionales
como 'enviar
a un amigo' o encuestas, formularios de búsqueda
etc. Muchos clientes de correo no tratan correctamente
los formularios y no permiten el envío
de datos desde un email a nuestro website. Es
recomendable añadir estas funcionalidades
en nuestro website y no incluírlas en nuestro
email.
18.-
Añadir una sección específica
para la gestión del contacto. Hay que facilitar
el que los destinatarios puedan cambiar su dirección
de correo, actualizar sus datos, borrarse o contactarno
a partir del email.
19.-
No incrustar en el email formatos rich media como
audio, vídeo o flash. Colocarlos en nuestro
servidor como "streaming media" y simplemente
hipervincularlos desde el email. Muchos destinatarios
no tienen el ordenador o el software necesario
para visualizar correctamente este contenido.
|
