Understanding Accessibility
by Vivienne Trulock
Users of this site also found these sites useful
Guideline 5. Create tables that transform gracefully.
Checkpoint 5.2 - For data tables that have two or more logical levels of row or column headers, use markup to associate data cells and header cells
How do I do it?
Use <THEAD> and <TBODY> to indicate the head and body areas of a data table. These tags surround the relevant table area as shown in the example. Table footers can also be identified with the <TFOOT> tag.
<THEAD>
<TR>
<TH>Module Name</TH>
<TH>Software</TH>
<TH>Hours per week</TH>
<TH>Tutor</TH>
</TR>
</THEAD>
<TBODY>
<TR>
<TD>Multimedia Principles</TD>
<TD>Macromedia Director</TD>
<TD>2</TD>
<TD>Vivienne Trulock</TD>
</TR>
<TR>
<TD>Professional Team Brief</TD>
<TD>Various</TD>
<TD>4</TD>
<TD>To be decided</TD>
</TR>
<TBODY>
</TABLE
The <colgroup> and <col> tags can be used along with styles to highlight particular columns in a table
<colgroup>
<col />
<col class="col2style" />
<col />
<col />
</colgroup>
<THEAD>
<TR>
<TH>Module Name</TH>
<TH>Software</TH>
<TH>Hours per week</TH>
<TH>Tutor</TH>
</TR>
</THEAD>
<TBODY>
<TR>
<TD>Multimedia Principles</TD>
<TD>Macromedia Director</TD>
<TD>2</TD>
<TD>Vivienne Trulock</TD>
</TR>
<TR>
<TD>Professional Team Brief</TD>
<TD>Various</TD>
<TD>4</TD>
<TD>To be decided</TD>
</TR>
<TBODY>
</TABLe>
How do I check that it meets the WCAG criteria?
This guideline only applies to data tables. Where a page has been identified as having no data tables, this check shall be deemed passed. Where a page has a data table with multiple headers correctly marked up with <THEAD>, <TFOOT>, <TBODY>, or <COLGROUP> and <COL> tags, and axis, scope and headers attributes the page shall be deemed to have passed. If a data table with multiple headers does not have the correct markup, it shall be deemed to have failed.
