Identify row and column headers for data tables.

(see guidelines for overcoming access barriers)

A screen reader can use the header information to identify what cell data is in relation to the row or column heading.

To include header information in the table use the <th> tag. The <th> tag replaces <td>. Using <th> means that the cell will be interpreted as a heading by adaptive technology. Visual browsers will interpret this usually as strong.

Example:

Identifying row and column headers:

IT333 - Peripherals classes Wednesdays term 1
Name	Students	Classroom
Barb	17	a.1
John	29	a.2
Jessica	25	a.3

Code for identifying row and column headers


<table summary = "This table depicts the classroom location, teacher
name and student numbers for The IT subject IT333 - Peripherals.">
<caption>IT333 - Peripherals classes Wednesdays term 1</caption>
<tr>
  <th id="t1"><p>Name</p></th>
  <th id="t2"><p>Students</p></th>
  <th id="t3"><p>Classroom</p></th>
</tr>
<tr>
  <td headers="t1"><p>Barb</p></td>
  <td headers="t2"><p>17</p></td>
  <td headers="t3"><p>a.1</p></td>
</tr>
<tr>
  <td headers="t1"><p>John</p></td>
  <td headers="t2"><p>29</p></td>
  <td headers="t3"><p>a.2</p></td>
</tr>
<tr>
  <td headers="t1"><p>Jessica</p></td>
  <td headers="t2"><p>25</p></td>
  <td headers="t3"><p>a.3</p></td>
</tr>
</table>