Re: Complex Table Examples

2007/5/23, Laura Carlson:
>
> Couple more id/header examples "in the wild":

What's needed are table examples whose TH/TD relationships cannot be
expressed with scope="".
Of course, everything that can be expressed with scope="" can also be
expressed today with id/headers.

> -- Peter Weil <plweil@wisc.edu> wrote:
>
> > production examples can be found here:
> http://www.wisc.edu/about/facts/budget.php

The only thing that scope="" cannot express is the relationship from
the "Source" (id="source") and "Program" (id="program") to all the TDs
within the table (well, actually, you can do it using scope="colgroup"
because there's only one such group); but this actually brings
nothing: the cell probably should be empty instead…

You'll note that the first column contains TDs while they should be
THs (for example, data cells from the second column have no
relationship with the cells of the first column from the same row; in
the first table, we find at slot (2,3) <td headers="support state
source">  255.1 </td> and at slot (2,4) <td headers="support state
source">  151.8 </td>, can you tell me which one relates to <td
headers="state source">  General program appropriations </td> and
which one relates to <td headers="state source">  Specific purpose
</td>?)

You could rewrite the first table as follows:
<table id="budgetRev" class="dec234" summary="budget revenue by
source, amount, percentage change from previous year, and percentage
of all revenue">
  <caption> 2005–2006 Budget revenue by source </caption>
  <thead>
    <tr>
      <th scope="rowgroup"> Source </th>
      <th class="dec" abbr="amount"> Support (in millions of dollars) </th>
      <th class="dec" abbr="change"> % Change from previous year </th>
      <th class="dec" abbr="percentage"> % of all revenue </th>
    </tr>
  <tbody>
    <tr>
      <th scope="rowgroup" colspan="4">State revenue</th>
    </tr>
    <tr>
      <th>General Program appropriations</th>
      <td>255.1</td> <td> −1.7 </td> <td> 12 </td>
    </tr>
    <tr>
      <th> Specific purpose </td>
      <td> 151.8 </td> <td> 37.9 </td> <td> 7.2 </td>
    </tr>
    <tr class="total">
      <th>  Total state revenue </td>
      <td> 406.9 </td> <td> 10.1 </td> <td> 19.2 </td>
    </tr>
  </tbody>
  <tbody>
    <tr>
      <th scope="rowgroup" colspan="4">Other revenue sources</th>
    </tr>
    ...
  </tbody>
  <tbody>
    <tr class="total">
      <th>  Total All Revenue </td>
      <td> 2118.1 </td> <td> 11.6 </td> <td> 100 </td>
    </tr>
  </tbody>
</table>

The last <tbody> could be eventually a <tfoot>.

> -- Keith Parks <kparks@mail.sdsu.edu> wrote:
>
> > The site is still under construction, but the table is at the bottom
> > of this page...
> http://www.sa.sdsu.edu/annualreport/success.html

This is the exact same example.

-- 
Thomas Broyer

Received on Wednesday, 23 May 2007 13:32:49 UTC