United States Department of Veterans Affairs
VHA Office of Health Information

Training for Testing HTML for 508 Compliance

Page 2 of 5

Testing for §1194.22 (g): Data Table (Headers)

Back Next

Example

Simple data table in browser window with four columns and four rows.

In the example image above a simple data table is displayed. The cell at the top of each column is defined with the <th> tag. All other cells are defined with the <td> tag. This allows Assistive Technologies (AT), like screen readers, to properly associate each cell with the proper column header.

In the example above, the table contains row names as well as column headers. In order to allow a screen reader user to read the row names together with the data contained in each cell, the row names should be enclosed within <th> </th> tags.

Here is a code snippet to help you understand the example above:

<html>
<body>
<table>
<tr>
<th>State</th>
<th>Discovered</th>
<th>Became State</th>
<th>Order of State</th>
</tr>
<tr>
<td>Virginia</td>
<td>1607</td>
<td>1788</td>
<td>10</td>
<tr>
<tr>
<td>Massachusetts</td>
<td>1620</td>
<td>1788</td>
<td>6</td>
<tr>
<tr>
<td>New Hampshire</td>
<td>1623</td>
<td>1788</td>
<td>9</td>
<tr>
</table>
</body>
</html>

Now continue to Testing with AT.

Glossary in new window Resources in new window   Back Next