In addition to a nice caption tag and summary attribute, you may know that a data table requires table header cells (TH) for the header rows and/or columns, and a scope attribute (see Web Axe episode 3, Data Tables). But what is there is more than one row of headers? This is called a complex table, and a different type of coding should be used.
Download Web Axe Episode 36 (Complex Data Tables)
A complex table:
- can have any number of rows as a set of headers and/or the first column as a set of headers
- can contain data rows in between the header rows
- uses the
idandheadersattributes
Links:
- The headers and ID attributes (WebAIM)
- Identifying rows and column information (W3C WCAG Techniques 5.1.2)
Sample code (modified from WebAIM):
| Name | Age | Birthday | |
|---|---|---|---|
| by birth | Jackie | 5 | April 5 |
| Beth | 8 | January 14 | |
| by marriage | Jenny | 12 | Feb 12 |
3 replies on “Podcast #36: Complex Data Tables”
Purely from an accessibility point of view, what happens in a situation where there are nested tables?
Or, would you consider that a failure on the part of the developer to have to use nested tables in the first place?
I’ve had to use nested tables before now for very complex product data (mechanical tolerances and tolerance ranges) and they look hideous…
Hello Wayne. You should never have nested data tables. I suggest trying the following: use header columns as well as header rows; separate your data in more than one table; simplify the content and put detailed information in hyperlinked pages.
Hi Dennis!
The tables in question where a representation of data from a printed document.
What I created with tables was an almost exact duplicate of the tables in the printed document.
I had a meeting with the client late last week and I did discuss this with them, but the fact of the matter is, while accessibility is a matter of course for anything I produce, the audience for their products is pretty well-defined.
You just don’t see physically or visually impaired mechanical engineers!
I know that sounds glib, but the clients customer demographics tell the story and the money has to follow that.
As I mentioned, the new website will be standards-compliant from the ground up, but I just needed some guidance on the tables situation.
Thanks for the input…