Email Marketing – Paso 1

Diseño Web / Marketing 7 marzo 2017

Email Marketing Principal

Este artículo es el primero de una serie que voy a ir sacando poco a poco. Empezando por lo más básico para poder ir avanzando y conociendo más en detalle en qué cosiste el Email Marketing.

Por ello, si te surge cualquier duda, o quieres saber algo más específico, no lo dudes y pregunta. Estaré encantado de poder solucionarla. Y si no sé la respuesta, buscarla entre ambos para poder seguir aprendiendo. Que para eso está este blog.

El email marketing es una estrategia utilizada por todas las empresas del mundo para poder enviar información de manera fácil y sencilla al cliente. Para que este pueda estar informado en cualquier momento de los servicios que estamos prestando.

Con la llegada de las nuevas tecnologías como los smartphones el mundo del email marketing se ha tenido que adaptar para poder mostrar todos sus servicios. Ya que ahora la información se tiene que adaptar a cualquier formato o sistema con el que nos encontramos. Y así dejamos de utilizar en exclusiva las visualizaciones en sistemas nativos de email.

Tipos de Receptores de Email

Para situarnos hay que diferenciar entre dos formas de recibir los emails. Ya que dependiendo de una de estas formas podremos ver unas cosas u otras.

Sistemas Nativos

Son los sistemas que hemos tenido siempre presentes, como el Mail en Mac, o el más famoso de todos, Outlook en Windows.

Estos sistemas son los que están por defecto en cualquier ordenador. Y ellos son los que tienen más limitaciones a la hora de mostrar la información, ya que hay diferentes aspectos que no se llegan a mostrar en ellos.

Estos sistemas, cuando se les envía el HTML con la información tienen unos preprocesadotes previos que hacen una serie de funciones, como son el modificar el HTML para hacerlo más asequible para ellos. Esto hace que la estructura del documento cambie por completo.

Sistemas Basados en Web

Estos sistemas basados en web se basan como su propio nombre indica en la web. Se trata de las plataformas como Gmail, Yahoo, Outlook(hotmail) o Aol Mail. Estas plataformas tienen soporte en cualquier navegador, y puedes acceder a ver tu correo desde este navegador.

Esta fórmula de visualización de los emails, lo que hace es que se puedan mostrar una mayor gama de opciones que en sistemas nativos. Ya que se elimina el proprocesador y el renderizado del HTML se muestra directamente en el navegador.

Formatos de Emails

Hoy en día los emails tienen que poder adaptarse a cualquier dispositivo al igual que hay cualquier página web. Esto es muy importante ya que cada vez más los emails se visualizan desde teléfonos móviles.

Hay que tener en cuenta, que hasta la fecha, el estándar en cuanto a las medidas de los emails es de 600px de ancho. Esto es debido a los sistemas nativos, para que se pueda ver correctamente el email. Por ello, hay que tener en cuenta que el ancho máximo de los emails va a ser de 600px.

El tamaño del ancho estándar en email es de 600px.

El cambio que se está produciendo en el uso en los emails ha provocado que estos tengan que tener incorporado en ellos los Media Queries. Que son los estilos que indican cómo tiene que actuar unas clases cuándo cumplen unos requisitos. Un ejemplo podría ser:

@media screen and (max-width: 600px){
      .ancho-total {
      width: 100% important;
      }
}

En este ejemplo, le indicamos que cuándo el tamaño de la pantalla sea un máximo de 600px el elemento que tenga la clase ancho-total tiene que tener un ancho del 100%, para que ocupe todo el ancho de la pantalla.

A través de los Media Queries, vamos a poder hacer versiones de emails más pequeñas para los teléfonos móviles, en las que se tendrá en cuenta el ancho de la pantalla. Y conseguirán una visualización mucho más fácil para el usuario.

Cómo Maquetar un Email

Tablas

Los emails hay que maquetarlos en tablas. Esto puede parecer ahora algo raro, ya que todo en web se hace en divs, pero hay que tomarlo como una vuelta al pasado.

A la hora de maquetar en tablas hay que tener en cuenta que todas las tablas las deberíamos “resetear a cero”. Esto quiere decir que lo recomendable en todas las tablas sería hacer esto:

      <table border=”0” cellpadding=”0” y cellspacing=”0” …. >

Lo que estamos haciendo con esto es que el borde la tabla sea 0px. Y el padding que hay entre las celdas y el espacio entre las celdas también sea 0px. De esta forma no se nos sumará nada de forma automática a nuestra tabla o caja.

También hay que tener en cuenta que la mayoría de los estilos que vamos a incluir en nuestro email serían inline. Algún ejemplo:

      <table border=”0” cellpadding=”0” y cellspacing=”0” style=”text-align:center; font-size: 30px” >

En este ejemplo lo que hemos hecho es alinear el contenido que va a estar dentro de esa tabla al centro, y el tamaño de la fuente le hemos puesto a 30px.

Elementos en las Tablas

Dentro de estas tablas se pueden llegar a incluir cualquier elemento, como imágenes, párrafos o listas. Estos elementos que se están añadiendo, funcionarían exactamente igual que en cualquier web normal. Y se escribirían de la misma forma.

Algunos de estos elementos podrían ser:

Imágenes
Se puede incluir cualquier imagen con el elemento img, y dentro puede incluir estilos inline. En los estilos inline se está indicando que la imagen actúe como un bloque, y que su anchura máxima sea el 100% de la caja que lo contiene.

       <img src= ”imagen.jpg” style=”display:block; max-width:100%;”>

Párrafos
Para esto no hace falta explicar mucho. Serían los textos que se encuentran dentro de las tablas. Debajo un ejemplo, con el tamaño de letra a 14px y alineado a la izquierda.

      <p style=”font-size:14px; text-align:left;”>Esto es un párrafo</p>

Listas
se pueden incluir listas dentro de los emails, como ul (listas sin numerar) y ol (listas numeradas). Se utilizan para hacer enumeraciones. Un ejemplo puede ser:

      <ul>

            <li>Elemento uno</li>

            <li>Elemento dos</li>

      </ul>

Elementos que NO se pueden Utilizar en Emails

Al trabajar en emails, hay que tener en cuenta alguna serie de elementos que no se pueden utilizar, que no se pueden enviar, ya que no se va a poder visualizar en todos los dispositivos.

En este punto nos encontramos en continua evolución, y lo que hoy en día no se puede hacer, muy posiblemente, en breve se podrá hacer. Este sector cambia mucho y hay que estar preparado para ello.

Algunos de los elementos que no se pueden utilizar son:

JavaScript
Los emails no aceptan la utilización de archivos de javaScript o su código dentro de los emails.

Iframes
Es la inclusión de una página dentro de otra a través de una llamada. Es la inclusión de una web. El ejemplo que siempre pongo es la inclusión de los vídeos de youtube dentro de una web, que suelen estar hechos d esta forma. Esto es algo que no está permitido utilizar en emails.

Float
A la hora de trabajar en CSS, se utiliza el flotar elementos a la izquierda o derecha. Pues en emails no lo podemos utilizar tan fácilmente, por loque su uso no está recomendado.

Datos del artículo
Email Marketing - Paso 1
Título
Email Marketing - Paso 1
Descripción Breve
Artículo sobre email marketing en el que se habla de Tipos de receptores de email, formatos y buenos usos.
Autor
Publicado en:
aexpositogonzalez.com
Logotipo:

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *