Cada tienda ya tiene un menú superior.
La pregunta es
qué va en la parte inferior.
La navegación inferior se ha convertido en el estándar móvil. Tus clientes la esperan. Pero el éxito no se trata de agregarla en todas partes — se trata de decidir qué pertenece allí, y colocarlo donde realmente funciona. Esta guía te ayuda a tomar esa decisión correctamente.
Las zonas seguras varían según los dispositivos
Las muescas de iOS, las barras de gestos de Android y el modo panorámico reclaman espacio en la pantalla. Un menú en la parte inferior debe coexistir con estas realidades del hardware, no luchar contra ellas.
La navegación inferior compite con tu contenido
Colocar una barra en la parte inferior reserva espacio que podría mostrar imágenes de productos o el botón de añadir al carrito. La colocación incorrecta hace que el desplazamiento sea más difícil u oculta acciones clave.
Solo funciona con un número específico de elementos
Una barra de navegación de 5 elementos es utilizable. 7 elementos se vuelven estrechos. Más de 8 es inutilizable. Debes decidir qué realmente va allí — no todo cabe.
Coexiste con otra navegación
La mayoría de las tiendas mantienen un encabezado superior y un menú de cajón. La navegación inferior no los reemplaza — se superpone. Hacer que estos tres funcionen juntos requiere planificación.
La navegación móvil efectiva coloca tus destinos más importantes en las 3–5 ranuras en la parte inferior, respeta las zonas seguras de dispositivos y funciona junto a tu menú superior y cajón — sin solapamiento.
Inicio, Tienda, Búsqueda, Carrito, Cuenta — el conjunto estándar
La mayoría de las tiendas móviles se conforman con estos cinco. Inicio te lleva rápidamente. Tienda es tu catálogo. Búsqueda ayuda a los visitantes a encontrar elementos específicos. Carrito y Cuenta son transaccionales. Cualquier cosa más allá de estos cinco generalmente significa que algo no pertenece.
Respeta áreas seguras en teléfonos modernos
Los indicadores de inicio de iOS y las zonas de gestos de Android requieren relleno. La barra se mueve hacia arriba ligeramente para permanecer utilizable y accesible, no oculta detrás de gestos o controles del SO.
Funciona en modo vertical y horizontal
El modo horizontal tiene menos espacio vertical. Una barra inferior bien diseñada se encoge gracefully o apila elementos sin romper el diseño o volverse ilegible.
Se superpone a tu encabezado y cajón
El encabezado superior permanece para la marca y la búsqueda rápida. El cajón contiene categorías profundas. La barra inferior los conecta — acceso rápido a las páginas más utilizadas sin abrir un menú.
Se salta ciertos tipos de tienda
No todas las tiendas se benefician de la navegación inferior. Tiendas de un solo producto, marcas de lujo con catálogos mínimos y tiendas orientadas a escritorio pueden no necesitarla. Conoce tus patrones de tráfico primero.
Audita el tráfico y objetivos de tu tienda
Verifica el análisis. ¿Qué páginas visitan más los usuarios móviles? ¿Qué acciones importan más para tu negocio? Coloca cinco destinos en tu barra inferior — no más.
Diseña para las zonas seguras que apuntas
Decide qué teléfonos usan más tus clientes. Planifica relleno para muescas y barras de gestos. Prueba el modo panorámico. Unos minutos de planificación ahorran fricción móvil más tarde.
Configura tu navegación inferior con Navi+
Elige tus destinos, iconos y colores. Navi+ maneja las zonas seguras, puntos de interrupción y detección de dispositivos automáticamente. Publica en minutos.
Insercios de área segura inclusos
Se ajusta automáticamente para muescas de iOS, Isla Dinámica y navegación de gestos de Android. Sin conjeturas, funciona en cada tipo de dispositivo.
Se adapta al modo horizontal
La barra inferior se encoge y refluye cuando los usuarios rotan sus teléfonos. El diseño permanece utilizable, nunca estrecho u oculto.
Se superpone correctamente con otra interfaz de usuario
Funciona junto a encabezados fijos, menús de cajón y popovers sin conflictos o solapamientos de índice z.
Gestión de ranuras
Las ranuras visuales claras te ayudan a colocar exactamente lo que importa. Las ranuras no utilizadas permanecen vacías — sin elementos de relleno forzado.
Lista para múltiples mercados
Se adapta a diferentes idiomas y patrones de navegación regional automáticamente. Tu barra permanece legible en cualquier mercado.
Sin impacto en el rendimiento
CSS e HTML ligeros. Sin gastos generales de JavaScript, sin exceso de biblioteca. Tu tienda se carga tan rápido como antes.
Cuando las páginas de nivel superior viven en una barra visible en la parte inferior de cada pantalla, más visitantes las utilizan. Las categorías se navegan. Las cuentas se comprueban. Las listas de deseos se utilizan. Los patrones que los clientes ya conocen de Instagram y Amazon funcionan igual de bien en tu tienda.
Tab Bar
Añade una barra de navegación fija en la parte inferior de tu tienda Shopify. Como una app nativa — más int...
Mobile Menu
Reemplaza el cajón de hamburguesa de tu tema con un menú multinivel. Búsqueda integrada, acceso a cuenta y ...
Floating Button
Agrega un botón de contacto fijo a tu tienda Shopify. Siempre visible — WhatsApp, teléfono, correo electrón...
Gratuito para instalar. Activo en menos de 5 minutos. Sin cambios de tema necesarios.