If i define a <thead>
like this:
<thead>
<tr>
<th colspan=3>Category 1</th>
<th colspan=2>Category 2</th>
</tr>
<tr>
<th>Sub-cat 1</th>
<th>Sub-cat 2</th>
<th>Sub-cat 3</th>
<th>Sub-cat 4</th>
<th>Sub-cat 5</th>
</tr>
</thead>
Does this structure semantically separate the categories/sub-categories correctly?
I know that visually it will look good, but I am unsure how this would look to a screen reader or to W3C specs in general.
Browsers can use thead
, tbody
, tfooter
to enable scrolling of the table body independently of the header and footer. Also, when printing a large table that spans multiple pages, thead
, tbody
, tfooter
elements can enable the table header and footer to be printed at the top and bottom of each page. See this for more info: http://www.w3schools.com/tags/tag_thead.asp