empty-table-header
Las celdas de encabezado de tabla no deben estar vacías
Comprueba que las celdas de encabezado de tabla (<th>, o cualquier elemento con role="columnheader"/"rowheader") tengan contenido de texto visible. Un encabezado nombrado únicamente mediante aria-label/aria-labelledby también se marca, ya que el soporte real de lectores de pantalla/navegadores para eso es inconsistente.
Ámbito de aplicación. Se aplica a los elementos <th> que no tienen un rol explícito en conflicto, además de cualquier elemento (sea o no un <th> nativo) cuyo rol se resuelve en columnheader o rowheader. El atributo role es una lista de reserva: su primer token conocido y no abstracto, sin distinguir mayúsculas de minúsculas, es el rol, por lo que role="foo columnheader" cuenta, y un <th role="foo"> (sin ningún token conocido) conserva su rol implícito de encabezado. Un <th> que reafirma explícitamente role="columnheader"/"rowheader" sigue cubierto, pero un <th role="presentation"> (que ya no es un encabezado) queda correctamente excluido, y un encabezado que solo existe por su rol ARIA (por ejemplo, un <div role="columnheader"> dentro de un widget role="grid"/role="table") también queda cubierto. Un elemento personalizado cuyos ElementInternals le dan el rol columnheader o rowheader (this.attachInternals().role), sin un atributo role que nombre otro, cuenta como lo hace un elemento nativo con ese rol.
Resultado esperado. La celda de encabezado tiene contenido de texto visible. Un <th> nombrado únicamente mediante aria-label/aria-labelledby (sin texto visible) TAMBIÉN se marca, no se trata como equivalente: el soporte de aria-label en <th> es inconsistente en la práctica. NVDA+Firefox e iOS VoiceOver+Safari lo ignoran por completo (solo se anuncia el texto visible), JAWS+Chrome/IE11 también anuncian únicamente el texto visible de la propia celda de encabezado. El texto visible es el único mecanismo confirmado que funciona en todas las combinaciones probadas. Véase https://html5accessibility.com/stuff/2024/05/22/not-so-short-note-on-aria-label-usage-big-table-edition/.
Qué informa un hallazgo.
ariaName(TABLE_HEADER_NAME_NOT_VISIBLE_TEXT): el nombre que la celda de encabezado obtiene dearia-labeloaria-labelledbyen lugar de un texto visible.
Estos campos de data.details ayudan a leer y reproducir un hallazgo. Salvo reasonCode y los pocos campos que Esquema de salida indica como estables, no son un contrato estable: un campo puede cambiar de nombre o desaparecer en una versión menor, así que no construyas sobre ellos.
Ejemplos
<table><tr><th>Name</th></tr></table>
La celda de encabezado tiene contenido de texto visible.
<table><tr><th></th></tr></table>
La celda de encabezado no tiene contenido de texto ni nombre accesible.
Cómo comprobarlo
Cuando esta regla no puede decidir, informa cantTell y deja la pregunta a una persona. Cada pregunta que puede plantear aparece aquí bajo su código de motivo, con los pasos para responderla. Un hallazgo lleva los mismos pasos en howToCheck, en el idioma del análisis. Consulta Esquema de salida.
TABLE_HEADER_EMPTY
- Localizar la celda de encabezado que indica el informe y observar lo que muestra en pantalla.
- Inspeccionarla en el panel Accesibilidad de las herramientas para desarrolladores del navegador y anotar su nombre calculado; una imagen con texto alternativo o un icono etiquetado en su interior pueden darle uno.
- Observar las celdas que hay debajo o al lado y decidir si necesitan un encabezado para entenderse.
- Si es la celda vacía de la esquina superior izquierda de una tabla cuya primera columna contiene encabezados de fila, tener en cuenta que no encabeza nada.
Se cumple. La celda tiene un nombre que describe su columna o su fila, o es una celda de esquina vacía que no encabeza datos (mejor aún si se marca como td).
No se cumple. La celda encabeza celdas de datos pero no tiene texto visible ni nombre, así que su columna o su fila no tiene encabezado, un incumplimiento de buena práctica para las celdas de encabezado de tabla.
TABLE_HEADER_NAME_NOT_VISIBLE_TEXT
- Localizar la celda de encabezado que indica el informe y leer el nombre que da el informe (de aria-label o aria-labelledby).
- Observar la celda en pantalla y confirmar que no muestra texto propio.
- Con un lector de pantalla, desplazarse por una celda de datos de esa columna o fila y escuchar si el nombre del encabezado se anuncia con ella.
Se cumple. El encabezado se anuncia con sus celdas de datos, o se da a la celda un texto visible (también sirve un texto oculto visualmente dentro de la celda) que expresa el mismo nombre.
No se cumple. El encabezado no tiene texto visible y depende de un nombre ARIA que no se anuncia con sus celdas de datos, un incumplimiento de buena práctica según las pautas sobre nombres accesibles.