Cómo diseñar emails para teléfonos móviles

Publicado el 10 de abril de 2014

responsive design

De acuerdo a un estudio realizado por la gente de Litmus el año pasado (2013), más del 44% de los emails son abiertos desde dispositivos móviles. A su vez, otro estudio realizado por Kissmetrics dice que el 89% de los que abren sus emails en teléfonos móviles los eliminan si no pueden verlos correctamente. Es algo para pensar, no?

Bien, de la misma forma que un email no se ve igual en Gmail que en Outlook, el mismo email se verá bien diferente en una PC que en un teléfono móvil. Es por eso que existe algo llamado: responsive y scalable design. La idea de este tip no es entrar en muchos detalles de diseño, solo queremos que sepan que existen estas opciones para que se lo soliciten a sus diseñadores, a los nuestros o empiecen a experimentar por su cuenta.

Un diseño escalable (scalable design) es cuando simplificamos al máximo el layout de nuestro email, dejamos un solo texto bien diferenciado y grande, y un solo call to action también diferenciado y grande. Normalmente se diseña todo en una sola columna y no tiene un ancho superior a los 500px. De esta forma se puede leer correctamente en casi todas las pantallas.

Por otro lado, un diseño responsive se aplica cuando modificamos el código del email para que adapte el tamaño de los textos y los objetos de acuerdo a la resolución de la pantalla en la que se abre. Esto quiere decir que el contenido puede verse en una sola columna si la pantalla es muy pequeña, o ir adaptando su forma medida que la pantalla crece.

A primera vista el diseño responsive parece ser el mejor (o por lo menos el que se ve mejor), pero la contrapartida de esto es que requiere también bastante trabajo en el código de tu email. Por lo que difícilmente lo pueda aplicar alguien sin conocimientos.

Los factores más importantes para definir el camino a seguir son:

1) Analiza los reportes de "User Agent" para ver si tienes muchas interacciones desde dispositivos móviles. Tal vez tu lista de contactos no requiera un diseño escalable, o tal vez lo necesites con urgencia!

user agent


2) Tu sitio web es "mobile friendly"? De nada sirve tener un diseño super optimizado si el sito al que llevas el tráfico es inusable en un celular.

3) Posees el tiempo y los recursos? Esto muchas veces marcará el camino que puedas seguir. Un diseño responsive puede ser hermoso, pero requiere conocimiento y tiempo. Un diseño escalable puede no ser tan efectivo, pero es más sencillo de lograr.

Que te parece? Tus contactos te lo agradecerían?

*

Te gustó el post? Compártelo!

Si quieres continuar hablando sobre estos temas, estamos presentes en las redes sociales. Entra y dinos qué piensas!

Facebook, Twitter, Linked In, Google+