Después de leer los artículos sobre cada tipo de menú, mucha gente sigue atascada en el último paso: entonces, ¿qué debería usar realmente mi tienda? Esa sensación es normal. La teoría sobre Tab Bars, Mega Menus o Slide Menus solo se vuelve útil cuando la aplicas a tus propias cifras.
Este artículo plantea un proceso de selección de menú de 5 pasos que puedes recorrer en aproximadamente una tarde. No existe una única fórmula que sirva para todas las tiendas, pero sí hay una forma de trabajar que te ayuda a decidir según datos reales en lugar de intuición. Llegué a este enfoque después de gestionar unas cuantas tiendas pequeñas y de equivocarme en mis suposiciones un par de veces.
Paso 1: Mira tu propia proporción de móvil vs escritorio
No confíes en la frase de que “todo el mundo dice que el móvil es mayoría”. Abre tus propias cifras y míralas.
Entra en Google Analytics (categoría Tech / Device) o en Shopify Analytics (Online store sessions by device type). Toma los últimos 30 a 90 días para tener una muestra lo bastante grande. Verás el porcentaje de sesiones que llegan desde teléfonos frente a las que llegan desde ordenadores.
Este número decide para qué pantalla diseñas primero. Si el 80% de los visitantes llega desde un teléfono, la experiencia móvil es el escenario principal y el escritorio es secundario. Si vendes B2B y la mayoría de tus clientes usan el ordenador en la oficina, la historia se invierte.
Mira también la tasa de conversión separada por dispositivo, no solo el tráfico. Según el Baymard Institute, el abandono de carrito en móvil ronda el 80%, más alto que en escritorio (alrededor del 66%). Si tu tienda tiene muchos visitantes móviles pero la conversión móvil es baja, una navegación difícil de usar puede ser parte del motivo.
Paso 2: Cuenta tus categorías de nivel 1 y de nivel 2
Abre la sección de Navegación en Shopify y cuenta de verdad.
- Categorías de nivel 1: los grupos más grandes. En una tienda de moda, por ejemplo: “Mujer”, “Hombre”, “Accesorios”, “Rebajas”.
- Categorías de nivel 2: las subramas dentro de cada categoría de nivel 1. “Mujer” podría incluir “Tops”, “Pantalones”, “Vestidos”, “Calzado”.
Este número reduce tus opciones. Una tienda con solo 3 o 4 categorías de nivel 1 y casi ninguna de nivel 2 no necesita un Mega Menu: el Mega Menu existe para contener estructuras de varios niveles. En cambio, una tienda con 8 categorías de nivel 1, cada una con 5 o 6 subramas, haría que los clientes se cansaran de tanto desplazarse si todo se mete dentro de un único Slide Menu.
Una regla aproximada que suelo usar: cuanto más plana y pequeña sea tu estructura, más conviene un menú siempre visible (como un Tab Bar en la parte inferior). Cuanto más profunda y ramificada sea tu estructura, más necesitas un menú que agrupe y se despliegue (un Mega Menu en escritorio, un Slide Menu en móvil).
Paso 3: Identifica las 3 a 5 páginas que los clientes necesitan alcanzar más
Este es el paso que más se omite, y sin embargo importa.
Vuelve a Google Analytics o a Shopify Analytics y abre el informe de páginas más vistas (Top pages / Landing pages). Anota los 3 a 5 destinos que los clientes realmente necesitan. Suelen ser: la página de inicio, unas pocas colecciones clave, la página de búsqueda, el carrito y, a veces, una página de seguimiento de pedidos o de contacto.
¿Por qué solo 3 a 5? Porque ese es el número razonable de “atajos” que puedes colocar en los lugares más fáciles de tocar. Un Tab Bar en la parte inferior de una pantalla móvil normalmente solo admite 4 o 5 elementos antes de quedar apretado. Si identificas correctamente los 4 destinos más importantes, sabes exactamente qué poner en el Tab Bar.
Sé honesto en este paso. Lo que quieres que los clientes vean (por ejemplo, tu página de historia de marca) no es necesariamente lo que necesitan para comprar. Sigue los datos de comportamiento, no los deseos.
Paso 4: Elige tu configuración de menú según cuatro factores
Ahora combina los tres pasos anteriores con los cuatro factores que comentamos en artículos previos: el dispositivo dominante, la profundidad de categorías, el número de destinos importantes y las particularidades de tu categoría de producto. Coteja todo con las tablas comparativas de esos artículos. A continuación, algunas combinaciones habituales.
| Tu situación | Configuración sugerida |
|---|---|
| Mayoría de visitantes móviles, estructura plana, 4 destinos claros | Tab Bar en la parte inferior + Slide Menu para el resto |
| Muchas categorías, muchas subramas, tráfico de escritorio significativo | Mega Menu en escritorio + Slide Menu en móvil |
| Necesitas una acción destacada (chat, reserva, llamada) | FAB para esa acción, combinado con el menú principal |
| Catálogo con muchas imágenes y poco texto (cosmética, alimentación) | Visual Grid Menu |
Una nota sobre cómo la gente sostiene el teléfono. Según la investigación de Steven Hoober, cerca de la mitad de los usuarios sostienen el teléfono con una mano y hacen la mayor parte del trabajo con el pulgar. La zona de alcance fácil del pulgar está en la mitad inferior de la pantalla. Por eso un Tab Bar en la parte inferior suele ser más fácil de tocar que una hamburguesa en la esquina superior: la esquina superior cae en la zona del “no llego del todo”.
Este es también el momento de pensar en la navegación oculta. Nielsen Norman Group midió y descubrió que los menús siempre visibles se descubren y se usan unas 1,5 veces más que los menús escondidos detrás de un icono de hamburguesa. Eso no significa que la hamburguesa esté mal —sigue siendo útil para contener elementos secundarios—, significa: no escondas tus destinos más importantes detrás de ella.
Paso 5: Instala Navi+, construye un prototipo y míralo en un dispositivo real
A estas alturas ya tienes una hipótesis. Lo que queda es construirla y verla con tus propios ojos.
Navi+ te permite construir Tab Bars, Mega Menus, Slide Menus, FABs y Grid Menus sin código —solo arrastrar y soltar— y configurar móvil y escritorio por separado. Montas exactamente la configuración que elegiste en el Paso 4, un estilo por dispositivo, y luego activas el modo de vista previa. Como el menú se crea de forma independiente del tema, se mantiene intacto aunque cambies de tema más adelante.
El punto que quiero subrayar: míralo en un teléfono real, no solo en un emulador.
El emulador del navegador te da el tamaño de pantalla correcto, pero no puede reproducir cómo un dedo real toca un botón: si el botón es demasiado pequeño, o si el Tab Bar queda tapado por el teclado o por la barra de navegación del teléfono. Algunos problemas solo salen a la luz cuando coges el teléfono e intentas comprar algo como lo haría un cliente real.
Mientras haces la vista previa, vigila también la velocidad. Google fija el umbral de “bueno” para los Core Web Vitals en un LCP por debajo de 2,5 segundos, un INP por debajo de 200 milisegundos y un CLS por debajo de 0,1. Un menú pesado puede hacer que la página dé tirones o desplace el diseño. Navi+ está optimizado para limitar su impacto en estas métricas, pero aun así deberías verificarlo en tu propia tienda.
Por último, no tengas miedo de ajustar. La configuración que elegiste en el Paso 4 es un punto de partida, no un veredicto. Añadir o quitar una herramienta de navegación no es nada del otro mundo. Construye un prototipo, mira las cifras al cabo de unas semanas y luego ajusta. Así es como este proceso realmente da sus frutos.
En resumen, un buen proceso de selección de menú no empieza por el tipo de menú que más te gusta, sino por las cifras: tu proporción de móvil vs escritorio, la profundidad de categorías y los destinos que los clientes realmente necesitan. Los cuatro factores más un prototipo en un dispositivo real te darán una respuesta más cercana a tu tienda que cualquier consejo genérico.
Este artículo forma parte de la guía más amplia sobre Cómo elegir el tipo de menú adecuado para tu tienda Shopify.