Correos electrónicos HTML en Tractis
Posted: 24 Feb 2008 07:56 PM CST
¿Habéis visto los nuevos correos HTML que enviamos desde Tractis? ¡Ah! es la nueva cereza de la aplicación. La acabamos de subir hace unos 4 días y la verdad, estoy contento. Si tu gestor de correos soporta HTML entonces podrás ver los correos de esta forma, de lo contrario, podrás leer el mismo en modo texto.
El diseño
En materia diseño, montar un modelo electrónico de HTML no es fácil, para nada. Si diagramar una web es compleja, por su cantidad de variantes y puntos, imaginen hacer esto para un programa de correo electrónico.
Al diseñar la idea de poner correos HTML, tuve en cuenta estos puntos:
- Simplicidad
- Menor cantidad de imágenes posibles
- Personalización
- Información
Bien, muchos de nosotros seguro habrá visto ya más de un e-mail en formato HTML. Personalmente, no me gustan. Primero porque el 99% de los correos en HTML nunca encajan bien en los lectores, además, porque la gente cada día empieza a leer correos desde múltiples dispositivos que ni siquiera respetan bien HTML, así que, es una tarea ardua de prueba y error (y no se imaginan) para que sea algo universal. El diseño intenté que tenga la simplicidad que necesitan para que no sea una publicidad print, o sea, el diseño que caracteriza Tractis: simplicidad, colores vivos, contrastes, buenas proporciones.
- Simplicidad: La idea es que los correos sean simples, tanto en diseño como en construcción. Esto permite flexibilidad para extenderlos o realizar otras operaciones.
- Menor cantidad de imágenes posibles: dado que los lectores de correo siempre bloquean imágenes, hay que permitir ver el correo sin imágenes.
- Personalización: a futuro, gracias al código se pueden imprimir el logotipo del cliente y los colores de su tema.
- Información: estructura hecha especialmente para transmitir niveles de información según los deseos. La primera parte permite hacer todo, la segunda sólo sirve para aquellos que quieren más o para leer información relacionada al hecho.
La estructura
El mail tiene unas zonas específicas y este modelo se puede extender dependiendo el uso. Por ejemplo, cuando se trata de poner facturas hay mini módulos de listados, etc. En esta imagen de pruebas nombro las zonas específicas de los correos html de Tractis:
Tenemos:
- Un logotipo. Un poco inferior en tamaño que el original del sitio. Personalmente, el logo de tractis es demasiado grande para la ventana de lectura de un correo. Los grandes utilizan esta medida base.
- Línea de identidad. Es un detalle de diseño, para que no quede "flotando" el diseño. Son marcas de diseño de identidad que le dan más fuerza al asunto. La nuestra tiene el color verde de Tractis.
- Asunto. Frase que muestra el asunto del correo.
- Resumen. Sirve para meter el mensaje principal del correo. La extensión es libre aunque las mejores pruebas fueron aquellas con poco texto. Menos de 4 líneas se hace. Escribirlo siempre entre 6 y 10 líneas.
- Caja de acción principal. Acompañando al resumen, esta la caja de acciones principal. Sirve para que el usuario no tenga que buscar o leer entre los enlaces normales que aparezcan o bien para mostrar una información muy clave como por ejemplo, en el ejemplo de la foto, cuánto es la cantidad de crédito que dispones luego de la recarga.
- Caja de información secundaria. Son párrafos para recordarle al usuario las otras opciones que dispone de la acción principal.
- Modulo de detalles. Modulo que extiende y amplía en detalle la información. En algunas ocasiones no hará falta ponerlo. Permite el volcado de cualquier contenido en la zona, sean párrafos o listados de tablas.
- Lista personalizada. Una tabla donde se puede personalizar la información en forma tabular. Sirve mayoritariamente para casos de pagos, precios, o bien para listar versiones o listados de ítems concretos.
- Módulo de información adicional. Ampliación de información sobre el tema, como pueden ser vencimientos, penalidades o acciones relacionadas con el tema. También incluye la información de contacto.
- Pie del correo. Pie de página con información de contacto.
Con esta estructura de datos, prácticamente cubrimos todas las necesidades actuales de Tractis. Digo prácticamente porque no sabemos las futuras. Igualmente, la flexibilidad que ha demostrado estuvo más que bien y ha dado pocos dolores de cabeza.
Lo que odiamos de este medio
Lamentamos que el código no sea lo más limpio, resumido o estandarizado como lo es en nuestra aplicación web. El problema radica en que los lectores de correos hacen y deshacen a su antojo, impidiendo que los correos HTML vayan con un código estándar, utilizando hojas de estilos separadas. Entonces, el código tiene que ir en forma de sopa de letras: todo incluido en el cuerpo del documento. A mi forma de ver, hay demasiado código de más, incluso, ¡hasta me parece una ironía que lo haya programado yo! Pero hemos limitado el abuso al máximo, así no nos dañamos los ojos.
En un futuro, cuando los grandes fabricantes se den cuenta de este problema, haremos la traducción de los correos electrónicos utilizando técnicas estándares menos arcaicas.
Saludos
Rodrigo González Fernández
DIPLOMADO EN RESPONSABILIDAD SOCIAL EMPRESARIAL DE LA ONU
www.Consultajuridicachile.blogspot.com
www.lobbyingchile.blogspot.com
www.el-observatorio-politico.blogspot.com
www.biocombustibles.blogspot.com
No hay comentarios:
Publicar un comentario