xuxaxx

Hola a todos, en este primer post comparto algo de información en relacion a la buena confección de Newsletters en html, diferencias con el html para sitios y algunos consejos para sortear las distintas particularidades de los clientes de correo electrónico. Hay mucha info sobre el tema, igual, considero que estos puntos tratan y resuelven las dudas mas importantes, tanto para diseñadores, programadores o clientes. Cualquier aclaración o actualización de esta info sera bienvenida en los comentarios. saludos y muchas gracias por leer. --------------------------------------------------------------------------------------------------------------------------------------------------------------------- Diseño de Newsletters Buenas prácticas y recomendaciones Los clientes de correo electrónico tales como Outlook, Hotmail o Yahoo, aceptan newsletters armados y estructurados en lenguaje HTML. Si bien el HTML es el lenguaje usado para diseñar sitios, los newsletters no siguen exactamente las mismas reglas que una página web. Hay varias cuestiones particulares que un diseñador debe tener en cuenta a la hora de diseñar un boletín en HTML, para que este no sea interpretado como SPAM, y para que se visualice de manera correcta en todos los programas (y webmails) que puedan usar los destinatarios para chequear su emails. A continuación les enumeramos algunas buenas prácticas relacionadas con el diseño correcto de los newsletters y consejos de nuestros diseñadores basados en su experiencia con el diseño y el armado de boletines electrónicos. Estas recomendaciones tienen como objetivo maximizar los resultados y retorno de inversión (ROI), es decir, que más gente pueda leer el email correctamente, obteniendo más clicks, más visitas, y por ende mayores resultados. USABILIDAD / VISUALIZACIÓN / ROI El newsletter debe ser lo más navegable y simple posible, estructurando el contenido de manera sencilla y eficaz, a modo de minimizar el esfuerzo que tiene que hacer el suscripto para encontrar un determinado link o leer cierta información. Estructura simple y armónica: Al lector no debe costarle distinguir títulos, contenidos, banners, etc. El HTML debe ser estructurado lo más simple posible, con la menor cantidad de tablas, formatos, estilos, y etiquetas HTML en general. Ancho: El ancho del diseño del newsletter no debería superar los 780 píxeles ya que de lo contrario, gran cantidad de suscriptos tendrán que hacer scroll horizontal en clientes como Hotmail para ver el contenido completo. Si queremos evitar el scroll horizontal en la mayoría de los monitores de los destinatarios (según su resolución de pantalla), lo ideal es no superar los 650px de ancho. Bloqueo de Imágenes: Tener en cuenta que la mayoría de los programas y webmails bloquean las imágenes de manera predeterminada, por lo que el diseñador debería estructurar el texto de tal forma que el contenido principal (por ejemplo una oferta, o información importante) esté en modo texto y no en modo imagen, así aunque no active las imágenes, lo mismo visualizará la información. Generalmente los destinatarios hacen un “barrido” visual por todo el news, y si ve algo importante o que le interese, recién ahí activa las imágenes. Nombre de Imágenes: Las rutas de las imágenes deben ser absolutas, es decir con la url completa del servidor en donde están subidas, por ejemplo “http://www.miempresa.com/images/top.jpg” y no “images/top.jpg”. Es importante que el nombre de las imágenes solo contenga caracteres estándar, no usar acentos, espacios, “ñ”, ni caracteres extraños. Usar minúsculas para nombrar las imágenes. Links absolutos: Recordar también que los vínculos deben contener la ruta absoluta al archivo vinculado, por ejemplo: <a href="http://www.ejemplo.com/pagina-de-ejemplo.htm"> Peso de Imágenes: Es importante que las imágenes estén optimizadas en su peso para que tarden el menor tiempo posible en cargar. Colocar GIF cuando sea posible, o JPG en calidad 85% o la menor que se pueda sin perder nitidez en la imagen. Imágenes de Fondo: Outlook 2007 no muestra imágenes de fondo de tablas o de celdas. Si se quiere diseñar el HTML para que sea visto exactamente de la misma manera en todos los clientes de correo electrónico, no se aconseja usar imágenes de fondo. Navegabilidad: Tratar de colocar links visibles a la página web o blog. Una buena forma de incentivar la navegabilidad a nuestro sitio web es colocar un menú horizontal con links o botones apuntando a las distintas secciones de nuestra página. Para mejorar la navegabilidad dentro del mismo newsletter, se pueden utilizar links con anchores en un índice que vayan a la respectiva ubicación dentro del contenido. Flash, Javascript y Video: Descartar la idea de incluir flash, Javascript, controles ActiveX o video dentro de un newsletter HTML. La mayoría de los clientes de correo con las configuraciones de seguridad predeterminadas no los visualizan. Para mostrar una animación o video, lo mejor es usar un link a páginas externas en las que coloquemos o estén estos contenidos. Para los videos en particular, incentiva mucho al click colocar una captura del video con el botón play al medio, linkeado a una página donde está el video propiamente dicho. Tablas: Estructurar el contenido y diseño con Tablas HTML, todas con posicionamiento normal de flujo y no usar DIVs con posicionamiento absoluto. De esa manera nos aseguraremos la correcta visualización de los elementos en los diferentes programas y webmails. Gif Animados: Es recomendado no usar gif animados, ya que clientes de correo nuevos como Outlook 2007 no muestran las animaciones de los gif, solo muestran el primer frame. Formularios: Outlook 2007 y algunos webmails tampoco permiten formularios embebidos en el HTML del email. Lo mejor es colocar un link o botón “Click aquí para Votar”, o bien colocar el formulario y poner un texto debajo bien visible del tipo “Si no puede votar o no funciona el formulario, haga click aquí”, link que llevaría a una página web con el mismo formulario. Color de fondo para el newsletter: Muchos clientes de correo no muestra el color de fondo si está establecido desde la etiqueta <body>, por lo que es recomendable colocar una tabla 100% con el color de fondo deseado, y dentro de esa tabla colocar el newsletter en sí. Estilos Css: No es recomendable utilizar estilos en hojas css externas, o en la etiqueta <head>, ya que muchos programas para chequear el email y webmails directamente eliminan la etiqueta <head>. Los estilos deberían ser establecidos en cada etiqueta de manera INLINE, en el atributo “style”. GestorB cuenta con una funcionalidad que transforma automáticamente clases de estilo css en el head, en estilos inline dentro de las etiquetas que llaman a las clases. Codificación: Es recomendable que el <head> incluya la etiqueta <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />, lo que le indica al programa que decodifique los caracteres basándose en el estándar latino iso-8859-1. Tipografías: Solo usar tipografías estándar de web como Verdana o Arial. No usar tipografías que pueden no estar instaladas en la PC del suscriptor. Remitente: Utilizar una dirección de e-mail y un remitente (“De:” o “From:”) que sea reconocible por el suscriptor. Preferentemente que contenga el nombre de la empresa que lo envía. Frecuencia: Mantener una frecuencia fija, conocida de antemano por los suscriptores. Si enviamos diariamente un boletín que se suponía semanal, probablemente los suscriptores terminen rechazándolo y marcándolo como no deseado. Es muy importante priorizar la relevancia del contenido sobre la frecuencia, por ejemplo enviamos información importante y relevante 1 vez por mes, en lugar de enviar contenido no tan importante 1 vez por semana. ANTI-SPAM Debido al crecimiento exponencial del Spam, los grandes proveedores de email han tenido que implementar estrictas reglas anti-Spam, que a veces influyen notablemente en la entrega a bandeja de entrada, incluso si usted tiene una lista que ha aceptado explícitamente recibir correos de su empresa. Siguiendo estas recomendaciones pueden ayudar a que su empresa no sea confundida con los spammers, y que su newsletters sean dirigidos a bandeja de entrada. Mayúsculas y Signos: Evitar el uso excesivo de mayúsculas y signos de admiración u otro tipo de signos no convencionales en el contenido, remitente, y en el asunto. No usar palabras con varios signos de admiración al final (por ej. hola!!!!!). Dólares: Evitar el uso de signo dólares (U$S) o pesos ($), en su lugar colocar la palabra “dólares” o “pesos”. Color rojo: No utilizar en lo posible el color rojo en textos o fondos de celdas. Equilibrio texto-imagen: Diseñar el contenido con un equilibrio entre el texto HTML e imágenes. No se recomienda enviar emails donde el contenido es solamente una imagen. Esto puede ayudar a que sea filtrado a bandeja no deseados. Peso del newsletter: Se recomienda que el newsletter no supere los 40kb de peso, ya que de lo contrario aumentará la tasa de rebotes por casilla llena, y puede influir en el delivery a bandeja de entrada. En el caso que sean noticias o posts, lo mejor es colocar un abstract o resumen y un link a una página en la web con la versión extendida de esa noticia. Información de Remitente: Una buena práctica básica es incluir la información de la empresa que envía el newsletter, generalmente debajo de todo al final del contenido. Incluya nombre completo de la empresa, dirección física real, teléfonos y mail de contacto. Esta información es obligatoria en algunos países. Desuscripción (Opt-out): Brindar siempre la posibilidad de baja. GestorB incluye un link de desuscripción de manera automática. Este link debe estar bien visible. Si un suscriptor no encuentra rápidamente la forma de darse de baja de un newsletter, optará por marcarlo como Spam, lo que influye directamente en la reputación del remitente, corriendo peligro de que los próximos correos sean dirigidos a bandeja no deseados. Listas limpias: Mantener la lista de suscriptores limpia, actualizada y libre de cualquier dirección de e-mail de personas que no hayan solicitado o no deseen recibir más nuestro newsletter. Tampoco se debe volver a enviar a emails que claramente hayan rebotado y que no existan más. GestorB posee funcionalidades de optimización y limpieza automática de listas, desuscribiendo a los contactos que así lo requieran, dando de baja a los contactos que marquen como Spam el mail, y desactivando automáticamente a los rebotados Hard. CONCLUSIÓN Estas buenas prácticas y consejos son útiles en el contexto actual del email marketing, y pueden ser muy beneficiosos para obtener mayores resultados y retornos de inversión, pero a medida que se desarrollan nuevos soportes y programas para interactuar con los emails, algunas de estas prácticas o “reglas” van cambiando y adaptándose a las nuevas tecnologías. Trataremos de ir manteniéndolos al tanto sobre estos cambios, y actualizando este documento, siempre con el objetivo de ayudarle a que pueda llegar a más personas, de una mejor manera, lo que se verá traducido en un incremento notable de los resultados de cada campaña enviada. --------------------------------------------------------------------------------------------------------------------------------------------------------------------- fuente: http://www.gestorb.com/