Como crear emails para todos los dispositivos móviles

Si no has estado viviendo en un paraíso secreto debajo de la superficie de la tierra (?) seguro te has dado cuenta que los dispositivos móviles se venden más que los computadores de escritorio y hasta los portátiles, estamos viviendo en la era Post-PC, ya no tienes que estar en tu casa o tu trabajo para conectarte con el mundo, ahora lo puedes hacer desde cualquier lugar, literalmente, el baño, bajo el agua, a varios miles de metros en el cielo, donde quieras.

Del lado de las compañías, empresas y agencias de publicidad esta transformación ha traído consigo nuevos desafíos sobre la forma de como llegar a más personas que está conectadas desde dispositivos que no tienen una pantalla de 14 pulgadas, si no un pantalla de 4 a 7 pulgadas, en ese mismo tamaño deben mostrar en sus campañas por email toda la información que antes mostraban en un espacio 2 o 3 veces más grandes.

Pero no todo esta perdido, gracias al avance de las tecnologías web, ahora es perfectamente posible crear campañas de email que se ven exactamente igual en cualquier dispositivo sin importa el tamaño o resolución de su pantalla, esto se logra gracias a las Media Queries, Grillas e Imágenes Fluidas, las cuales permiten ofrecer una experiencia igual para cualquier tipo de usuario.

En la siguiente infografía se explica el porque crear emails responsive, como es posible hacerlo y como implementarlos, los dispositivos que soportan este tipo de emails, un punto importante a destacar es que la aplicación con la que se vea el email es quien determina la disponibilidad de las técnicas para entregar un mail responsive, más no el dispositivo.

how-to-responsive-email-design-infographic

Vía: Litmus

Snippets de los media queries más utilizados

Screenshot_16

Si estás creando un sitio o aplicación web con diseño Responsive y todavía no sabes que Media Queries utilizar para los dispositivos que estás soportando este sitio te vendrá perfecto.

Se llama Media Query Snippets y tal como lo dice el nombre, es un compilado de snippets o pequeños fragmentos de código con las media queries para detectar la mayoría de dispositivos que existen en el momento, desde los monitores normales de los portátiles o computadores de escritorio hasta los smartphones más conocidos, como el iPhone, HTC, Samsung Galaxy y el Blackberry Torch, por supuesto no pueden faltar las tablets, como las Acer Iconia, Google Nexus, iPads, Sony, Lenovo entre otras.

Un recurso que te queda perfecto si estás desarrollando tu web para alguno de estos dispositivos y todavía no sabías como detectarlos correctamente para adaptar tu diseño a ellos.

Media Query Snippets