| Male 18-39 years | Male 40-65 years | Female 18-39 years | Female 40-65 years | |
|---|---|---|---|---|
| W. Germany | 37.5% | 48.9% | 32.5% | 42.8% |
| E. Germany | 34.8% | 43.6% | 29.5% | 40.7% |
With 6 scope attributes here is shown how the cells relate to each other. The headers refer to the columns while the
location information simply belongs to a row.
Why the caption element? It is true, that just another table row would have done the same job, visually. But this is all about structure.
The caption element can be identified and used by adaptive technology, while a table row is just a table row.
This is the markup I used:
<table summary="Here goes the description of the table's purpose and structure, mainly for non-visual media" frame="box">
<caption>Demographical values about (...whatever) </caption>
<tr>
<td></td>
<th scope="col">Male 18-39 years</th>
<th scope="col">Male 40-65 years</th>
<th scope="col">Female 18-39 years</th>
<th scope="col">Female 40-65 years</th>
</tr>
<tr>
<td scope="row">W. Germany</td>
<td>37.5%</td>
<td>48.9%</td>
<td>32.5%</td>
<td>42.8%</td>
</tr>
<tr>
<td scope="row">E. Germany</td>
<td>34.8%</td>
<td>43.6%</td>
<td>29.5%</td>
<td>40.7%</td>
</tr>
</table>