Una de las cosas que trae de cabeza a los diseñadores web es cómo adaptar el menú a la pantalla de un móvil o una Tablet. Imagínate comprimir un menú con 5 o 6 elementos al tamaño de una pantalla con cinco pulgadas y conseguir que siga siendo entendible y útil para el usuario. ¿Qué opciones existen? Repasamos los tipos de menú móvil que existen y sus principales características.

Tipos de menú móvil

Menú Hamburguesa

El menú hamburguesa le debe el nombre a su apariencia:

menú hamburguesa

No hay más misterio, esas tres líneas horizontales gruesas semejan un par de panes con la carne en medio. Al tocar con el dedo, se despliegan las opciones del menú. De ese modo se evita que el menú este siempre presente quitando espacio de visualización.

Lo bueno de este tipo de menú es que ocupa muy poco. Lo malo es que hay gente que puede tener problemas como menú (Aunque es poco frecuente ahora que se ha popularizado su uso).

Es posible que también oigas hablar del menú Sandwich. El concepto es el mismo que el de las hamburguesas, pero las tres líneas no son del mismo tamaño.

Menú Select

Este tipo de menú funciona como el seleccionable de un formulario donde hay un elemento principal siempre visible, que normalmente lleva el nombre Menú. Al hacer clic sobre el se despliegan las opciones de navegación.

Al incluir la palabra menú ya ocupa más espacio que el menú hamburguesa pero resulta más reconocible ya que no hay problemas para reconocerlo como menú.

Tanto el menú Hamburguesa como el menú Select pueden ponerse en la cabecera y o en el footer. Yo suelo recomendar la cabecera, porque es más visible. Eso sí, lo pongas donde lo pongas asegúrate de que sea fijo.

Menú lateral

El menú lateral es una opción que también se usa, aunque a mí personalmente no me gusta mucho. El botón de menú está a la izquierda, y al hacer clic sobre él se despliegan las opciones desplazando lateralmente el resto de la pantalla.

Menú Orbital

El menú orbital es algo que viene pegando fuerte ahora que se nos viene encima el Mobile First Indexing. Sus defensores dicen que será un requisito indispensable en la navegación del futuro.

Este tipo de menú tiene forma de esfera y se despliega al tocarlo. Se sitúa siempre cerca de la esquina inferior derecha. ¿Por qué? Porque se supone que es la zona más accesible al pulgar.

 

Y tú, ¿qué tipo de menú móvil usas en tu web?

Te deSEO un buen día,

William Penguin.