WCAG 2.4.8: Ubicación

Qué Significa Esta Regla

WCAG 2.4.8 Ubicación es un criterio de Nivel AAA bajo el principio de Operable. Establece: "La información sobre la ubicación del usuario dentro de un conjunto de páginas web está disponible." En términos prácticos, esto significa que tu sitio web debe proporcionar señales claras y persistentes que indiquen a los usuarios exactamente dónde se encuentran dentro de la estructura general del sitio en cualquier momento.

Este criterio se aplica siempre que un sitio web consista en múltiples páginas organizadas en una jerarquía o secuencia significativa — por ejemplo, un sitio de comercio electrónico con categorías, subcategorías y páginas de producto, o un portal gubernamental con departamentos y subsecciones. Si un usuario llega a una página, debería poder responder a la pregunta "¿Dónde estoy en este sitio?" sin tener que adivinar o depender únicamente de la memoria.

Las técnicas aceptables para cumplir este criterio incluyen, entre otras:

• Rutas de migas de pan (breadcrumbs) — una ayuda de navegación que muestra el camino desde la página de inicio del sitio hasta la página actual (por ejemplo, Home > Products > Laptops > 15-inch Models).
• Mapas del sitio — una página o panel dedicado que muestra la estructura general del sitio y resalta o marca la ubicación actual.
• Enlaces de navegación resaltados o visualmente distintos — menús de navegación que marcan claramente la sección o página activa, a menudo complementados con un atributo aria-current para usuarios de tecnologías de asistencia.
• Pasos numerados en un proceso de varios pasos — indicadores como "Step 2 of 5" en un proceso de compra o asistente de formulario que comunican la posición secuencial.

Una página cumple este criterio si al menos hay disponible un mecanismo fiable que informe al usuario de su ubicación actual dentro de la estructura del sitio. Una página no cumple si no existe tal mecanismo — por ejemplo, si la barra de navegación no tiene ninguna indicación visual o programática de la página actual, no hay migas de pan y no se muestra ningún indicador de paso.

Es importante señalar que WCAG 2.4.8 no exige una técnica específica; requiere que haya algún indicador de ubicación eficaz. Sin embargo, para que el indicador sea realmente accesible, también debe ser perceptible por tecnologías de asistencia como los lectores de pantalla, no solo visualmente evidente para usuarios videntes. Esto significa que los indicadores puramente visuales (como un enlace en negrita sin cambio en la etiqueta accesible) pueden ser insuficientes por sí solos si no se exponen de forma programática.

No hay excepciones oficiales establecidas por WCAG para este criterio más allá del entendimiento general de que se aplica a conjuntos de páginas relacionadas. Una única página web independiente que no forma parte de un conjunto más amplio no necesitaría cumplir este criterio, ya que no hay una "ubicación dentro de un conjunto" que comunicar.

Por Qué Importa

Saber dónde estás dentro de un entorno digital es una necesidad básica de orientación que la mayoría de los usuarios da por sentada — hasta que las señales están ausentes. WCAG 2.4.8 aborda una barrera real y generalizada que experimentan varios grupos de usuarios distintos.

Las personas con discapacidades cognitivas se encuentran entre las más afectadas. Condiciones como el trastorno por déficit de atención, los deterioros de la memoria y las lesiones cerebrales adquiridas pueden dificultar el seguimiento del propio recorrido a través de un sitio complejo. Sin migas de pan o una señal similar, un usuario puede desorientarse, no estar seguro de cómo volver a una categoría principal o ser incapaz de entender cómo la página actual se relaciona con contenido que ya ha visto. Según la Organización Mundial de la Salud, más de mil millones de personas en todo el mundo viven con algún tipo de discapacidad, y los deterioros cognitivos representan una parte significativa y a menudo desatendida de esa población.

Las personas usuarias de lectores de pantalla — que suelen ser ciegas o tener baja visión — dependen en gran medida de la estructura programática para entender el contexto de la página. Una persona vidente puede echar un vistazo a un enlace de navegación resaltado o a un elemento de migas de pan en negrita para orientarse al instante. Una persona usuaria de lector de pantalla, en cambio, debe interpretar la página a través de una salida de audio secuencial. Sin un atributo aria-current="page" en el enlace de navegación activo o unas migas de pan correctamente estructuradas con etiquetas accesibles, no recibe una señal de orientación equivalente y puede necesitar navegar extensamente solo para determinar dónde está.

Las personas con discapacidades motoras que navegan mediante teclado, acceso por pulsador o dispositivos de seguimiento ocular se benefician de los indicadores de ubicación porque reducen la necesidad de navegación redundante y esforzada. Si un usuario ya sabe que está en la sección "Support" de un sitio corporativo, no necesita volver a examinar toda la estructura de navegación cada vez que carga una nueva página.

Considera un escenario concreto: una persona con demencia en etapa inicial está navegando por el portal en línea de un banco turco para encontrar información sobre tasas hipotecarias. Hace clic en varias páginas y deja de estar segura de si sigue en la sección de banca personal o si ha pasado a la de banca para empresas. Sin una ruta de migas de pan o un elemento de navegación resaltado que marque claramente su sección actual, puede cerrar el navegador frustrada o cometer un error costoso — como solicitar el producto equivocado. Unas migas de pan simples y bien implementadas (por ejemplo, Ana Sayfa > Bireysel Bankacılık > Krediler > Konut Kredisi) resolverían inmediatamente esta confusión.

Más allá de la accesibilidad, los indicadores de ubicación proporcionan beneficios medibles de usabilidad y SEO. Los datos estructurados de migas de pan (usando Schema.org BreadcrumbList) pueden aparecer directamente en los resultados de búsqueda de Google como fragmentos enriquecidos, mejorando las tasas de clics. Una estructura de sitio clara también reduce las tasas de rebote, ya que los usuarios que entienden dónde están tienen más probabilidades de explorar contenido relacionado en lugar de abandonar el sitio.

Reglas Relacionadas de Axe-core

WCAG 2.4.8 requiere pruebas manuales porque las herramientas automatizadas no pueden determinar de forma fiable si un mecanismo de ubicación está presente, es significativo y accesible en todos los contextos. Ninguna regla de axe-core se asigna directamente a este criterio. He aquí por qué la automatización se queda corta y qué debe cubrir la evaluación manual:

• Presencia de un mecanismo de ubicación (manual) — Un escáner automatizado puede detectar si existe un elemento de migas de pan en el DOM, pero no puede determinar si esas migas de pan reflejan con precisión la arquitectura de información real del sitio, si se colocan en todas las páginas dentro de un conjunto o si son el tipo correcto de indicador de ubicación para el modelo de navegación del sitio. Una herramienta podría encontrar un elemento <nav aria-label="breadcrumb"> e informar que no hay problema, incluso si las migas de pan solo aparecen en algunas páginas o contienen información jerárquica incorrecta.
• Exactitud e integridad (manual) — Las herramientas automatizadas no pueden verificar que la información de ubicación sea precisa. Unas migas de pan que siempre muestran "Home > Current Page" independientemente de la jerarquía real pasarían un escaneo automatizado pero no cumplirían este criterio, porque no representan de forma veraz la ubicación del usuario dentro del conjunto de páginas.
• Exposición programática (parcialmente automatizada) — Aunque axe-core puede señalar la ausencia de atributos aria-current en enlaces de navegación en algunas configuraciones, no puede determinar de forma concluyente si la ausencia de aria-current es una infracción de 2.4.8 sin entender la estructura general del sitio y el rol de cada elemento de navegación.
• Consistencia en todo el conjunto de páginas (manual) — Un mecanismo de ubicación debe estar disponible en todo el conjunto relevante de páginas, no solo en páginas seleccionadas. Los escaneos automatizados suelen evaluar una página a la vez y no pueden determinar si un mecanismo está presente de forma consistente en todo un sitio o sección.

Cómo Probar

1. Identificar el conjunto de páginas: Determina si la página bajo prueba pertenece a un conjunto de páginas relacionadas con una jerarquía definida (por ejemplo, una estructura de navegación multinivel, un asistente paso a paso o una biblioteca de contenido categorizada). Si la página es un documento independiente, es posible que este criterio no aplique.
2. Ejecutar un escaneo automatizado como línea base: Usa axe DevTools (extensión de navegador) o Lighthouse en Chrome DevTools para ejecutar una auditoría de accesibilidad. Aunque ninguna de estas herramientas audita directamente 2.4.8, revisa problemas relacionados como la ausencia de atributos aria-current en enlaces de navegación, puntos de referencia <nav> sin etiqueta y estructura de migas de pan ausente. Estos hallazgos apoyan — pero no sustituyen — la revisión manual.
3. Inspeccionar visualmente la existencia de un mecanismo de ubicación: Busca una ruta de migas de pan, un enlace activo resaltado o visualmente distinto en la navegación, un contador de pasos o un enlace al mapa del sitio. Verifica que el mecanismo refleje con precisión la posición de la página actual en la jerarquía del sitio.
4. Probar con un lector de pantalla — NVDA + Firefox: Abre NVDA, navega a la página y presiona D para recorrer los puntos de referencia. Localiza los puntos de referencia de navegación y escucha cualquier indicación de la página o sección actual. Comprueba si el elemento de navegación activo se anuncia de forma diferente (por ejemplo, "current page" o similar, normalmente transmitido mediante aria-current="page"). Recorre las migas de pan si están presentes y verifica que cada nivel se anuncie con su texto de enlace y que la ubicación actual se identifique claramente.
5. Probar con VoiceOver + Safari (macOS/iOS): Activa VoiceOver (Command + F5), navega hasta las migas de pan o la navegación principal usando VO + U para abrir el Rotor y selecciona "Links" o "Landmarks". Escucha cómo se anuncia el elemento de navegación activo o el elemento actual de las migas de pan. Verifica que la ubicación actual sea distinguible de otros elementos de navegación.
6. Probar con JAWS + Chrome: Usa Insert + F7 para abrir la lista de enlaces y Insert + F6 para abrir la lista de encabezados. Navega hasta el área de migas de pan o navegación y confirma que la página o sección actual sea identificable de forma programática. Comprueba que aria-current se lea en voz alta (JAWS anuncia esto como "current" para el elemento relevante).
7. Probar en varias páginas del conjunto: Navega por al menos de tres a cinco páginas dentro de la misma sección o jerarquía y confirma que el mecanismo de ubicación se actualiza correctamente en cada página y que está presente de forma consistente en todo el conjunto.
8. Inspeccionar el DOM: Usa las DevTools del navegador para comprobar que los enlaces de las migas de pan tengan nombres accesibles descriptivos, que el elemento actual use aria-current="page" (para la página actual) o aria-current="true" (para el paso actual en un proceso), y que las migas de pan estén envueltas en un elemento <nav> con una etiqueta accesible como aria-label="Breadcrumb".

Cómo Corregir

Navegación de Migas de Pan Ausente — Incorrecto

<!-- No breadcrumb or location indicator present.
     Users have no way to determine their location in the site hierarchy. -->
<nav aria-label='Main navigation'>
  <ul>
    <li><a href='/'>Home</a></li>
    <li><a href='/products'>Products</a></li>
    <li><a href='/products/laptops'>Laptops</a></li>
  </ul>
</nav>
<h1>15-inch Laptops</h1>

Navegación de Migas de Pan Ausente — Correcto

<!-- A breadcrumb nav is added above the main content.
     aria-label distinguishes it from main navigation.
     aria-current="page" marks the current location for screen readers.
     The list structure communicates hierarchy. -->
<nav aria-label='Breadcrumb'>
  <ol>
    <li><a href='/'>Home</a></li>
    <li><a href='/products'>Products</a></li>
    <li><a href='/products/laptops'>Laptops</a></li>
    <li><a href='/products/laptops/15-inch' aria-current='page'>15-inch Laptops</a></li>
  </ol>
</nav>
<nav aria-label='Main navigation'>
  <ul>
    <li><a href='/'>Home</a></li>
    <li><a href='/products'>Products</a></li>
    <li><a href='/products/laptops'>Laptops</a></li>
  </ul>
</nav>
<h1>15-inch Laptops</h1>

Enlace de Navegación Activo Sin Indicador Programático — Incorrecto

<!-- The active link is styled differently in CSS, but there is no
     programmatic signal. Screen reader users cannot distinguish it
     from the other navigation links. -->
<nav aria-label='Site navigation'>
  <ul>
    <li><a href='/about'>About</a></li>
    <li><a href='/services' class='active'>Services</a></li>
    <li><a href='/contact'>Contact</a></li>
  </ul>
</nav>

Enlace de Navegación Activo Sin Indicador Programático — Correcto

<!-- aria-current="page" is added to the active link.
     Screen readers will announce this link as "current" or "current page"
     depending on the assistive technology, giving users a clear
     programmatic location signal in addition to the visual styling. -->
<nav aria-label='Site navigation'>
  <ul>
    <li><a href='/about'>About</a></li>
    <li><a href='/services' class='active' aria-current='page'>Services</a></li>
    <li><a href='/contact'>Contact</a></li>
  </ul>
</nav>

Formulario de Varios Pasos Sin Indicador de Paso — Incorrecto

<!-- A multi-step checkout form with no indication of current step.
     Users cannot determine how far they are through the process
     or how many steps remain. -->
<form>
  <h1>Shipping Information</h1>
  <!-- form fields -->
  <button type='submit'>Next</button>
</form>

Formulario de Varios Pasos Sin Indicador de Paso — Correcto

<!-- A progress indicator communicates the user's position in the sequence.
     aria-label on the nav provides context.
     aria-current="step" marks the active step for assistive technologies.
     The visible text "Step 2 of 4" is also available for all users. -->
<nav aria-label='Checkout progress'>
  <ol>
    <li><a href='/checkout/cart'>Cart</a></li>
    <li aria-current='step'><strong>Shipping</strong></li>
    <li>Payment</li>
    <li>Confirmation</li>
  </ol>
</nav>
<form>
  <h1>Shipping Information <span>(Step 2 of 4)</span></h1>
  <!-- form fields -->
  <button type='submit'>Next: Payment</button>
</form>

Errores Comunes

• Proporcionar migas de pan solo en la página de inicio o solo en las páginas hoja: Las migas de pan deben estar presentes de forma consistente en todas las páginas dentro del conjunto. Mostrarlas solo en las páginas de detalle de producto pero no en las páginas de categoría crea lagunas en la información de orientación.
• Usar un enlace activo con estilo visual sin añadir aria-current="page": Un enlace de navegación activo en negrita o subrayado comunica la ubicación visualmente, pero las personas usuarias de lectores de pantalla no reciben ningún beneficio a menos que aria-current="page" también esté presente en ese elemento.
• Envolver las migas de pan en un elemento <div> en lugar de un elemento <nav>: Usar un contenedor no semántico significa que las migas de pan no se exponen como un punto de referencia de navegación, lo que dificulta que las personas usuarias de lectores de pantalla las encuentren e interpreten.
• Omitir aria-label en el <nav> de las migas de pan cuando también existe un punto de referencia de navegación principal: Dos elementos <nav> sin etiqueta en la misma página crean ambigüedad. Los lectores de pantalla pueden anunciar ambos simplemente como "navigation", dejando a los usuarios sin poder distinguir entre ellos.
• Usar aria-current="true" en un enlace de página en lugar de aria-current="page": El valor page es el valor semánticamente correcto para identificar la página actual en un contexto de navegación. Usar true es menos descriptivo y puede anunciarse de forma diferente o menos clara por las tecnologías de asistencia.
• Confiar únicamente en el título de la página para indicar la ubicación: Un elemento <title> descriptivo (por ejemplo, "Laptops — 15-inch Models | Acme Store") es útil y está requerido por WCAG 2.4.2, pero por sí solo no satisface 2.4.8, que requiere un mecanismo que transmita la posición dentro de la estructura del conjunto de páginas, no solo el nombre de la página actual.
• Construir migas de pan que reflejan la estructura de la URL en lugar de la jerarquía de navegación: Las URL y las estructuras de navegación no siempre se alinean. Las migas de pan deben reflejar la arquitectura lógica de la información que un usuario entendería, no la ruta de URL subyacente, que puede ser técnica u opaca.
• Mostrar las migas de pan como texto plano sin enlaces para los niveles ancestros: Si solo se muestra la página actual o los niveles ancestros no están enlazados, las migas de pan pierden su utilidad tanto como indicador de ubicación como ayuda de navegación. Los elementos ancestros deben estar enlazados para permitir que los usuarios suban de nivel en la jerarquía.
• Marcar el elemento actual de las migas de pan solo con un cambio visual de separador en lugar de aria-current: Cambiar el color o eliminar el subrayado del último elemento de las migas de pan no comunica a los lectores de pantalla que representa la página actual. Debe añadirse explícitamente aria-current="page".
• Olvidar actualizar el indicador de ubicación en aplicaciones de una sola página (SPA) después de la navegación del lado del cliente: En SPAs construidas con frameworks como React o Vue, las transiciones de página se producen sin una recarga completa del navegador. Si las migas de pan o el indicador de navegación activo no se actualizan de forma programática al cambiar de ruta, mostrarán información de ubicación obsoleta, lo cual es peor que no tener ningún indicador.

Relación con las Regulaciones de Accesibilidad de Turquía

La Circular Presidencial 2025/10 de Turquía, publicada en el Boletín Oficial Nº 32933 el 21 de junio de 2025, establece requisitos vinculantes de accesibilidad web y móvil para una amplia gama de organizaciones que operan en Turquía. La circular exige el cumplimiento de estándares de accesibilidad reconocidos internacionalmente — adoptando en la práctica el marco WCAG — y se aplica a un conjunto definido de tipos de entidades, incluidas instituciones y organismos públicos, plataformas de comercio electrónico, bancos e instituciones financieras, hospitales y proveedores de atención sanitaria, empresas de telecomunicaciones con 200,000 o más abonados, agencias de viajes autorizadas, empresas de transporte privadas y escuelas privadas autorizadas por el Ministerio de Educación Nacional (MoNE).

WCAG 2.4.8 Ubicación se clasifica como un criterio de Nivel AAA, lo que significa que no se encuentra entre los criterios legalmente requeridos de base según la circular, que hace referencia a la conformidad de Nivel A y Nivel AA como umbral mínimo. Sin embargo, esta distinción es importante de varias maneras para las organizaciones cubiertas por la regulación.

En primer lugar, ciertos servicios especializados — en particular aquellos que atienden a usuarios con desafíos cognitivos o de navegación significativos, como portales de salud para pacientes mayores o plataformas educativas para estudiantes con dificultades de aprendizaje — pueden verse obligados a superar la base AA para cumplir realmente con el espíritu de las obligaciones de accesibilidad según la legislación turca y normativa relacionada como la Ley sobre las Personas con Discapacidad Nº 5378. Implementar 2.4.8 en estos contextos demuestra un compromiso sustantivo, más que meramente procedimental, con la inclusión.

En segundo lugar, las instituciones públicas turcas y las entidades privadas reguladas están cada vez más sujetas a mecanismos de auditoría y quejas. Demostrar cumplimiento a nivel AAA — incluyendo WCAG 2.4.8 — proporciona un registro defendible de implementación de buenas prácticas y reduce el riesgo regulatorio en caso de una queja formal de accesibilidad.

En tercer lugar, para las plataformas de comercio electrónico y los bancos en particular, los indicadores de ubicación como las migas de pan tienen un valor comercial directo además de su función de accesibilidad. Un proceso de solicitud de hipoteca en línea de un banco turco que incluya indicadores de paso claros y navegación mediante migas de pan no solo atenderá de forma más eficaz a usuarios con discapacidades cognitivas, sino que también reducirá las tasas de abandono y apoyará la conversión — alineando la inversión en accesibilidad con resultados comerciales medibles.

Las organizaciones que utilizan el SDK de superposición Accsible pueden aprovechar sus funciones integradas de mejora de migas de pan e inyección de aria-current para acercar sitios existentes a la conformidad con 2.4.8 sin requerir una refactorización completa de la base de código. Sin embargo, para un cumplimiento completo y sólido — especialmente para las entidades cubiertas por la Circular Presidencial 2025/10 — la implementación del lado del servidor o en tiempo de compilación de marcado semántico de migas de pan e indicadores de navegación sigue siendo el enfoque recomendado, ya que las soluciones de superposición complementan pero no sustituyen el marcado accesible fundamental.