Diseño y desarrollo de páginas web económicas, administrables y optimizadas (Barcelona)

David Oliveras diseño y desarrollo web

Optimización del email para móvil: Responsive Newsletter

Una de las palabras que se puso de moda el pasado 2012 fue “responsive”, que en términos de diseño web significa “adaptable”.

En una sociedad cada día más adicta al móvil, los profesionales de Internet hemos tenido que ajustarnos a una nueva realidad: Adaptar la web al dispositivo del usuario. Y es que en la actualidad circulan más de 1.500 millones de smartphones (Androids, Iphones, Windows Phone…) y en consecuencia alrededor del 45% de los emails se visualizan ya desde un dispositivo móvil (y con una clara tendencia a la alza). Y aún más, únicamente el 2% de los emails abiertos se vuelven a visualizar por segunda vez desde otro dispositivo.

resposnive newsletter

Optimización del email para móvil: Responsive Newsletter

Así pues, si ahora construimos webs adaptables para mejorar la experiencia del usuario, por qué no hacerlo también con las campañas de email marketing de nuestra empresa?

Uno de los grandes problemas técnicos a la hora de desarrollar un email “responsive” es la incompatibilidad en el uso de las @media queries en buena parte de los lectores de correo electrónico, ya sean versiones de escritorio tipo Outlook o Apps como Gmail por ejemplo. Las @media queries son la técnica utilizada para asignar diferentes estilos CSS en función de la resolución de pantalla del usuario, es decir, el medio que nos permite cambiar el diseño sin cambiar el contenido y adaptarlo al dispositivo donde se está visualizando.

Dilema: ¿Cómo crear un email adaptable a móvil compatible para todos?

La manera preferible de aproximarnos a un proyecto como éste es pensar en “fluido” y no en “fijo”. Me explico. Hasta hace 4 días los emails se maquetaban utilizando tablas de anchos fijos (550px, 600px …) para asegurar una correcta visualización de este. Ahora para preparar un email adaptable a todos los dispositivos trabajaremos con un diseño fluido de tamaños porcentuales pero asignando obviamente unas medidas “límite”. De forma práctica, si tenemos una cuadrícula de 600 píxeles con una imagen que toma su total, le asignaremos que ocupe el 100% del espacio pero que nunca sobrepase los 600 píxeles (img width=”100%” style=”max-width: 600px “). Como podemos ver, crearemos un email “responsive” sin el uso de @media queries para asegurar una máxima compatibilidad.

Ya existen estudios de distintas consultoras que aseguran que un email con diseño adaptable obtiene aproximadamente un 33% más de clics que uno que no lo está. Por tanto, si sois de aquellos que todavía piensan que los usuarios de móvil no quieren interactuar de la misma manera que los demás, estáis en un error. Nosotros en Privalia, tienda de moda online nº1 en España, ya hemos cambiado el chip… ¿A qué esperáis vosotros?

Y es que la web cambia, pero el mail también!

¿Te ha gustado este artículo? ¡Compártelo!