Blog what I write

scope y headers en tablas para mejorar la accesibilidad

post - - leave a reply -

Lamentablemente estos dos atributos (scope, headers) son dos grandes olvidados a la hora de diseñar una tabla.

Su función consiste en relacionar las celdas de los encabezados con las celdas que contienen los datos, algo especialmente importante en cuanto a la accesibilidad. Con el uso de estos atributos lograremos que un lector de pantalla pueda acceder e interpretar correctamente la información de la tabla.

El atributo scope podemos usarlo especialmente en tablas sencillas y en los encabezamientos th. Su misión será indicar el conjunto de celdas para las que el encabezado proporciona información.

El atributo headers cumple la misma misión pero de una forma más especifica, por ello es mejor reservarlo para tablas complejas.
Este atributo se usa en las propias celdas td y como valor del atributo tenemos que especificar el ID del encabezamiento que deseamos asociar.

Para ver todo esto en detalle hay un post muy bueno titulado Accessible Data Tables de Roger Hudson.