What you need to know to make your table accessible. This means your tabular data table, of course, since we’re no longer using tables for layout, right? Dennis covers summary, caption, th, scope and abbr.
W3C techniques on row and column information
Sample code:
| State Name | Average Temperature | Average Humidity |
|---|---|---|
| Alabama | 50 | 50 |
| Alaska | 50 | 50 |
4 replies on “Data Tables”
Good show and HTML snippet shown. I find that W3 table link you provided is a great read! Yes, all should read it just to get a feel of how tabular data is read off.
Most wonder, or may hate, getting these things done for screenreaders but it doesn’t end with screenreaders. As the web more and more get aggregated and content gets re-rendered/re-purposed or stripped from sites, those apps may utilize accessible code to its’ advantage. Who says Google can’t have a table-reader that renders table data like the text example the W3 shows.
I doubt I made sense since I ramble, but everyone – just do it, it won’t hurt and will give your content a golden touch.
Yes, in addition to accessibility, it’s also about “the semantic web”. And people who don’t like doing these litte extra things, in my opinion, are just afraid to learn or afraid of change. And they surely won’t be doing web coding in the (near?) future.
Thanks so much for your podcast, I just found it.
My question is, how can you handle complex data entry tables — multiple header lines, some with rowspan and colspan, multiple summary rows, etc.
It’s tough to find an example that’s complex like that. I ended up using the header element, some of the td’s had 5 header elements. Maybe there are better options?
— a ColdFusion programmer
Good question Splash. Your referring to a multidimension axis, which uses the ID attribute, and is much more time consuming to do. I’m not aware of any applications that do it easily, so if anyone knows, please let us know! Here are a couple references on how to do it though:
WebAim
W3C