Básicamente, los elementos HTML disponibles para definir tablas son elementos semánticos.
Así, por ejemplo, los navegadores (y otros agentes de usuario, como los lectores de pantalla) reconocerán directamente por el elemento que un elemento
es en realidad una tabla. Del mismo modo reconocen el encabezado de una tabla por el elemento . Sin embargo, incluso con tablas, además del correcto uso de las correspondientes HTML elementos, conviene considerar algunos aspectos adicionales en materia de accesibilidad.Primero, debe encerrar los encabezados de las tablas en un elemento
circundante (una excepción se discutirá en breve) y rodear las filas individuales (los registros de datos representados en el cuerpo de la tabla) con un elemento . Además, opcionalmente puede agregar un pie de página a la tabla usando el elemento .
A continuación se muestra código HTML para definir una tabla accesible. Esto incluye el elemento
, no se pueden “agrupar” usando un elemento . Entonces, en este caso, omitir el elemento está bien (la excepción mencionada anteriormente).Puede encontrar más información sobre la construcción accesible de mesas en el sitio web WAI del W3C, específicamente en https://www.w3.org/WAI/tutorials/tables/. También encontrará información útil sobre lo que debe considerar con los encabezados de tablas anidadas.
Nota del editor: esta publicación ha sido adaptada de una sección del libro. Desarrollo web Full Stack: la guía completa por Philip Ackermann.
Calle Eloy Gonzalo, 27
Madrid, Madrid.
Código Postal 28010
Paseo de la Reforma 26
Colonia Juárez, Cuauhtémoc
Ciudad de México 06600
Real Cariari
Autopista General Cañas,
San José, SJ 40104
Av. Jorge Basadre 349
San Isidro
Lima, LIM 15073
y una fila de una tabla por el elemento |
---|