Diferencia entre revisiones de «Principio 1/1.3 Adaptable/1.3.1-K»

De WCAG Wiki
← Edición anteriorEdición siguiente →
VisualWikitexto
Sin resumen de edición
Sin resumen de edición
Línea 4: Línea 4:
|wcag_titulo_criterio=1.3.1-K. Evitar duplicar caption y summary
|wcag_titulo_criterio=1.3.1-K. Evitar duplicar caption y summary
|wcag_nivel=A
|wcag_nivel=A
|wcag_version=2.2
|wcag_version=2.0
|wcag_principio=1_Perceptible
|wcag_principio=1_Perceptible
|wcag_principio_url=Principio_1
|wcag_principio_url=Principio_1
Línea 30: Línea 30:


|wcag_texto_criterioOAW=
|wcag_texto_criterioOAW=
En las tablas de datos que contienen tanto el elemento <caption> como el atributo summary, el contenido de ambos no debe estar duplicado.
En las tablas de datos que contienen tanto el elemento <code><nowiki> <caption> </nowiki></code> como el atributo ''summary'', el contenido de ambos no debe estar duplicado.


|wcag_descripcion_resumida=
|wcag_descripcion_resumida=
Si una tabla incluye &lt;caption&gt; y el atributo `summary`, el texto de ambos no puede ser idéntico. El &lt;caption&gt; identifica la tabla y el `summary` describe su organización o cómo navegarla en caso de ser necesaria esa información.
Si una tabla incluye <code><nowiki> <caption> </nowiki></code> y el atributo ''summary'', el texto de ambos no puede ser idéntico.
<ul>
<li> <code><nowiki> <caption> </nowiki></code> identifica la tabla</li>
<li> ''summary'' describe su organización o cómo navegarla en caso de ser necesaria esa información</li>
</ul>


|wcag_objetivo=
|wcag_objetivo=
Línea 39: Línea 43:


|wcag_importancia=
|wcag_importancia=
La duplicación del título y del resumen causa experiencias repetitivas para usuarios de lectores de pantalla, afectando la comprensión y la eficiencia en la navegación. El &lt;caption&gt; es breve; el `summary` debe aportar un contexto diferente y funcional.
La duplicación del título y del resumen causa experiencias repetitivas para usuarios de lectores de pantalla, afectando la comprensión y la eficiencia en la navegación.
<ul>
<li> <code><nowiki> <caption> </nowiki></code> ha de ser breve</li>
<li> ''summary'' debe aportar un contexto diferente y funcional</li>
</ul>


|wcag_referencias=
|wcag_referencias=
<ul>
<ul>
<li>H73: Using the summary attribute to describe the organization of data tables</li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/html/H73 H73: Using the summary attribute to describe the organization of data tables]</span></li>
 
</ul>
</ul>


|wcag_recursos=
|wcag_recursos=
<strong> Consejos </strong>
<ul>
<ul>
<li>El atributo `summary` está obsoleto en HTML5, pero puede aparecer en contenido heredado</li>
<li>El atributo ''summary'' está obsoleto en HTML5, pero puede aparecer en contenido heredado</li>
<li>Usar &lt;caption&gt; para el título y descripción separada si es necesaria</li>
<li>Usar <code><nowiki> <caption> </nowiki></code> para el título y descripción separada si es necesaria</li>
</ul>
</ul>


<html>
<iframe width="100%" height="400"
        src="https://www.youtube.com/embed/8E4jh9qU_Js"
        title="Tabla accesible: diferencias entre caption y summary"
        frameborder="0"
        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
        allowfullscreen>
</iframe>
</html>


|wcag_tipo_evaluacion=Comprobación manual
|wcag_tipo_evaluacion=Manual


|wcag_pasos_evaluacion=
|wcag_pasos_evaluacion=
<ol class="paso-list">
<ol class="paso-list">
<li>Localizar tablas con &lt;caption&gt; y `summary`.</li>
<li><span class="paso-badge">Paso 1.</span>
<li>Revisar el contenido de ambos elementos.</li>
Localizar las tablas de datos que existan en la página.</li>
<li>Verificar que el `summary` aporta información adicional y no repite el &lt;caption&gt;.</li>
<li><span class="paso-badge">Paso 2.</span>  
Usando la herramienta de inspección de código del navegador, verificar que los atributos ''summary'' y la etiqueta <code><nowiki> <caption> </nowiki></code> no presentan contenidos duplicados.</li>
</ol>
</ol>


|wcag_resultado_evaluacion=
|wcag_resultado_evaluacion=
El contenido del &lt;caption&gt; y el `summary` no es idéntico. Cada uno cumple su función y aporta información distinta.
El contenido del <code><nowiki> <caption> </nowiki></code> y el ''summary'' no es idéntico. Cada uno cumple su función y aporta información distinta.


|wcag_ejemplo_evaluacion=
|wcag_ejemplo_evaluacion=
Ejemplo correcto:
<div class="accessibility-card">
 
Codigo HTML con etiquetas <code><nowiki> <caption> </nowiki></code> y atributo ''summary". El contenido de cada una corresponde a concretar los datos presentes en la tabla.
<pre class="wcag-codigo-html">
<pre class="wcag-codigo-html">
<table summary="Esta tabla resume las compras mensuales por departamento.">
<table summary="Esta tabla resume las compras mensuales por departamento.">
Línea 82: Línea 86:
</table>
</table>
</pre>
</pre>
 
</div>
Ejemplo incorrecto:
<pre class="wcag-codigo-html">
<table summary="Compras por mes y departamento">
<caption>Compras por mes y departamento</caption>
...
</table>
</pre>


|wcag_otras_herramientas_evaluacion=
|wcag_otras_herramientas_evaluacion=
<ul>
<ul>
<li>Inspección del navegador</li>
<li>'''Inspección del navegador''': comprobar el codigo fuente que hay en elementos tabla, comprobar el contenido de <code><nowiki> <caption> </nowiki></code> y ''summary'' si se ajustan a los datos de la tabla  </li>
<li>Lector de pantalla</li>
<li>'''Lector de pantalla''': (NVDA, JAWS, VoiceOver) Comprobar si se nombra un titulo y un resumen que corresponden al contenido de la información de la tabla.</li>
</ul>
</ul>


}}
}}

Revisión del 08:00 5 nov 2025

1.3.1-K. Evitar duplicar caption y summary

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 las tablas de datos que contienen tanto el elemento <caption> como el atributo summary, el contenido de ambos no debe estar duplicado.

Comprensión del criterio

Descripción resumida

Si una tabla incluye <caption> y el atributo summary, el texto de ambos no puede ser idéntico.
  • <caption> identifica la tabla
  • summary describe su organización o cómo navegarla en caso de ser necesaria esa información

Objetivo

Evitar que las tecnologías de apoyo anuncien información redundante, lo que puede provocar confusión y sobrecarga cognitiva. Cada elemento debe aportar información distinta y útil.

Importancia de cumplir el criterio

La duplicación del título y del resumen causa experiencias repetitivas para usuarios de lectores de pantalla, afectando la comprensión y la eficiencia en la navegación.
  • <caption> ha de ser breve
  • summary debe aportar un contexto diferente y funcional

Referencias WCAG

Recursos de apoyo

Consejos
  • El atributo summary está obsoleto en HTML5, pero puede aparecer en contenido heredado
  • Usar <caption> para el título y descripción separada si es necesaria

Evaluación del criterio

Tipo de evaluación

Evaluación Manual

Procedimiento de evaluación

  1. Paso 1. Localizar las tablas de datos que existan en la página.
  2. Paso 2. Usando la herramienta de inspección de código del navegador, verificar que los atributos summary y la etiqueta <caption> no presentan contenidos duplicados.

Resultado esperado

El contenido del <caption> y el summary no es idéntico. Cada uno cumple su función y aporta información distinta.

Ejemplo

Codigo HTML con etiquetas <caption> y atributo summary". El contenido de cada una corresponde a concretar los datos presentes en la tabla. 

<table summary="Esta tabla resume las compras mensuales por departamento.">
 <caption>Compras por mes y departamento</caption>
 ...
</table>

Otras herramientas de evaluación

  • Inspección del navegador: comprobar el codigo fuente que hay en elementos tabla, comprobar el contenido de <caption> y summary si se ajustan a los datos de la tabla
  • Lector de pantalla: (NVDA, JAWS, VoiceOver) Comprobar si se nombra un titulo y un resumen que corresponden al contenido de la información de la tabla.










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 1.3.1-K. Evitar duplicar caption y summary

Loading comments...




Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_1/1.3_Adaptable/1.3.1-K&oldid=3410»