diseño web

Errores de navegación en su sitio web que hacen que los clientes se vayan

¿Sus clientes se van porque no encuentran un servicio ni su número de teléfono? Pruebe su menú con dos tareas y corrija los errores de navegación que fallan.

Un cliente le cuenta que no pudo encontrar su número de teléfono. Otro le dice que no tenía idea de que usted hiciera ese tipo de trabajo, cuando está justo ahí, en su página de servicios. O revisa sus reportes, ve que llega gente y la ve salir sin llamar ni llenar un formulario. Es fácil culpar a las fotos, al precio o al tráfico. Los errores de navegación son un lugar más probable donde mirar, porque un visitante que no encuentra el servicio correcto ni el siguiente paso en pocos segundos no tiene motivo para seguir buscando. La buena noticia es que puede encontrar el punto que falla con una prueba de diez minutos, y la solución suele ser pequeña. Lo que sigue es la prueba, los errores que tiende a revelar, lo que implica cada corrección y cómo distinguir una reparación rápida de un proyecto más grande.

Puntos clave

Pruebe primero dos tareas

En un teléfono, pida a alguien que nunca haya visto su sitio que encuentre su número de teléfono y un servicio específico, sin ninguna ayuda de usted.

Corrija la falla, no todo el menú

Una etiqueta vaga, un servicio enterrado, un número oculto o un menú móvil roto tienen cada uno su propia reparación.

Los menús deben funcionar para todos

W3C/WAI pide menús operables con teclado, foco visible, ubicación consistente y enlaces reales con nombres significativos.

Las reparaciones pequeñas suelen bastar

Las fallas repetidas en varias páginas y dispositivos son la señal de que vale la pena pagar una reestructuración más grande.

¿Qué debe revisar primero cuando los clientes no encuentran algo?

Empiece con una persona, no con un reporte. Entregue su teléfono a alguien que nunca haya usado su sitio, un vecino, un amigo o un miembro del personal que no ayudó a construirlo, y déle dos tareas. Esto coincide con la prueba rápida que describe Nielsen Norman Group para observar a personas reales usando un sitio. No les diga nada sobre dónde están las cosas.

  1. Abra la página de inicio en una ventana privada del navegador para que el teléfono no complete nada de sus visitas anteriores.
  2. Pídales que encuentren su número de teléfono. Mida el tiempo y anote las palabras que buscan.
  3. Pídales que encuentren un servicio específico por el que un cliente lo contrataría, descrito como una necesidad («alguien que repare un techo con goteras»), no como la etiqueta de su menú.
  4. Observe, no ayude. Anote si abren el menú, se desplazan por la página, usan la búsqueda, tocan el logotipo o presionan el botón de regresar.
  5. Repita la prueba en dos páginas interiores, no solo en la de inicio. Los visitantes que llegan desde la búsqueda suelen aterrizar en páginas profundas del sitio.
  6. Revise el menú con el teclado en una computadora. Presione Tab para llegar al menú, abra los submenús, recorra los enlaces y vuelva a cerrar el menú, y confirme que siempre puede ver dónde está el foco.

Anote dónde dudó cada persona y qué palabra probó primero. La duda de una sola persona es una pregunta que vale la pena hacer. El mismo tropiezo de tres personas es un hallazgo. La prueba también le da el vocabulario exacto que usan los clientes, que es la mejor fuente para cambiar las etiquetas de su menú.

Un teléfono celular cerrado junto a un cronómetro y una libreta en blanco con un lápiz sobre un escritorio de madera pálida.
Dos tareas, un desconocido y un cronómetro le dicen más que una suposición.

¿Qué errores de menú le cuestan clientes y cómo corrige cada uno?

La lista siguiente sigue un orden práctico, empezando por los problemas que detienen más rápido a un visitante. Sigue el orden en que un visitante se topa con cada problema. Recórrala usando lo que le mostró su prueba.

Servicios enterrados o que faltan

Si alguien que busca «reparación de canalones» tiene que abrir tres niveles de menú, o si el servicio solo aparece en un párrafo de la página Acerca de, puede concluir que usted no lo ofrece. La solución es darle a cada servicio importante un enlace claro, agrupar los servicios relacionados bajo una página central y enlazar desde allí las páginas individuales. Nuestra publicación sobre qué poner en una página de servicio explica lo que necesita cada una de esas páginas cuando el visitante llega a ella.

Etiquetas que usan su lenguaje, no el de ellos

Nielsen Norman Group documenta un ejemplo de una universidad donde una etiqueta vaga ocultaba el menú principal y hacía difícil encontrar las carreras por las que la gente llegaba. Los términos internos y los nombres ingeniosos causan el mismo problema en un pequeño negocio: «Soluciones», «Nuestro enfoque» o un nombre de producto inventado no le dicen nada a un visitante. Reemplace cada uno por las palabras que usaron las personas de su prueba, como «Reparación de techos» o «Precios».

Un número de teléfono o una ruta de contacto que cuesta encontrar

La guía de Google sobre optimizar las páginas de aterrizaje recomienda que las páginas móviles sean rápidas, fáciles de contactar y sencillas de usar, y que la acción que usted quiere, como una llamada o una consulta, sea fácil de hacer. Ponga un número para llamar con un toque y un enlace de Contacto donde los vea un usuario de teléfono sin tener que desplazarse ni abrir un menú. Nuestra publicación sobre qué debe incluir una página de contacto explica la página detrás de ese enlace.

Un menú móvil que se oculta o falla

La investigación de Baymard sobre menús móviles describe los menús colapsados, los íconos de hamburguesa que la gente pasa por alto, las categorías padre poco claras y las dificultades para llegar a los niveles más profundos. Un ícono de tres líneas es solo un botón. El menú que se abre detrás todavía necesita etiquetas claras, enlaces completos, un estado visible de abierto o cerrado y una forma fácil de cerrarlo. El tutorial sobre menús de W3C/WAI también espera que el botón tenga un nombre accesible y que indique si el menú está expandido. Si su propia prueba en el teléfono muestra que el menú se abre pero le faltan páginas, eso es una reparación de la plantilla móvil, no una razón para reescribir su contenido. Nuestra lista de verificación sobre si su sitio es compatible con móviles le ayuda a detectar el resto.

Una sola llave sobre una bandeja de madera junto a un candado abierto y una pequeña bisagra de latón.
Un menú que la gente no puede abrir ni cerrar en un teléfono le cierra la página.

Menús desplegables que solo funcionan con el ratón

Los menús desplegables que se abren al pasar el cursor pueden ser imposibles en una pantalla táctil e inaccesibles desde el teclado. El tutorial de W3C/WAI recomienda patrones de menú reconocibles y submenús operables con teclado, con foco visible y un orden lógico. Si su revisión con teclado en la prueba se detuvo en el primer desplegable, esta es la causa. Rehacer la interacción suele ser un trabajo de tamaño mediano, porque necesita pruebas con teclado, pantalla táctil y un lector de pantalla.

Un menú que cambia de una página a otra

El criterio de éxito 3.2.3 de WCAG pide que la navegación que se repite en varias páginas aparezca en el mismo orden relativo cada vez. Un encabezado que se reordena o que cambia el nombre de un enlace en la página de precios obliga a los visitantes a aprender el sitio de nuevo. Estandarice el orden, las etiquetas y la ubicación en cada plantilla.

Enlaces que Google no puede seguir, y páginas sin un siguiente paso

Google Search Central indica que, por lo general, rastrea un enlace interno cuando es un elemento ancla HTML con un atributo href, y que el texto descriptivo del enlace ayuda a las personas y a Google a entender el destino. Cada página importante debe tener al menos un enlace desde otra página de su sitio. Eso no significa que cada página deba estar en el menú superior: los pies de página, las migas de pan, los enlaces a servicios relacionados y los enlaces dentro del texto de la página también cuentan. Un callejón sin salida, sin un siguiente paso, como una página de servicio que nunca lleva a una ruta de contacto, también es un problema de menú. Vea enlaces internos para un sitio de pequeño negocio para el plan página por página, y cómo corregir enlaces rotos y errores 404 para las reparaciones.

La búsqueda como sustituto de un menú claro

Nielsen Norman Group recomienda no hacer de la búsqueda la forma principal de moverse por un sitio, a menos que la búsqueda sea el propósito del sitio. Un cuadro de búsqueda ayuda como segunda ruta; no puede salvar un menú que oculta sus servicios principales.

Problemas del menú, reparaciones y tamaño del trabajo
Lo que muestra su pruebaReparaciónTamaño aproximado del trabajo (estimado)
El servicio está enterradoAgregue un enlace claro y agrupe los servicios bajo una página centralPequeño a mediano
La etiqueta es vagaCambie por la palabra del clientePequeño
El teléfono o el contacto están ocultosAgregue un número visible para llamar con un toque y un enlace de ContactoPequeño
Falla el menú móvilRepare el botón, el comportamiento al abrir y cerrar, las áreas táctiles y la cobertura de enlacesMediano
El desplegable falla con teclado o con pantalla táctilRehaga la interacción y pruébelaMediano
El menú cambia entre páginasEstandarice el orden, las etiquetas y la ubicaciónPequeño a mediano
Enlaces rotos o que no se pueden rastrearCorrija las URL y use enlaces estándar con hrefPequeño a mediano
Demasiados elementos sin relaciónAgrupe por necesidad del cliente; mueva los enlaces secundarios al pie de página o al textoMediano
Lo que muestra su pruebaEl servicio está enterrado
ReparaciónAgregue un enlace claro y agrupe los servicios bajo una página central
Tamaño aproximado del trabajo (estimado)Pequeño a mediano
Lo que muestra su pruebaLa etiqueta es vaga
ReparaciónCambie por la palabra del cliente
Tamaño aproximado del trabajo (estimado)Pequeño
Lo que muestra su pruebaEl teléfono o el contacto están ocultos
ReparaciónAgregue un número visible para llamar con un toque y un enlace de Contacto
Tamaño aproximado del trabajo (estimado)Pequeño
Lo que muestra su pruebaFalla el menú móvil
ReparaciónRepare el botón, el comportamiento al abrir y cerrar, las áreas táctiles y la cobertura de enlaces
Tamaño aproximado del trabajo (estimado)Mediano
Lo que muestra su pruebaEl desplegable falla con teclado o con pantalla táctil
ReparaciónRehaga la interacción y pruébela
Tamaño aproximado del trabajo (estimado)Mediano
Lo que muestra su pruebaEl menú cambia entre páginas
ReparaciónEstandarice el orden, las etiquetas y la ubicación
Tamaño aproximado del trabajo (estimado)Pequeño a mediano
Lo que muestra su pruebaEnlaces rotos o que no se pueden rastrear
ReparaciónCorrija las URL y use enlaces estándar con href
Tamaño aproximado del trabajo (estimado)Pequeño a mediano
Lo que muestra su pruebaDemasiados elementos sin relación
ReparaciónAgrupe por necesidad del cliente; mueva los enlaces secundarios al pie de página o al texto
Tamaño aproximado del trabajo (estimado)Mediano

Tome los tamaños de trabajo como guías aproximadas. El tamaño real depende de su plataforma, de cuántas plantillas de página tenga y de si el menú está programado a la medida. Confirme el alcance con quien haga la corrección después de revisar su sitio real.

¿Cuántos elementos debe tener su menú?

No existe una cantidad única y correcta en las guías de W3C, Google, Nielsen Norman Group, Baymard o GOV.UK. Lo que importa es si la gente puede encontrar lo que vino a buscar. Agrupe los elementos según lo que necesita el cliente, dé a cada grupo una etiqueta sencilla y luego repita la prueba de dos tareas. Si la misma tarea sigue fallando, el problema es la etiqueta o la ubicación, no la cantidad de elementos. Nuestra publicación sobre qué debe tener la página de inicio de un pequeño negocio muestra cómo trabajan juntos la página de inicio y el menú.

¿Qué le puede decir su analítica sobre dónde se pierden los visitantes?

La analítica es una segunda opinión después de la prueba del teléfono. En Google Analytics 4, abra Reports (Informes), luego Engagement (Participación) y después Pages and screens (Páginas y pantallas) para ver qué páginas visualiza la gente. Luego cree un informe de Path exploration (Exploración de rutas), que muestra qué vieron las personas después de su página de inicio, dónde vuelven atrás y qué páginas aparecen antes o después de un evento clave, como el envío de un formulario.

Lea estas rutas como pistas sobre dónde mirar, no como veredictos. GA4 registra lo que hicieron los visitantes, pero no puede decirle por qué se fueron. Alguien puede irse justo después de encontrar su número de teléfono, o después de decidir que el servicio no es lo que necesita. Una tasa de salida alta en una página es un motivo para hacer sus dos tareas empezando desde esa página. Nuestra publicación sobre cómo se ve una buena tasa de rebote explica el número en sí, y mapas de calor y grabaciones de sesiones le muestran los toques y desplazamientos reales si quiere observar el comportamiento.

Un mapa de papel con círculos de lápiz suaves y una regla sobre un escritorio, junto a una pequeña brújula.
Las rutas en su analítica señalan dónde mirar; la prueba del teléfono muestra qué salió mal ahí.

¿Basta una reparación rápida o necesita un rediseño?

Una reparación pequeña suele bastar. Un elemento del menú con otro nombre, un enlace a un servicio que faltaba, un número de teléfono visible, un botón móvil reparado o una URL rota corregida pueden resolver, cada uno, la tarea que detectó su prueba. Si esas correcciones resuelven las dos tareas para las siguientes tres personas que pruebe, gastar dinero en un sitio nuevo no es el siguiente paso.

Un proyecto más grande se justifica cuando el problema es estructural. Las señales incluyen servicios que se superponen y no se distinguen, ninguna jerarquía utilizable, menús móviles y de escritorio que muestran cosas distintas, plantillas con controles de menú que los usuarios de teclado no pueden alcanzar, o un sitio que usted no puede actualizar porque cada cambio de etiqueta necesita a un programador. El manual de diseño del Home Office sobre una señalización clara y un orden consistente es un estándar justo para exigir a una reestructuración.

Si contrata ayuda, lleve sus notas de la prueba, sus rutas de GA4, las direcciones afectadas y los dispositivos donde falló. Eso le da a un diseñador un problema concreto que resolver, y le permite recomendar una reparación o una reconstrucción con base en evidencia. Si las fallas vienen de lo que hacen los visitantes después de encontrar la página correcta, nuestra publicación sobre cuál es una buena tasa de conversión de un sitio web le ayuda a distinguir entre los dos casos.

Una ordenada fila de cajones de madera sin frente, uno abierto, sobre un estante de taller sencillo.
Una corrección que abre un solo cajón cuesta menos que reconstruir todo el mueble.

¿Pueden sus visitantes moverse con facilidad por su sitio?

Elija una respuesta para empezar.

1. ¿Cuál es el mejor primer paso cuando los clientes dicen que no encuentran algo en su sitio?

2. ¿Google generalmente sigue un enlace interno construido como un elemento ancla HTML con un atributo href?

3. Su prueba del teléfono muestra que el menú se abre pero omite dos de sus servicios. ¿Qué tipo de corrección es esa?

Preguntas frecuentes sobre los errores de navegación del sitio web

¿Por qué se van los clientes de mi sitio web?

Puede que no encuentren un servicio, su número de teléfono, el siguiente paso o un menú móvil que funcione. Pruebe esas tareas con alguien que no conozca el sitio antes de atribuir una causa.

¿Cómo sé si mi menú es confuso?

Pida a alguien que nunca haya usado su sitio que encuentre su número de teléfono y un servicio, sin ayuda. Observe el camino que sigue y dónde se detiene.

¿Cuántos elementos debe tener mi menú?

Ningún organismo de normas da un número correcto único. Agrupe los elementos según lo que necesitan los clientes y pruebe si la gente puede encontrar las páginas importantes.

¿Mi número de teléfono debe estar en el menú principal?

Debe ser fácil de encontrar y de tocar en un teléfono. Un número visible en el encabezado, un enlace de Contacto o un llamado a la acción claro pueden lograrlo.

¿Mi menú afecta al SEO?

Los enlaces internos ayudan a Google a encontrar páginas y a entender cómo se relacionan. Google recomienda usar enlaces ancla estándar con texto descriptivo, y enlazar cada página importante desde al menos otra página.

¿Un ícono de hamburguesa puede arreglar un menú de teléfono?

Solo si el botón y el menú abierto son comprensibles y completos, se pueden operar con pantalla táctil y con teclado, y muestran si están abiertos o cerrados.

En resumen

Los clientes se van cuando una tarea básica es difícil: encontrar el servicio correcto, encontrar cómo comunicarse con usted, entender una etiqueta o usar el menú en un teléfono. La forma más rápida de saber cuál falla es darle a un desconocido dos tareas en un teléfono y observar. A partir de ahí, relacione la falla con su reparación, ya sea una etiqueta más clara, un número de teléfono visible, un botón móvil corregido, desplegables compatibles con el teclado o enlaces construidos como anclas reales.

Un menú claro ayuda a todos los visitantes, incluidas las personas que usan teclado o lector de pantalla, y le da a Google un camino más limpio por sus páginas. Las reparaciones pequeñas hechas a tiempo cuestan menos que un rediseño hecho después de meses de consultas perdidas, y las fallas repetidas en la prueba, en varias páginas y dispositivos, le indican cuándo se justifica una reestructuración mayor.

Si prefiere delegarlo, podemos revisar su menú con los resultados de la prueba y decirle si conviene una reparación puntual o una reconstrucción, a través de nuestro servicio de diseño web. Web Leveling construye sitios rápidos que usted es dueño por completo, y trabajamos con pequeños y medianos negocios en todo el país y en el extranjero. Envíenos sus notas de la prueba mediante el formulario de contacto y nosotros nos encargamos desde ahí.

Términos

Palabras de menú y estructura del sitio en esta publicación

Toque un término para ver qué significa.

Enlace ancla. Un enlace HTML estándar con un atributo href que apunta a otra página, y que Google puede seguir.

Migas de pan. Una serie de enlaces, por lo general cerca de la parte superior de la página, que muestra dónde está la página dentro del sitio.

Menú hamburguesa. Un ícono de tres líneas que abre un menú oculto, más a menudo en los teléfonos.

Exploración de rutas. Un informe de GA4 que muestra qué páginas vieron las personas antes o después de una página o evento elegido.

Evento clave. Una acción que GA4 está configurado para contar como importante, como el envío de un formulario de contacto.

Nombre accesible. El texto que anuncia un lector de pantalla para un botón o enlace, como « Menú ».