Image Post

Mobile First Design. Pensemos de pantalla Smartphone a PC y no al revés

Hace ya tiempo que estamos en la era digital… cualquier ser humano que se precie en la actualidad posee un implante, esa extensión sin la cual no podemos vivir, no existimos.

Gracias a esa extensión de nuestro cuerpo, nos podemos comunicar, socializar, nos guía cuando estamos perdidos y hace memoria con tan solo apretar un botón….sin ese implante no somos nadie… efectivamente, estamos hablando del móvil.
Con esta verdad absoluta, como profesionales de la web que somos, si queremos llegar a ser alguien en ese universo de posibilidades empresariales que es internet, no podemos hacer otra cosa que tener en primerísima posición el móvil.

No nos vale que nuestro site, en el que hemos, estamos y vamos a invertir muchísimo tiempo y dinero, se visualice perfectamente a través de la pantalla de un portátil, ni mucho menos que se vea en ordenadores de sobremesa (esa reliquias desde la primera década del siglo XXI ya casi nadie las usa), ahora hay que programar con la táctica “Mobile First Design”.

Todo debe ser “responsive”, apoyarnos en el  diseño adaptativo, con estructuras e imágenes fluidas, valiéndonos de HTML5, Jquery  y las ya perpetuas hojas de estilo CSS,  que consigue adaptar el sitio web al entorno del usuario.
Nuestro primer error es, por deformación profesional, pensar en un 1024×768 (resolución media de una pantalla de portátil, aunque ya estaríamos hablando de 1280… pero en fin), y a partir de ahí intentar meter con calzador los contenidos en los diferentes dispositivos por pequeños que sean…. error.

Hay que diseñar la web primero para que sea perfectamente funcional, usable y atractiva en un Smartphone de 4 o 5 pulgadas y a partir de ahí ampliar el espacio y reubicar los elementos funcionales y de diseño para poderse ver en ámbitos más grandes como tablets (en segundo e importante lugar), portátiles y monitores.

Estrategia de diseño Mobile First  frente a Mobile Last, deformación profesional.

Estrategia de diseño Mobile First frente a Mobile Last, deformación profesional.

Los beneficios de este diseño web adaptativo son brutales:

- Con una sola versión en HTML y CSS se cubren todas las resoluciones de pantalla, PCs, tabletas, teléfonos móviles y esto hace que el impacto en el usuario sea mucho mayor y de mejor calidad.

- Se reducen los costes brutalmente, nada de realizar mantenimientos especializados o versiones diferentes.

- La usabilidad es infinitamente mayor, si desde cualquier teléfono puedo USAR tu web, tendré muchísimas más posibilidades de ser usuario y tú muchas más posibilidades de que convierta.

- En cuanto a la optimización de motores de búsqueda, también se ve notoriamente  mejorada con tan sólo una URL en los resultados de búsqueda, sin redirecciones que a veces fallan etc.