El diseño web adaptativo o responsive ¿Cómo se ve tu web en dispositivos móviles?

Diseño web adaptativoUn diseño web adaptativo (responsive en inglés), permite a un sitio web adaptarse a cualquier dispositivo móvil. Esto se consigue con un diseño adaptativo que responda a la la resolución del dispositivo a través del cual se está haciendo la visita al sitio web. Existen una serie de técnicas para ello, como pueden ser dimensionar los elementos de la página a través de porcentajes del tamaño de la pantalla o modificar la posición de elementos en la página en función de cotas mínimas y máximas en la dimensión de la pantalla. Existen otros factores a tener en cuenta como pueden ser el cuidar que los elementos interactivos sean del tamaño suficiente para usarlos con un dedo y considerar que algunas operaciones naturales con ratón (pasar el puntero por encima de un elemento de la página por ejemplo) no son posibles en pantallas táctiles.

Nada mejor que utilizar como ejemplo esta web. Si estás leyendo este artículo en un monitor, observa lo que ocurre cuando reduces el ancho de la ventana del navegador (un poco, un poco más, a la mitad, etc.). Pruébalo ahora para la página de inicio o cualquiera de las secciones, verás que las imágenes en algunos casos cambian de tamaño y/o posición, al igual que otros elementos y textos. De esta manera se presentarán los contenidos de un sitio web de forma adaptativa en la tableta o smartphone que se esté utilizando.

Para hacértelo más fácil hemos creado la siguiente herramienta que te permitirá probar si el diseño de tu web es adaptativo: ¿Cómo se ve tu sitio web en dispositivos móviles? en la que aproximamos como se ve la web de tu empresa o trabajo en diferentes soportes.

El 2012 fue un año atípico en el mercado de la informática de usuario en el que por primera vez desde 2001 las ventas de ordenadores personales disminuyeron. Esta tendencia se puede extrapolar al presente año y los siguientes, sustentándola fundamentalmente en la proliferación de dispositivos móviles en la forma de smartphones y tabletas, cada vez más baratas y potentes.

En este escenario el diseño web adaptativo juega un papel crucial. No responde a una cuestión de estética ni trucos técnicos sino a adaptarse a los cambios que el signo de los tiempos conlleva, sin que el usuario pierda información o vea perjudicada su interacción, en caso de no estar ante la pantalla del ordenador.

Las empresas e instituciones que no den pasos hacia esta nueva realidad se encontrarán con una presentación obsoleta de sus bienes, servicios e información. Sitios de referencia empiezan ya a cuantificar el porcentaje de tráfico que reciben desde dispositivos móviles, en algunos casos llegando éste a representar el 30% en la actualidad y con una proyección que rápidamente lo situará en el 50%. Asimismo, diferentes estudios indican que más usuarios prefieren por ejemplo leer las noticias desde los sitios web de los medios que a través de las apps de cada uno de ellos.

Para saber más:
www.slashgear.com/pc-sales-to-decline-in-2012-for-the-first-time-in-11-years-10251339/
mashable.com/2012/12/11/responsive-web-design/
en.wikipedia.org/wiki/Responsive_web_design
www.journalism.org/analysis_report/future_mobile_news

Artículos relacionados:

Deja un comentario