Los 6 Modelos de navegación adaptativa para móviles [II]

Los dispositivos móviles crecen exponencialmente en su uso y hay que plantearse soluciones para hacer más sencilla la vida del usuario. Repasamos ahora otros tres modelos para mejorar nuestro sitio web, menos frecuentes, pero que también conviene tener en consideración.

En el artículo anterior ya hemos repasado estos tres modelos de navegación adaptativa:

  • Navegación por interruptor o toggle
  • Navegación al estilo app móvil
  • Transformar el menú en un select

Y ahora nos toca cumplir lo prometido de hablar de los tres restantes que os propníamos. Vamos con ellos.

Navegación superior sin apenas cambios

Si no nos convencen las primeras opciones, o bien queremos optar por otra solución, podemos dejar los links en la parte superior, uno al lado de otro, como si fueran enlaces normales y corrientes. Esto solo lo podremos hacer en sites donde la navegación no sea muy complicada y el diseño nos permita hacerlo.

También ayuda que ese menú se reduzca de tamaño y así lo tendremos más compacto y no ocupará tanto espacio en la pantalla, así como mantenerlo en una posición fija en la parte superior y que sea siempre visible.

menu_responsive_01

http://coworkchicago.com/

La principal desventaja de este método es que ocupa mucho espacio comparado con el tamaño del dispositivo y hace que el scroll crezca bastante. Otra variante, en vez de poner los links uno al lado del otro, es apilarlos uno debajo del otro.

Ancla al footer

Otros profesionales han optado por poner un elemento en la parte superior y que actúe de ancla hacia el footer donde se encuentra el menú completo. Es una recurso que te permite ahorrar espacio en la parte superior y que el contenido tenga más presencia, pero no lo acabo de ver del todo usable que se tenga que hacer un scroll por toda la página para navegar por el sitio web. El principal atributo es que se puede implementar de una manera rápida y sencilla. Podemos ver un ejemplo de menú con ancla en el footer en Contents Magazine.

Una variante de esta opción es poner directamente el menú en el footer, olvidándonos del ancla en la parte superior, algo que no veo del todo correcto ya que, si el usuario quiere cambiar de página, ha de hacer todo el scroll para conseguirlo. Un ejemplo claro sería la página de Pears.

Esconder parte del menú

La última técnica, y la que menos recomiendo, es la de ocultar contenido. Desde mi punto de vista, creo que no se debe penalizar al usuario por el dispositivo que está usando y hacerle la vida más complicada, independientemente de si accede desde el móvil, una tableta u ordenador de sobremesa. Por ejemplo, en esta imágenes de Authentic Jobs observamos cómo el menú superior, que se supone el principal, tiene poco que ver con la versión móvil.

menu_responsive_02
http://www.authenticjobs.com/

Con la imagen y el enlace podemos ver el ejemplo de ocultar contenido en vivo.

Otra variación de esconder contenido del menú sería la de no facilitar a los usuarios el contenido que se encuentra en un submenú, como hacen en Happy Cog Cognition. No obstante, tiene algo de justificación porque podrías acceder desde el contenido de la página pero la información se presenta con otros criterios de colocación.

menu_responsive_03
http://cognition.happycog.com/topics/

Los dispositivos móviles van creciendo exponencialmente en su uso y cada vez tenemos que plantearnos este tipo de soluciones para hacer más sencilla la vida al usuario y, en definitiva, a nosotros.

¿Cuál es vuestro recurso de menú adaptativo favorito? ¿Hay alguno que descartaríais desde un principio?

Recursos

Artículos recién salidos del horno

Suscríbete a nuestro blog y recibe en tu email nuestras noticias.

Al inscribirte a nuestra newsletter, aceptas la política de privacidad