Universal Design for Web Applications

Headings and Data

HTML has two elements for table cells: th and td. th indicates a row or column heading, whereas td marks the cell as data (td = table data, th = table heading). In some cases, a cell is both a heading and data (we’ll talk more about that when we get into complex tables). Let’s start with simple tables.

Simple tables generally have a one-to-many relationship between each heading and its children cells—in other words, no heading spans more than one column or row and none of its children are subheadings. The table shown in Figure 6-1 is a simple table because there is only one row of headings (“Attribute” and “Description”) and each heading applies to all of the cells in its column.

Figure 6-1. Example of a simple table

Caption

A caption is a title—a short phrase that summarizes the contents of the table.

<table>
  <caption>Attributes highlighted in Universal
Design</caption>
    <tr>
      <th>Attribute</th>
      <th>Description</th>
    </tr>
    <tr>
      <td>summary</td>
      <td>description of the structure of a table</td>
    </tr>
    ...
    </tr>
</table>