Diferencia entre revisiones de «Principio 2/2.4 Navegable/2.4.5-C»

De WCAG Wiki
← Edición anterior
VisualWikitexto
Sin resumen de edición
Sin resumen de edición
 
(No se muestra una edición intermedia del mismo usuario)
Línea 7: Línea 7:
|wcag_principio=2_Operable
|wcag_principio=2_Operable
|wcag_principio_url=Principio_2
|wcag_principio_url=Principio_2
|wcag_pauta=2.4_Navegacion_clara
|wcag_pauta=2.4_Navegable
|wcag_pauta_url=Principio_2/2.4_Navegacion_clara
|wcag_pauta_url=Principio_2/2.4_Navegable
|wcag_grupo=Navegación
|wcag_grupo=Navegación
|wcag_subgrupo=Localización_de_contenido
|wcag_subgrupo=Localización_de_contenido
Línea 36: Línea 36:


|wcag_texto_criterioOAW=
|wcag_texto_criterioOAW=
En los documentos extensos, se debe proporcionar una tabla de contenidos con enlaces que permitan navegar directamente a las diferentes secciones del documento.
En los documentos extensos, se debe proporcionar una tabla de contenidos con enlaces a las diferentes secciones del documento.


|wcag_descripcion_resumida=
|wcag_descripcion_resumida=
Línea 49: Línea 49:
|wcag_referencias=
|wcag_referencias=
<ul>
<ul>
<li><span lang="en">W3C WCAG 2.2 – Success Criterion 2.4.5 Multiple Ways</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/general/G64 G64: Providing a Table of Contents]</span></li>
<li><span lang="en">Understanding 2.4.5: Multiple Ways (W3C)</span></li>
<li>Guía Técnica WCAG — Principio Operable (documento aportado)</li>
</ul>
</ul>


|wcag_recursos=
|wcag_recursos=
<strong> Consejos </strong>
<ul>
<ul>
<li>Patrones accesibles de tabla de contenidos</li>
<li>Patrones accesibles de tabla de contenidos</li>
Línea 65: Línea 64:
|wcag_pasos_evaluacion=
|wcag_pasos_evaluacion=
<ol class="paso-list">
<ol class="paso-list">
<li><span class="paso-badge">Paso 1.</span> Verificar que el documento es extenso (estructura compleja, varias secciones).</li>
<li><span class="paso-badge">Paso 1.</span>
<li><span class="paso-badge">Paso 2.</span> Comprobar que existe una tabla de contenidos o índice al inicio.</li>
Verificar que existe una tabla de contenidos a modo de índice.
<li><span class="paso-badge">Paso 3.</span> Confirmar que los enlaces llevan correctamente a las secciones correspondientes.</li>
</li>
<li><span class="paso-badge">Paso 4.</span> Revisar la estructura semántica (encabezados `<h1>`–`<h6>`, landmarks).</li>
 
<li><span class="paso-badge">Paso 5.</span> Evaluar con lector de pantalla para asegurar navegación clara entre secciones.</li>
<li><span class="paso-badge">Paso 2.</span>
Verificar que las entradas de la tabla de contenidos se corresponden con el nombre de las secciones del documento y en el mismo orden.
</li>
 
<li><span class="paso-badge">Paso 3.</span>
Verificar que los enlaces enlazan a las secciones correspondientes.
</li>
</ol>
</ol>


Línea 77: Línea 82:
|wcag_ejemplo_evaluacion=
|wcag_ejemplo_evaluacion=
<div class="accessibility-card">
<div class="accessibility-card">
<strong>✅ Ejemplo accesible: tabla de contenidos</strong>
Por ejemplo, todas las páginas de esta wiki contienen un "sumario" con las secciones importantes de la página.
 
 
Se incluye un ejemplo con codigo HTML que contiene una tabla de contenidos.
<pre class="wcag-codigo-html">
<pre class="wcag-codigo-html">
<nav aria-label="Tabla de contenidos">
<nav aria-label="Tabla de contenidos">
Línea 91: Línea 99:
|wcag_otras_herramientas_evaluacion=
|wcag_otras_herramientas_evaluacion=
<ul>
<ul>
<li>Validación manual de anclas internas</li>
<li>'''Revisión del documento''': comprobar que los documentos largos (p. ej., artículos, informes, guías, páginas con mucho contenido) incluyen una tabla de contenidos al inicio o accesible fácilmente.</li>
<li>Navegación por encabezados (H1-H6)</li>
<li>'''Inspección de enlaces''': verificar que la tabla de contenidos contiene enlaces que permiten saltar directamente a cada sección del documento.</li>
<li>JAWS, NVDA y VoiceOver</li>
<li>'''Estructura semántica''': confirmar que las secciones están marcadas con encabezados apropiados (<code>&lt;h1&gt;</code>, <code>&lt;h2&gt;</code>, <code>&lt;h3&gt;</code>) para permitir navegación estructural.</li>
<li>Scroll y navegación por teclado</li>
<li>'''Lectores de pantalla''': (NVDA, JAWS, VoiceOver) usar funciones de navegación por encabezados y lista de enlaces para comprobar que la tabla de contenidos es reconocida y operable.</li>
</ul>
</ul>
}}
}}

Revisión actual - 12:44 6 nov 2025

2.4.5-C. Tabla de contenidos en documentos extensos

Discapacidades afectadas

Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.

Enunciado del criterio (Observatorio de Accesibilidad Web)

  • En los documentos extensos, se debe proporcionar una tabla de contenidos con enlaces a las diferentes secciones del documento.

Comprensión del criterio

Descripción resumida

Los documentos largos deben incluir una tabla de contenidos o índice con enlaces internos que permitan saltar directamente a cada sección, facilitando la navegación y evitando desplazamientos largos.

Objetivo

Facilitar el acceso rápido y organizado a secciones específicas dentro de documentos extensos, reduciendo la carga cognitiva y mejorando la orientación en la lectura y navegación.

Importancia de cumplir el criterio

Sin una tabla de contenidos, los usuarios deben recorrer grandes cantidades de información para encontrar el contenido relevante. Esto puede generar desorientación, sobrecarga cognitiva y barreras para quienes dependen del teclado o lector de pantalla.

Referencias WCAG

Recursos de apoyo

Consejos
  • Patrones accesibles de tabla de contenidos
  • Uso de encabezados semánticos y landmarks
  • Anclas internas y navegación por secciones

Evaluación del criterio

Tipo de evaluación

Evaluación Manual

Procedimiento de evaluación

  1. Paso 1. Verificar que existe una tabla de contenidos a modo de índice.
  2. Paso 2. Verificar que las entradas de la tabla de contenidos se corresponden con el nombre de las secciones del documento y en el mismo orden.
  3. Paso 3. Verificar que los enlaces enlazan a las secciones correspondientes.

Resultado esperado

El documento ofrece una tabla de contenidos funcional que enlaza a todas las secciones principales, permitiendo navegación rápida y clara.

Ejemplo

Por ejemplo, todas las páginas de esta wiki contienen un "sumario" con las secciones importantes de la página.


Se incluye un ejemplo con codigo HTML que contiene una tabla de contenidos. 

<nav aria-label="Tabla de contenidos">
  <ul>
    <li><a href="#introduccion">Introducción</a></li>
    <li><a href="#capitulo1">Capítulo 1: Accesibilidad</a></li>
    <li><a href="#capitulo2">Capítulo 2: Diseño</a></li>
  </ul>
</nav>

Otras herramientas de evaluación

  • Revisión del documento: comprobar que los documentos largos (p. ej., artículos, informes, guías, páginas con mucho contenido) incluyen una tabla de contenidos al inicio o accesible fácilmente.
  • Inspección de enlaces: verificar que la tabla de contenidos contiene enlaces que permiten saltar directamente a cada sección del documento.
  • Estructura semántica: confirmar que las secciones están marcadas con encabezados apropiados (<h1>, <h2>, <h3>) para permitir navegación estructural.
  • Lectores de pantalla: (NVDA, JAWS, VoiceOver) usar funciones de navegación por encabezados y lista de enlaces para comprobar que la tabla de contenidos es reconocida y operable.










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 2.4.5-C. Tabla de contenidos en documentos extensos

Loading comments...




Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_2/2.4_Navegable/2.4.5-C&oldid=3731»