ESdesign
ESdesign- Escuela Superior de Diseño de Barcelona
09 de Octubre de 2018

La experiencia de usuario en móvil y dónde colocar cada parte de la web

Diseño web para mejorar la experiencia de usuario en móvil

Una de las claves del diseño web, y de esto hemos hablado en más de una ocasión, es conseguir que una página web responda con la misma rapidez, eficacia y usabilidad en todo tipo de dispositivos móviles. E incluso en las relativamente recientes Smart T.Vs. Para ello, uno de los elementos a tener en cuenta, si no el principal, es como la navegación cambia de uno a otro dispositivo. Y de la navegación es de lo que depende la experiencia de usuario en móvil.

Muchas empresas obligan a sus diseñadores a no tomar en cuenta el rendimiento de sus páginas web en dispositivos móviles. Esto supone un claro error de concepto. Sobre todo si consideramos que las ventas de PC y portátiles tienden a la baja mientras que las de los dispositivos móviles tienden al alza. Hay tres problemas a los que las páginas web no optimizadas se enfrentan cuando los usuarios acceden a ellas desde dispositivos móviles:

  1. Carga muy lenta del contenido
  2. Descargas
  3. Formato que obliga a emplear el zoom para ver los detalles de contenido

Estos tres motivos animan a los usuarios a abandonar las páginas web.

Puede que, como diseñador, te veas en la necesidad de explicar a tus clientes por qué necesitan poner mucha atención a la experiencia de usuario en móvil. Para ello, te conviene entender qué es el diseño adaptativo y qué es el diseño responsive.

La experiencia de usuario en móvil y dónde colocar cada parte de la web

Diferencias entre diseño responsive y diseño web adaptativo

El diseño web responsive es el que más adeptos viene ganando. Y es que, si lo empleas cuando trabajes en el diseño de una página web, este tipo de diseño reestructurará en la pantalla de cada dispositivo los diferentes elementos de la página web. Lo que hace es redimensionarlos y colocarlos en el mejor orden posible para optimizar el espacio disponible de la pantalla y mejorar así la experiencia de usuario en móvil.

La herramienta mediante la que se consigue que esto suceda es aparentemente sencilla. Te explicamos cómo funciona en nuestro máster de diseño web. Baste decir en este artículo que se trata de establecer las medidas de diseño en porcentajes y no en valores fijos medidos en pixeles. También se usan las llamadas media queries y hojas de estilo. Mediante las mismas se establecen las CSS que corresponden a cada tamaño particular de pantalla.

El diseño web adaptativo es menos flexible y por ello está perdiendo adeptos. Necesitan menos código, pero emplean tamaños de pantalla pre establecidos. Así que, cuando el tamaño del dispositivo no se adecua a ellos, la página web no se comporta de la manera adecuada.

Para aprender mucho más acerca del diseño web responsive y del diseño de páginas web en general, acércate a nuestro máster dedicado.