Gmail: por fin responsive

Tiempo Estimado de Lectura: 3 min (¿Sin tiempo? Envíame este artículo por email)
13 octubre 2016

El pasado día 14 de Septiembre Google anunció lo que la mayoría de profesionales del email llevamos pidiendo hace años: el soporte CSS en Gmail o, lo que es lo mismo, la posibilidad de maquetar email responsive con media queries. Ha tardado pero el update es más que bien recibido por la comunidad de sufridos maquetadores.

Your emails, optimized for every screen with responsive design

Es el claim que ha usado Google para comunicar los últimos updates. Pero es lo que llevamos intentando hacer hace ya unos años 😉 De hecho Gmail y Outlook han sido el talón de Aquiles de la industria del email desde la irrupción del diseño responsive en la web. Con cuotas de mercado aproximadas del 15% para Gmail y del 12% para Outlook, más que el talón hablamos de las piernas de Aquiles.

El problema

Outlook sigue siendo un problema así que lo trataremos en otro momento. Respecto a Google, el problema siempre ha sido la eliminación sistemática de los estilos en la cabecera del email, bloqueando cualquier posibilidad de usar las media queries, la base del diseño por dispositivo. Con las media queries y las clases, se podía adaptar cualquier parte del email a cualquier dispositivo en función del tamaño de la pantalla, la resolución – que no es lo mismo – y si se mostraba en vertical – portrait – o en horizontal – landscape. Con los estilos en cabecera también se desvanecen otras posibilidades de ajustar fondos, tipografías, etc.

El resultado es que una web con landings totalmente multidispositivo se enfrentaba a campañas de email sin posibilidad de adaptarse correctamente.

La “solución”

Durante años se han ido publicando hacks y workarounds para poder adaptar, en la medida de lo posible, entre ellos algunos tremendamente complejos que van más allá del foco de este artículo. Además, y como suele pasar, al intentar arreglar algo para Gmail generábamos problemas de compatibilidad con Outlook y Yahoo. Se repite la pesadilla de los diferentes navegadores en el mundo de las páginas web pero en email.

Pero la necesidad de buscar soluciones hizo que surgieran alternativas que redefinieron el término responsive. Hablamos del diseño adaptive – o spongy – y a su vez del diseño híbrido. Básicamente, en el diseño responsive se usan media queries que renderizan correctamente en aquellos clientes que son compatibles – Apple Mail, Outlook , Yahoo – y no funcionan en Gmail tanto en desktop como mobile. Con el adaptive prescindimos totalmente de las media queries y de los estilos en cabecera, usando puramente estilos en código – bastante más restringidos – y medidas proporcionales, que “llenan” la pantalla “estirando” el contenido; de ahí que también se conozca como diseño líquido. El híbrido es la combinación de ambos, generando emails compatibles con la mayoría de clientes, pero mucho más costosos de mantener y con un diseño siempre restringido a medidas proporcionales.

Hoy: Gmail habilita el diseño de email responsive

Con el anuncio Google se simplifican infinidad de técnicas pero sobretodo podremos ver en email exactamente lo que el diseñador ha pensado para cada dispositivo. Entonces, ¿el diseño adaptive ha muerto? Pues no, el diseño adaptive es la única opción que funciona en algunos dispositivos y es siempre buena opción de fallback. Lo ideal es seguir diseñando con la proporcionalidad siempre presente y aprovechándose de la potencia de las media queries. También hay que tener en cuenta que Google ha hecho el despliegue de estos cambios de manera progresiva a sus diferentes clientes desktop y mobile así como a los dominios genéricos y de empresa. A destacar que, a día de hoy, el cliente Gmail de iOS aún no incluye los cambios.

Para información más detallada, sitios como Litmus o Email on Acid entran en profundidad en todos lo cambios que supone el último update de Google, ya que las media queries son una parte importante pero también ha habido cambios en el posicionamiento de fondos y en el uso de tipografías.

Avanzamos, poco a poco y al ritmo que marca Google, hacia un futuro realmente multidispositivo. A pesar de todo, son buenas noticias.

 

Categorías

News

Comparte este post

¿Tienes alguna pregunta?

Israel Garcia

Country Manager España en webpower 936 675 047
hola@webpower.es
LinkedIn

Quieres mejorar la conversión de tus comunicaciones?

Regístrate en YOUR Inspiration.
El email de inspiración mensual de Webpower.
Conoce nuestros interesantes trucos y consejos.

¿Ya leíste nuestro último White Paper?

De bewezen kracht van marketing automation in de B2B

Elke B2B-organisatie zal herkennen dat sales en marketing steeds meer in elkaar overlopen. Lijnen en verantwoordelijkheden vervagen met één gemeenschappelijk doel: meer (online) conversie.

Download deze whitepaper

Oops! We could not locate your form.