Cómo optimizar la navegación del sitio para conversiones (Guía)

¿Conoces esa sensación cuando entras en una tienda, no puedes encontrar lo que viniste a buscar, y el empleado en el piso no está misteriosamente en ninguna parte? No escarbas en todos los pasillos. Vete. Eso es exactamente lo que sucede en los sitios web con menús confusos, y es por eso que aprender a optimizar la navegación del sitio para las conversiones es uno de los movimientos de mayor apalancamiento en toda la optimización de conversiones. La versión corta: el trabajo de tu navegación es ayudar a cada visitante a encontrar lo que vino en cuestión de segundos. Lo haces diagnosticando cómo las personas realmente se mueven a través de tu sitio, cambiando el nombre de los elementos del menú en las palabras de tus visitantes en lugar de en tu jerga interna, manteniendo la estructura superficial y basada en la intención, haciendo que las páginas de dinero como los precios sean fáciles de encontrar y probando los cambios cuidadosamente porque la navegación toca cada página.

La navegación es el caballo de batalla silencioso de su sitio web. Nadie complementa un gran menú – la gente sólo encuentra lo que necesita y convierte. ¿Un menú confuso? Ese es el asesino silencioso. Los visitantes rara vez se quejan de ello; simplemente se van, y sus análisis se encogen de hombros y lo llaman un rebote. Así que vamos a arreglar eso, paso a paso, con un sistema que puede comenzar a usar hoy.

¿Qué significa realmente optimizar la navegación del sitio para las conversiones?

Aquí está la parte que nadie te dice: tu navegación no es un mapa de tu sitio web. Es una herramienta de apoyo a la decisión para una persona que llegó con un trabajo específico en mente. Alguien llega a su sitio pensando “Necesito ver lo que cuesta esto”, o “Quiero saber si esto funciona para mi situación”, o “¿dónde puedo iniciar sesión?” Su menú responde a eso de un vistazo, o los hace funcionar para ello.

Y cuando los visitantes tienen que trabajar para ello, la mayoría de ellos no lo hacen. No presentan una queja ni le envían un correo electrónico sobre el confuso menú desplegable. Presionan el botón de retroceso y prueban el siguiente resultado en Google. Eso es lo que quiero decir cuando digo que la confusión es el asesino silencioso: una caja rota arroja errores que puedes ver, pero una navegación rota simplemente sangra silenciosamente a los visitantes que nunca te dicen por qué se fueron.

Así que el objetivo no es la elegancia, la inteligencia, o apretar en cada página que has publicado. El objetivo es la velocidad al destino. Y una advertencia honesta antes de sumergirnos: la buena navegación sirve primero al visitante y las conversiones en segundo lugar. Afortunadamente, esos dos objetivos casi siempre apuntan en la misma dirección, y cuando entran en conflicto, la primera opción para el visitante es también la elección de confianza y ingresos a largo plazo. Volveremos a eso.

¿Cómo se diagnostican los problemas de navegación antes de cambiar algo?

Bueno, seamos honestos: la mayoría de los rediseños de navegación comienzan con alguien importante que dice “No me gusta el menú”. Saber cómo optimizar la navegación del sitio para las conversiones comienza con evidencia, no opiniones — Así que pasa una semana recogiendo antes de tocar una sola etiqueta. Esta es la misma disciplina que impulsa todo bien. conversion research — Observar el comportamiento real primero, formar hipótesis segundo, rediseñar tercero.

Esto es lo que hay que ver, en orden de esfuerzo:

1. Clics de navegación frente a las rutas previstas. Abre tus análisis y compara dónde navegan las personas en contra de dónde quieres que vayan. Si tu menú superior tiene siete elementos y el noventa por ciento de los clics van a dos de ellos, los otros cinco son en su mayoría ruido. — o son páginas importantes con etiquetas que nadie entiende. Si una página que considera crítica (precio, demostración, registro) apenas recibe tráfico de navegación, eso es una luz roja intermitente.

2. Consultas de búsqueda in situ. Este es oro, y casi todos lo ignoran. Cada búsqueda que alguien escribe en el cuadro de búsqueda de su sitio es, en un sentido muy real, una confesión de fallo de navegación. Miraron tu menú, no pudieron encontrar la cosa, y la escribieron en su lugar. Exporte su registro de consultas de búsqueda y léalo. Las palabras que escriben las personas son las etiquetas que su navegación probablemente debería usar — y las consultas con cero resultados son las brechas de contenido o las brechas de etiquetado que más te perjudican.

3. Patrones de ira en grabaciones de sesión. Mira grabaciones de sesiones reales y busca las señales reveladoras: clics rápidos y repetidos en los elementos del menú (clics de rabia), flotando hacia adelante y hacia atrás a través de elementos desplegables como alguien que escanea un pasillo de cereales, abriendo un mega-menú y cerrándolo sin hacer clic en nada, o rebotando entre dos secciones repetidamente. Cada uno de ellos es una persona que dice en silencio: “No puedo decir cuál de estos significa lo que quiero”.

4. Desembarque justo después del aterrizaje. Mira a los visitantes que aterrizan en una página, desplácese un poco, abra la navegación… y salga. Una alta tasa de salida inmediatamente después de interactuar con el menú sugiere que el menú no prometió nada relevante. La página de destino les hizo interesarse lo suficiente como para buscar un siguiente paso, y la navegación no ofreció uno que reconocieron.

5. Just ask. Una encuesta de una pregunta — ¿Qué esperabas encontrar hoy?” — en páginas de alto tráfico le da vocabulario de visitantes directamente desde la fuente. Cinco pruebas de usabilidad rápidas le mostrarán más de un mes de visualización del tablero. Resista la tentación de saltarse este paso; todo lo demás depende de saber lo que realmente está roto, y prometo que los datos lo sorprenderán al menos una vez.

¿Cómo se escriben las etiquetas de navegación que los visitantes realmente entienden?

Si tomas una cosa de este artículo, toma esto: nombra cosas como las llaman tus visitantes, no como las llamas internamente. La claridad de la etiqueta es la falla de navegación más común que veo, y también es la más barata de arreglar.

Piensa en la palabra “soluciones”. ¿De qué tipo? ¿Soluciones para qué? ¿Para quién? Es una etiqueta que significa algo en su sala de conferencias y nada en el cerebro de su visitante. Lo mismo con “Recursos” (¿es eso entradas de blog? ¿documentación? ¿descargas?), “Plataforma” (frente a “Producto”? ¿cuál es la diferencia?), Y cualquier etiqueta que es un nombre de marca para una característica (“Introducción NimbusTM” – su visitante no sabe lo que es Nimbus, lo siento mucho).

Tu organigrama interno es el enemigo aquí. Las empresas organizan los menús de la forma en que sus equipos están organizados -páginas de marketing aquí, páginas de productos allí- y el visitante, que nunca ha visto su organigrama y nunca lo hará, se queda decodificándolo. Agrupar y etiquetar por lo que el visitante está tratando de hacer, punto.

La prueba de tronco: su control de calidad de la etiqueta

El experto en usabilidad Steve Krug popularizó un cheque maravillosamente simple llamado prueba de tronco. La premisa: imagina que has sido conducido en el maletero de un coche (soporta conmigo) y que has caído en una página aleatoria de un sitio web. Con los ojos vendados, ¿puedes responder inmediatamente: ¿Qué sitio es este? ¿En qué página estoy? ¿Cuáles son las secciones principales? ¿Cómo puedo buscar? La navegación debe responder a todo eso de un vistazo, en cualquier página, sin contexto.

Aplique el mismo espíritu a cada etiqueta individual: si un extraño que nunca ha oído hablar de su empresa lee solo este elemento del menú, ¿podrían predecir lo que hay detrás? “Precio” pasa. “Planes y precios” pasa. “Opciones de valor” falla. “Cómo funciona” pasa. “Nuestro enfoque” es tambaleante. “La experiencia Nimbus” falla espectacularmente.

¿Dónde encuentras las palabras adecuadas? Ya los recopiló en el paso de diagnóstico: consultas de búsqueda en el sitio, respuestas a encuestas, tickets de soporte, notas de llamadas de ventas y comentarios y DM en sus canales sociales. Los visitantes te entregan su vocabulario todos los días. Su único trabajo es usarlo.

¿Cómo debes estructurar tu menú para las conversiones?

Una vez que sus etiquetas son honestas, la estructura es la siguiente. Tres principios hacen la mayor parte del trabajo aquí.

Mantén el nivel superior apretado — alrededor de cinco a siete artículos. Esta es una guía, no una ley de la física, pero se sostiene por una razón simple: cada elemento adicional de nivel superior hace que cada otro elemento sea más difícil de escanear. Un menú con doce entradas no es doce opciones útiles; es una pared de texto que el visitante tiene que leer, analizar y clasificar. Cuando todo se promueve, nada se puede encontrar. Si estás peleando por la octava ranura, el verdadero problema suele ser que dos elementos existentes deben fusionarse o degradarse.

Agrupar por intención del usuario, no por organigrama. Pregunte a cada página: ¿qué está tratando de lograr el visitante cuando quiere esto? Las páginas que sirven para la misma intención viven juntas, incluso si diferentes departamentos las poseen. Una sección “Aprende” que contenga tu blog, guías y seminarios web tiene sentido para un visitante. Una sección de “Marketing” que contenga las mismas páginas tiene sentido solo para su equipo de marketing.

No entierres las páginas de dinero. Las páginas que generan ingresos directamente — precios, registro, demo, contacto — debe ser visible desde el nivel superior o como máximo un clic obvio de distancia. Y sí, eso significa precios en la navegación principal. Sé que hay una escuela de pensamiento que dice ocultar los precios para forzar una conversación de ventas. He aquí mi opinión sincera: para la mayoría de las empresas, ocultar los precios frustra a las mismas personas que están listas para comprar y señala que se están jugando juegos. Los visitantes que no pueden encontrar un precio asumen que es caro, asumen que hay una espera de venta difícil, o simplemente van a buscar a un competidor que respete su tiempo. Si su precio realmente requiere conversación (verdadera empresa, compilaciones personalizadas), dígalo en una página de precios — “Así es como funcionan los precios y esto es lo que lo influye” — En lugar de pretender que el tema no existe.

Un menú, una acción resaltada

Su navegación también debe llevar exactamente una llamada a la acción visualmente distinta: un botón, no un enlace simple, para la acción única que más desee: “Iniciar prueba gratuita”, “Obtener una demostración”, “Comprar ahora”. Uno. Cuando el menú tiene tres botones gritando a la vez, has recreado el problema de los doce elementos en miniatura. Todo lo demás en el navegador es wayfinding; este elemento es la petición. Manténgalo consistente en cada página para que cada vez que el visitante esté listo, el siguiente paso esté en el mismo lugar familiar.

Mega-menú o menú desplegable simple – ¿qué convierte mejor?

Respuesta honesta: depende de tu catálogo, y cualquiera que te diga que uno siempre gana está vendiendo algo.

Simple dropdowns (un puñado de enlaces debajo de cada elemento superior) son adecuados para la mayoría de las empresas de software, empresas de servicios y sitios de contenido. Si todo tu sitio está bajo unas pocas docenas de páginas significativas, un mega-menú es una mansión para una familia de tres. — impresionante, en su mayoría vacío, fácil de perderse.

Mega-menus (los paneles grandes con columnas, encabezados y, a veces, imágenes) se ganan su mantenimiento cuando tienes un catálogo genuinamente grande — Piense en minoristas con cientos de productos en muchas categorías, o editores con jerarquías de temas profundas. Su fuerza es mostrar el paisaje de toda una categoría a la vez para que los visitantes puedan saltar directamente a la subsección correcta sin hacer clic en páginas intermedias.

Si utiliza un mega-menú, algunas instrucciones de cuidado: grupo con encabezados de columna claros (que a su vez deben pasar la prueba de tronco), resistir el espacio de llenado solo porque existe espacio, hacer que el teclado del panel sea navegable (más sobre accesibilidad pronto), y asegúrese de que el elemento de nivel superior en sí mismo todavía se puede hacer clic en una página de categoría sensible: algunos visitantes hacen clic en el padre en lugar de flotar, y deben aterrizar en algún lugar útil, no en ninguna parte.

Cualquiera que elijas, la prueba es la misma: ¿un visitante por primera vez llega a su destino más rápido? No “parece más premium”. Más rápido.

¿Cómo es una buena navegación móvil?

Aquí está la comprobación de la realidad: para muchos sitios, la mayoría de los visitantes están en un teléfono, lo que significa que su navegación móvil no es la versión de compromiso, es el evento principal.

El menú de hamburguesas es una compensación, no un pecado. Ese icono de tres líneas le compra una pantalla limpia a costa de ocultar sus opciones; fuera de la vista realmente está fuera de la mente de algunos visitantes. Por lo general, no puede evitarlo en pantallas pequeñas, pero puede suavizar el comercio: marque el icono con la palabra “Menú” para que no haya ambiguedad y aflore sus uno o dos destinos más importantes fuera de la hamburguesa. — un enlace persistente de “Precios” o tu botón principal de CTA sentado junto al icono funciona maravillosamente.

Diseño para pulgares. La gente sostiene los teléfonos con una mano y toca con un pulgar que llega cómodamente a la mitad y la parte inferior de la pantalla, no a las esquinas superiores. Hacer objetivos de grifo generosamente dimensionados y bien espaciados — enlaces estrechos que requieren precisión a nivel del cirujano causan errores de toque, y los errores de toque causan la versión móvil de los clics de rabia. Dentro del menú abierto, esta es también la razón por la que menos elementos más claros importan incluso más que en el escritorio.

Usa la navegación pegajosa juiciosamente. Una barra delgada que permanece disponible mientras el visitante se desplaza significa que el camino hacia adelante siempre está a un toque de distancia — Realmente útil en páginas largas. Pero un encabezado pegajoso que se come un tercio de la pantalla de un teléfono es una cabina de peaje en su propio contenido. Manténgalo corto, considere ocultarlo en el desplazamiento hacia abajo y revelarlo en el desplazamiento hacia arriba, y siempre pruébelo en un dispositivo pequeño real, no solo en la vista previa sensible de su navegador.

¿Qué pasa con la navegación de pie de página, migas de pan y búsqueda en el sitio?

El menú principal no puede llevar a todos. Tres sistemas de apoyo atrapan a los visitantes que extraña, y merecen más amor de lo que generalmente reciben.

El pie de página: su red de seguridad

Mira las grabaciones de las sesiones y lo verás constantemente: un visitante que no puede encontrar algo se desplaza directamente al final de la página. El pie de página es donde la gente perdida va a propósito. Así que trátalo como un directorio generoso y bien organizado: encabezados de columnas claros, enlaces a todo lo significativo (incluidas las páginas que no alcanzaron el corte de nivel superior), además de los elementos básicos de confianza que la gente espera allí: contacto, apoyo, políticas, carreras. El pie de página es también donde un listado de sitemaps ligeramente más completo es apropiado; las reglas de restricción que rigen su encabezado no se aplican tan estrictamente aquí, porque el visitante que se desplaza hacia su pie de página está cazando activamente.

Migas de pan: para sitios profundos

Si su sitio tiene profundidad real — categoría, subcategoría, producto; o documentos con secciones anidadas — breadcrumbs (ese pequeño Home + Categoría + rastro de página) silenciosamente hace tres trabajos: le dice a los visitantes dónde están, ofrece movimientos de un clic hacia arriba un nivel, y son especialmente amables con los muchos visitantes que aterrizan en lo profundo de su sitio desde los motores de búsqueda o enlaces sociales y tienen cero contexto sobre dónde está “aquí”. Si su sitio es poco profundo (la mayoría de las páginas a un clic de su casa), sáltelas; las migas de pan en un sitio plano son decoración.

Búsqueda in situ: sus visitantes de mayor intención

Las personas que usan la búsqueda en tu sitio te están diciendo exactamente lo que quieren: trátalos como los visitantes motivados que son. Tres reglas:

• Hazlo visible. Un cuadro de búsqueda real (o como mínimo un icono inconfundible) en el encabezado, no una función enterrada detrás de dos toques. Si el diagnóstico mostró un uso intensivo de la búsqueda, dale más prominencia, no menos.
• Make it forgiving. La búsqueda debe sobrevivir a los errores tipográficos, plurales y sinónimos. Si un visitante escribe “precio” y su página se titula “Planes”, aún debería llegar allí. Revisa tus consultas de resultados cero regularmente y agrega sinónimos o contenido en consecuencia.
• Haz que la página de resultados sea útil. Títulos claros, una línea de contexto, orden sensible — y un camino útil hacia adelante cuando no hay resultados (“no hay coincidencias, pero aquí están nuestras páginas más populares”), nunca un callejón sin salida. Mientras arreglas callejones sin salida, da el mismo tratamiento a tus páginas de error — bien construido 404 es la última línea de defensa de la navegación, y tenemos toda una guía sobre Optimización de su 404 página así que los visitantes perdidos encuentran su camino de regreso en lugar de rebotar.

¿Las landing pages deberían tener navegación?

Aquí hay una pregunta que tropieza con muchos vendedores reflexivos, así que manejemos honestamente.

Para una página de destino de campaña enfocada (tráfico pagado o una campaña social dedicada que llega a una página con un trabajo), reducir la navegación es una práctica legítima y bien establecida. Menos salidas significa menos vagabundeos medio interesados de vuelta a tu blog. Un módulo de aterrizaje despojado con solo un logotipo y la oferta es una opción de diseño razonable y honesta, y vale la pena probarlo contra una versión completa para su propia audiencia.

Pero hay una línea, y eso importa. Reducir la navegación está bien; atrapar a la gente no lo es. Eliminar todas las rutas de escape, desactivar el enlace del logotipo a casa, secuestrar el botón de retroceso o apilar bloqueos de carretera de intención de salida para que el visitante literalmente no pueda irse sin luchar, eso no es optimización, eso es coerción con una tasa de conversión. Se erosiona la confianza, puede estar en conflicto con las políticas de la plataforma de anuncios, y las “conversiones” que produce se inclinan hacia las personas molestas que son más propensas a reembolsar, batir y recordar mal. Una buena prueba: ¿te sentirías cómodo explicando la elección de diseño a la cara del visitante? “Hemos eliminado el menú para que pueda concentrarse” pasa. “Te rompimos el botón de atrás” no lo hace.

La misma regla de honestidad se aplica en todas partes en su navegador, por cierto: no hay enlaces publicitarios disfrazados disfrazados disfrazados como elementos del menú, no hay etiquetas de “Descargar” que realmente abren un muro de registro, no hay error de dirección. La navegación es una promesa sobre lo que hay detrás de cada puerta. Cumple las promesas.

Una nota más de mi rincón del mundo: si estás ejecutando campañas sociales, recuerda que un visitante que llega desde un enlace bio de Instagram o una publicación de LinkedIn a menudo aterriza en lo profundo de tu sitio sin contexto en absoluto. Esas rutas de aterrizaje social merecen la misma navegación clara que cualquier otra entrada: una página de paso de prueba de tronco con pasos a seguir obvios. (Es una de las primeras cosas que revisamos en SocialBlaze cuando un cliente dice que su tráfico social “no se convierte” – a menudo las publicaciones están haciendo su trabajo y la experiencia de aterrizaje es dejar caer la batuta.)

¿Cómo hacer que la navegación sea accesible para todos?

La accesibilidad no es un apéndice agradable de tener a este tema – es central. La navegación es la única interfaz que todo visitante debe usar, incluidos los visitantes que usan teclados, lectores de pantalla, dispositivos de conmutación o control de voz. Si el menú solo funciona para un ratón, no funciona.

Lo esencial:

• Full keyboard navigation. Cada elemento del menú, desplegable y menú móvil debe ser accesible y operable con las teclas Tab, Enter, Escape y flecha solo. Desconecta el ratón e intenta llegar a tu página de precios. Si no puedes, algunos de tus visitantes tampoco pueden.
• Visible focus states. Los usuarios de teclado necesitan ver dónde están. Si tu hoja de estilo eliminó el esquema de enfoque porque alguien pensó que era feo, restauralo. — Si quieres, puedes ver la imagen.
• Skip links. Un enlace de “Saltar al contenido principal” como el primer elemento enfocable evita que los usuarios de teclado y lector de pantalla realicen tabulación a través de todo su menú en cada página. Puede permanecer invisible hasta que se concentra.
• Lector de pantalla puntos de referencia y marcado adecuado. Use a real nav elemento con una etiqueta significativa, enlaces y botones reales (no divs clicables), y atributos ARIA correctos en los menús desplegables — estado expandido/colapsado debe ser anunciado, no sólo visualmente implicado.
• No confíes en el vuelo solo. El pasa el ratón no existe en las pantallas táctiles y es incómodo para muchos usuarios con discapacidades motoras. Los menús deben abrirse al hacer clic / tocar también, y cualquier cosa revelada en el cursor también debe ser accesible por el teclado.
• Suficiente contraste y toque el tamaño objetivo. El texto del menú debe cumplir con los estándares de contraste en su contexto — incluyendo en encabezados transparentes sobre imágenes de héroe, que fallan constantemente.

El secreto encantador: cada una de estas mejoras ayuda a todos. Los objetivos más grandes ayudan a los viajeros en un tren lleno de baches; los menús de clic para abrir ayudan a los usuarios de computadoras portátiles con pantalla táctil. El trabajo de accesibilidad es el trabajo de conversión con zapatos sensatos.

¿Cómo optimizar la navegación del sitio para las conversiones sin romper las cosas?

Los cambios de navegación son furtivos y peligrosos para probar, por una simple razón: el menú vive en cada página. Un ajuste a su encabezado no es una prueba de página; es una intervención en todo el sitio. Por lo tanto, la medición también debe ser en todo el sitio. Aquí es donde el trabajo de navegación se conecta de nuevo a la disciplina más amplia de la navegación. conversion-focused web design — estructura, jerarquía y evidencia sobre la opinión.

Medir en términos generales, no estrechos. Si solo mides los clics en el elemento de menú cambiado, te perderás la historia real. Una nueva etiqueta puede obtener menos clics, pero enviar visitantes mucho mejor calificados que convierten a una tasa más alta. Realizar un seguimiento de la conversión en todo el sitio, páginas por sesión, volumen de búsqueda en el sitio (debería disminuir si su navegador mejorara) — menos confesiones de fracaso), y tasas de salida en páginas clave.

Cambia una dimensión en el momento en que puedas. Si cambias el nombre de tres etiquetas, reordenas el menú y agregas un encabezado pegajoso de una sola vez, aprenderás que “algo funcionó” o “algo se rompió” y nunca sabes qué. Secuencia tus cambios: primero etiquetas (más baratas, mayor impacto), luego estructura, luego comportamiento como pegajosidad.

Dale a las pruebas más tiempo del habitual. Los visitantes que regresan tienen memoria muscular para su antiguo menú; espere un corto período en el que su comportamiento se desplome puramente por falta de familiaridad. Juzgue el cambio en los nuevos visitantes primero y en una ventana lo suficientemente larga para que los clientes habituales vuelvan a aprender.

Cuidado con el tráfico desplazado. Cuando degradas o eliminas un elemento del menú, el tráfico a esa página no desaparece cortésmente. — Va a alguna parte. Compruebe si se redirigió a través del pie de página o la búsqueda (bien), o si el tráfico de la página y sus conversiones posteriores simplemente se evaporaron (no está bien). — puede haber degradado algo que importaba).

Ten un retroceso listo. Debido a que los cambios de navegación tocan todo, trátelos con respeto a la implementación: conozca sus números de referencia, envíe detrás de un reverso fácil y verifique los datos a intervalos establecidos en lugar de esperar un mes para descubrir un problema.

Y si su tráfico es demasiado pequeño para pruebas A/B estadísticamente significativas, eso son muchos sitios, y está bien, confíe en el kit de herramientas cualitativas: pruebas de usabilidad para cinco personas, pruebas de árboles (pidiendo a las personas que encuentren elementos en una versión de solo texto de su estructura propuesta) y comparaciones antes/después leídas con la humildad adecuada.

Su lista de verificación de auditoría de navegación

Aquí está todo el sistema de cómo optimizar la navegación del sitio para las conversiones, condensado en una lista de verificación que puede ejecutar esta semana. Tome un café, abra su sitio en una ventana de incógnito y sea despiadadamente honesto.

Diagnosis

• Extraje datos de clics de navegación y los compara con las rutas de los visitantes previstos
• Consultas de búsqueda en el sitio exportadas y leídas, marcadas como búsquedas de resultado cero
• He visto al menos diez grabaciones de sesión, notando los clics de rabia y la vacilación del menú
• Tasas de salida verificadas para los visitantes que interactúan con el navegador poco después del aterrizaje

Labels

• Cada etiqueta de nivel superior pasa la prueba de tronco (un extraño puede predecir lo que hay detrás de ella)
• No hay jerga interna, nombres de departamento o nombres de marca inexplicables en el menú
• Las etiquetas usan palabras extraídas de consultas de búsqueda, tickets de soporte y encuestas de visitantes.

Estructura

• Aproximadamente de cinco a siete elementos de nivel superior, agrupados por intención del visitante
• Precios (o su página de dinero equivalente) visibles desde la navegación principal
• Exactamente una CTA visualmente resaltada en el encabezado, consistente en cada página
• El estilo de menú (mega vs. simple) coincide con el tamaño real del catálogo, no con la estética
• La navegación es consistente en todas las páginas: los mismos artículos, el mismo orden, el mismo lugar

Móvil

• Hamburguesa etiquetada o emparejada con enlaces clave / CTA fuera de ella
• Toca objetivos de tamaño cómodo y espaciados para los pulgares
• El encabezado Sticky (si lo hay) es delgado y probado en un dispositivo real

Safety nets

• El pie de página es un directorio bien organizado con encabezados claros
• Migas de pan presentes en jerarquías profundas (y ausentes en sitios planos)
• La búsqueda es visible, tolerante a errores tipográficos y nunca tiene un final muerto; 404 páginas redirigen a los visitantes perdidos de manera útil

Integrity and access

• Sin salidas ocultas, interferencia de botones traseros o anuncios disfrazados en cualquier parte del navegador
• Las páginas de destino pueden reducir la navegación, pero siempre dejan una salida honesta
• Menú completo operable por teclado con estados de enfoque visibles
• Saltar enlace presente; el navegador usa puntos de referencia adecuados y anuncia el estado desplegable
• El contraste cumple con los estándares, incluyendo imágenes de héroes

Ensayos

• Métricas de referencia registradas antes de cualquier cambio
• Cambios secuenciados (etiquetas, luego estructura, luego comportamiento)
• Éxito medido en todo el sitio, con plan de reversión listo

La hoja de trabajo de la etiqueta-claridad (su script de prueba de tronco)

¿Quieres probar tus etiquetas esta tarde? Aquí hay un guión simple. Necesitas de tres a cinco personas que no trabajen en tu empresa: amigos, un vecino, personas de un panel de pruebas barato. 15 minutos cada uno.

Configuración: Captura de pantalla de su navegación (escritorio y el menú móvil abierto). Para los menús desplegables, captura de pantalla abierta. Estás probando palabras, no clics, por lo que las imágenes estáticas son perfectas — y evitan que la gente “trampa” explorando.

Script, per participant:

• Paso 1 — Leer en frío. Muestra la navegación durante cinco segundos y luego ocultála. Pregunta: “¿Qué hace esta empresa? ¿Qué secciones recuerdas?” (Prueba la escaneabilidad general y si algo se queda.)
• Paso 2 — Predicción de etiquetas. Muestre el navegador de nuevo. Para cada elemento de nivel superior, pregunte: “Sin hacer clic, ¿qué espera encontrar detrás de esto?” Escriba sus palabras textualmente. — Los errores entre su predicción y su contenido real son su lista de correcciones.)
• Paso 3 — Ubicación de la tarea. Dé tres a cinco tareas reales: “¿Dónde haría clic para averiguar lo que cuesta?” “¿Dónde buscaría ayuda?” “¿Dónde iría para comenzar?” Tenga en cuenta las dudas, las conjeturas erróneas y, especialmente, cualquier “hmm, podría ser este o aquel” momentos — ambiguedad entre dos etiquetas es una señal de fusión o de cambio de nombre.
• Paso 4: Sus palabras. Pregunta: “Si estabas buscando [your key offering], ¿qué palabra esperarías ver en un menú?” (Cosecha vocabulario para tu reetiquetado).

Scoring: Para cada etiqueta, marque verde (predicho correctamente por todos), amarillo (mezclado) o rojo (mal entendido por la mayoría). Los rojos se renombran usando las palabras de Step 4. Los amarillos tienen una mirada más cercana. Luego vuelva a ejecutar la prueba con las nuevas etiquetas — Es quince minutos por persona, y ver a un extraño entender al instante su menú es realmente uno de los momentos más satisfactorios en este trabajo.

Preguntas frecuentes

¿Cuántos elementos debe tener un menú de navegación web?

Alrededor de cinco a siete artículos de nivel superior es una buena guía para la mayoría de los sitios, ya que cada artículo adicional hace que todos los demás sean más difíciles de escanear. Es una pauta más que una regla dura: los grandes catálogos legítimamente necesitan más estructura, generalmente a través de un mega-menú bien organizado. Si estás luchando por agregar un octavo elemento, el mejor movimiento suele ser fusionar dos existentes.

¿Deben los precios estar en la navegación principal?

Para la mayoría de las empresas, sí. Los visitantes que están listos para evaluar seriamente van a buscar precios, y ocultarlo frustra sus mejores perspectivas y señales de que se están jugando juegos. Si realmente necesitas una conversación, mantén una página de precios en el navegador de todos modos y úsala para explicar honestamente cómo funciona el precio y qué lo influye.

¿Los menús de hamburguesas perjudican las conversiones?

Implican una verdadera compensación: una pantalla más limpia a cambio de ocultar sus opciones, y las opciones ocultas reciben menos atención. En pantallas pequeñas, generalmente no puede evitar una, así que suavice el costo: etiquete el ícono “Menú” y mantenga visible su enlace o CTA más importante fuera de él. Luego, prueba con tu propia audiencia en lugar de confiar en la afirmación universal de alguien.

¿Cuál es la prueba de tronco para la navegación?

Es un control de calidad rápido popularizado por el experto en usabilidad Steve Krug: imagina que te dejan caer en cualquier página aleatoria de un sitio sin contexto: deberías poder decir instantáneamente en qué sitio estás, en qué página estás, cuáles son las secciones principales y cómo buscar. Aplicado a las etiquetas, significa que un extraño debería poder predecir lo que hay detrás de cada elemento del menú sin hacer clic.

¿Está bien eliminar la navegación de las páginas de destino?

Reducir la navegación en una página de destino de campaña enfocada es una práctica legítima y común: menos salidas mantiene la atención en la única oferta y vale la pena probarla para su audiencia. Lo que no está bien es atrapar a los visitantes: deshabilitar el enlace del logotipo, secuestrar el botón de retroceso o eliminar todas las salidas honestas. Reduce la distracción, nunca elimines la evasión.