Saltar al contenido

o2mer.net

Blog

Cómo navegar fácilmente por un sitio web con un mapa del sitio completo

Un mapa del sitio es una página que enumera, mediante enlaces en los que se puede hacer clic, todas o la mayoría de las páginas accesibles de un…

Femme étudiant un plan de site imprimé à son bureau pour mieux naviguer sur un site web
6 min

Un mapa del sitio es una página que enumera, mediante enlaces en los que se puede hacer clic, todas o la mayoría de las páginas accesibles de un sitio web. Reproduce la jerarquía de las secciones y subsecciones del sitio y ofrece una visión general que ni el menú principal ni la barra de búsqueda proporcionan por sí solos. Para quienes no encuentran lo que buscan en dos clics, esta página se convierte en un acceso directo al contenido deseado.

Accesibilidad con teclado y mapa del sitio: un requisito técnico que suele pasarse por alto

La mayoría de las guías sobre mapas del sitio se centran en el posicionamiento o en la estructura visual. Antes incluso de hablar de navegación, hay que comprobar que el mapa funcione para todos los usuarios, incluidos quienes navegan sin ratón.

El W3C recuerda que los elementos interactivos deben ser accesibles mediante el teclado y que el foco debe permanecer visible. En un mapa del sitio que a veces contiene cientos de enlaces, esto significa que se debe poder acceder a cada enlace con la tecla Tab y que el usuario debe identificar claramente cuál está seleccionado en todo momento.

Un mapa del sitio cuyos enlaces no muestran ningún estilo de foco visible (outline CSS eliminado, color idéntico al del resto) resulta inutilizable con el teclado. El visitante pulsa Tab sin saber en qué punto de la lista se encuentra. En el mapa del sitio de Allo Papa, las secciones están organizadas en forma de árbol, lo que facilita tanto la lectura secuencial como la exploración visual.

Hombre analizando un mapa del sitio que aparece en una gran pantalla en una oficina diáfana

Las WCAG 2.2 también especifican que el mapa del sitio no debe ser el único medio para localizar una página. Complementa la navegación principal, la búsqueda interna o las migas de pan. Si el menú del sitio está mal diseñado, añadir un mapa no resuelve el problema de fondo.

Estructura HTML de un mapa del sitio: qué ayuda realmente al visitante

Un mapa del sitio eficaz se basa en una estructura HTML precisa. Los enlaces se agrupan en listas anidadas (etiquetas ul y li) que reproducen la estructura real del sitio. El primer nivel corresponde a las secciones principales; el segundo, a las subsecciones; y el tercero, a las páginas individuales.

Esta estructura anidada tiene un doble efecto. El visitante identifica visualmente la lógica del sitio: las páginas de productos están bajo la sección del catálogo, los artículos bajo la del blog y los avisos legales bajo la sección de información. Las tecnologías de asistencia (lectores de pantalla) también interpretan esta jerarquía e indican el nivel de profundidad.

Diferencia entre un mapa HTML y un sitemap XML

El sitemap XML está dirigido a los robots de indexación (Googlebot, Bingbot). Contiene metadatos técnicos, como la fecha de la última modificación o la frecuencia estimada de actualización. Los visitantes no acceden a él desde su navegador.

El mapa del sitio HTML, en cambio, es una página web convencional, legible para cualquiera. Sirve para la navegación de las personas. Ambos formatos pueden coexistir en un sitio bien configurado, pero cumplen funciones distintas:

  • El sitemap XML indica a los motores de búsqueda qué páginas rastrear y su grado de actualización mediante el campo lastmod (Google ya ignora los campos priority y changefreq)
  • El mapa HTML permite al visitante encontrar una página sin recurrir al menú, la búsqueda o un enlace contextual
  • Un sitio grande (comercio electrónico, medio de comunicación) necesita ambos: el XML para un rastreo exhaustivo y el HTML para orientar a los usuarios

Navegación en un sitio web: cuándo resulta realmente útil el mapa del sitio

En un sitio de menos de diez páginas, basta con el menú. El mapa del sitio cobra todo su valor en sitios cuya estructura supera los tres niveles de profundidad o cuyo contenido cambia con frecuencia.

Tres situaciones concretas en las que un visitante recurrirá al mapa del sitio:

  • La búsqueda interna no ofrece resultados pertinentes, a menudo porque el término introducido no coincide con el vocabulario que utiliza el sitio
  • El menú solo muestra una parte de la estructura (algo frecuente en móviles, donde los submenús están ocultos de forma predeterminada)
  • El visitante quiere explorar la amplitud del sitio sin un objetivo concreto, por ejemplo, para evaluar la profundidad de un catálogo o la cobertura temática de un blog

Un mapa del sitio bien estructurado compensa las limitaciones del menú y de la búsqueda. No sustituye a ninguno de los dos, pero ofrece una alternativa cuando ambos mecanismos fallan.

Joven navegando por un mapa del sitio interactivo en una tableta, en un salón minimalista

Coherencia de la navegación entre páginas: lo que el mapa no corrige

Las WCAG recomiendan que los elementos de navegación que se repiten en varias páginas aparezcan en el mismo orden. Un menú cuya estructura cambia de una sección a otra desorienta al visitante, aunque exista un mapa del sitio completo.

El mapa del sitio refleja la jerarquía, pero no constituye por sí solo una arquitectura de la información bien diseñada. Si las categorías del sitio se solapan o un mismo contenido aparece en dos secciones distintas sin redirección, el mapa reproducirá esa incoherencia.

Antes de crear o rediseñar un mapa del sitio, hay que comprobar tres aspectos:

En primer lugar, que se pueda llegar a todas las páginas del sitio en un máximo de tres clics desde la página de inicio. Después, que el menú principal refleje las mismas secciones que el mapa. Por último, que los textos de los enlaces del mapa coincidan exactamente con los títulos de las páginas de destino para evitar confusiones.

El enlace en el pie de página sigue siendo útil

Incluir un enlace al mapa del sitio en el footer garantiza que se pueda acceder a él desde cualquier página. Esta práctica está tan extendida que los visitantes saben dónde buscarlo. Un enlace en el footer, un mapa actualizado y listas anidadas con el marcado correcto: estos tres elementos bastan para que un sitio sea fácil de recorrer, incluso cuando su estructura es compleja.

El mapa del sitio sigue siendo una herramienta de navegación complementaria, no un sustituto de una arquitectura clara. Su verdadero valor se aprecia cuando el menú, la búsqueda y las migas de pan ya funcionan correctamente: entonces añade una capa de claridad global que los demás mecanismos, por su propia naturaleza parcial, no pueden ofrecer.

Cómo navegar fácilmente por un sitio web con un mapa del sitio completo