Tables

Tables that are used to present data in a column and row format must be appropriately marked up in the html. Include a caption tag for the whole table. Also identify row and column headers appropriately with <td> and <tr>.  Include a scope attribute to indicate column header or row header.

Here is an example:

<table>
<caption> Information Technology Student Worker Data</caption>
<tr>
<th scope="col">Student Name</th>
<th scope="col">Online ID</th>
<th scope="col">Major</th>
</tr>

<tr>
<td>Evelyn Baley</td>
<td>E123B456</td>
<td>Computer Science</td>
</tr>

<tr>
<td>Bradford Deiter</td>
<td>B987D654</td>
<td>Math</td>
</tr>
</table>

Without the appropriate markup, a screen reader would read the resulting table from left to right and line by line which would not make much sense, particularly in a large data table. With the markup, users of screen readers will hear the information presented in a logical way.

If you are using a table strictly for layout purposes and not to present tabular data, do not use the caption, table header, and scope markup described above but do know that the screen reader software will read it as people read a book, left to right and top down. Be aware that your layout might not make sense and consider using CSS rather than table html.