Issue 92

Summary

Summary: Replace too-simple and somewhat odd example table and verbose text unrelated to the table element, with one example table, derived from real world data that best demonstrates the table element. Refocus the text specifically on the table element.

Rationale

In the bug[1] related to this issue, the HTML5 Editor’s rationale for not make this change was:

Rationale: Given how bad the current situation is regarding authors providing explanatory text for tables, I think we should given them as much information as possible, in as many places as possible. We do AT users a disservice if we pretend that their needs aren’t important enough to include advice on how to best serve them in the spec.

The current table element section provides one very small and inadequate table example, with a great deal of prose basically telling people what to put in text surrounding the table. None of this prose is related to the purpose and interoperable use of the table or its child elements, and seemingly added to the section only as a way of justifying removing the summary attribute. I hate to use cliches, but this seems like a true case of the tail wagging the dog.

Throwing lots of irrelevant text at authors does not make the table element any clearer, or ensure they use the element in the proper way. What’s needed is a good, succinct example, with a clear explanation of the element, and the table’s only unique attribute, summary.

What people incorporate into the text surrounding an HTML table is not the business of the W3C HTML Working Group. Such over-specification only adds to the noise, and if you throw enough noise at people, all they’ll do is tune out the important bits.

The space would be better used by providing a table listing that uses all of the table child elements, demonstrating how the elements work together, and then providing a screenshot of the table. By creating a listing, people can see how the table is put together; the figure demonstrates the visual rendering of the table.

Details

Replace the existing table element description section with the following (replace the URL for the img element in the figure with one local to the W3C, image can be copied, link table model):

The table element represents data with more than one dimension, organized into non-empty columns and rows. It is the primary component of the table model.

Tables are used for data display, only, and should not be used for layout purposes. In particular, users of accessibility tools like screen readers are likely to find it difficult to navigate pages with tables used for layout.

The only unique attribute for the table element is the summary attribute. This attribute is optional, and should only be used with complex tables, in order to provide a visual description of the structure of the table—making the table easier to navigate when rendered non-visually. The summary may also include a brief description of the purpose of the table, if such purpose is visually apparent when viewing the entire table, but may not be apparent traversing the table, cell by cell. An example of a complex table is shown in Listing Table-1. Figure Table-1 is a visual rendering of the table.


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Example Table</title>
<style>
table
{
  border: 1px solid #ccc;
  border-collapse: collapse;
  margin: 0 20px;
}

td, th
{
  border: 1px solid #ccc;
  padding: 10px;
}

.female
{
  background-color: #ffc;
}

tfoot
{
  font-size: smaller;
}
</style>
</head>
<body>
<table summary="First row is column headers separated into year and degree programs 
                (bachelor, master, graduate). Each degree program is further split into 
                biology and technology fields on second line. Each topic field is separated into 
                male and female graduates on third row. Years are listed in first column.">

   <caption>
      <p>Degrees in the biological and biomedical sciences compared with degrees 
         in technology conferred by degree-granting institutions, by level of 
         degree and sex of student: Selected years, 2002-2007.
      </p>

   </caption>

   <colgroup span="1"></colgroup>
   <colgroup>
      <col class="male" />
      <col class="female" />
   </colgroup>
   <colgroup>
      <col class="male" />

      <col class="female" />
   </colgroup>
   <colgroup>
      <col class="male" />
      <col class="female" />
   </colgroup>
   <colgroup>
      <col class="male" />
      <col class="female" />

   </colgroup>
   <colgroup>
      <col class="male" />
      <col class="female" />
   </colgroup>
   <colgroup>
      <col class="male" />
      <col class="female" />
   </colgroup>

   <thead>
      <tr>
         <th rowspan="3">Year</th><th colspan="4">Bachelor's Degrees</th>
         <th colspan="4">Master's Degrees</th>
         <th colspan="4">Doctor's Degrees</th>
      </tr>

      <tr>
         <th colspan="2">Biology</th><th colspan="2">Technology</th>
         <th colspan="2">Biology</th><th colspan="2">Technology</th>
         <th colspan="2">Biology</th><th colspan="2">Technology</th></tr> 
      <tr>
         <th>Male</th><th>Female</th><th>Male</th><th>Female</th><th>Male</th><th>Female</th>

         <th>Male</th><th>Female</th><th>Male</th><th>Female</th><th>Male</th><th>Female</th>
      </tr>
   </thead>
   <tbody>
      <tr>
       <td>2002</td><td>22,918</td><td>37,186</td><td>41,950</td><td>15,483</td>

                    <td>2,981</td><td>4,009</td><td>13,267</td><td>6,242</td>
                    <td>2,804</td><td>2,289</td><td>648</td><td>168</td> 
      </tr>
      <tr>
       <td>2003</td><td>23,248</td><td>38,261</td><td>44,585</td><td>14,903</td>

                     <td>3,227</td><td>4,430</td><td>13,868</td><td>6,275</td>
                     <td>2,804</td><td>2,438</td><td>709</td><td>200</td> 
      </tr>
      <tr>
       <td>2004</td><td>24,617</td><td>39,994</td><td>42,125</td><td>11,986</td>

                    <td>3,318</td><td>4,881</td><td>13,136</td><td>5,280</td>
                    <td>2,845</td><td>2,733</td><td>905</td><td>214</td>
      </tr>
      <tr>
       <td>2005</td><td>26,651</td><td>42,527</td><td>37,705</td><td>9,775</td>

                    <td>3,654</td><td>5,027</td><td>12,470</td><td>4,585</td>
                    <td>2,933</td><td>2,842</td><td>1,109</td><td>307</td>
      </tr>
      <tr>
       <td>2006</td><td>29,951</td><td>45,200</td><td>34,342</td><td>7,828</td>

                    <td>3,568</td><td>5,179</td><td>11,985</td><td>4,247</td>
                    <td>3,221</td><td>3,133</td><td>1,267</td><td>328</td>
      </tr>
   </tbody>
  
   <tfoot>

      <tr>
         <td colspan="13">Data from Institution of Education Sciences National Center
                for Education Statistics, derived from two tables: 
                <a href="http://nces.ed.gov/programs/digest/d08/tables/dt08_298.asp">
                Table  298. Degrees in the biological and biomedical sciences conferred by degree-granting 
                institutions, by level of degree and sex of students; selected years, 1951-52 through 2006-07
                </a> and <a href="http://nces.ed.gov/programs/digest/d08/tables/dt08_302.asp">
                Table 302. Degrees in compueter and information sciences conferred by degree-granting 
                 institutions, by level of degree and sex of student: 1970–71 through 
                 2006–07</a></td>
      </tr>
   </tfoot>
</table>
</body>
</html>

For each of the table element children in the listing—tr, th, col, colgroup, caption, tbody, thead, tfoot—reference the existing example in Listing Table-1, and remove any other example table. One example should be sufficient to demonstrate all of the table model elements.

Though this is more related to Issue 32, it’s still relevant: remove the warning about the summary attribute, and remove the attribute from the “obsolete but conforming” section. We’ve beat this horse so much that it’s practically glue. Time to open the gates and let it loose. Time to move on to other things.

Impact

Positive Effects

Replaces an unbelievable table example, with one that is believable, using real data. In the spec, we should avoid contrived and made up examples, as much as possible, as they can undermine the credibility of the section, and distract from element(s) being demonstrated.

The change also clarifies the section and puts the focus back on the table element, rather than anything but. The example also demonstrates how to use all of the table elements, as well as making a correct use of the summary attribute. Linking all of the table child elements back to the table element section and the listing allows people to see how these elements are used, especially in context.

Negative Effects

Will take some of the editor’s time to make this change. The use of labels such as Listing Table-1 and Figure Table-1 may not fit it within the writing style of the rest of the specification (adjust as necessary). The listing is also a little large, though as a demonstration of a family of elements, not overly so.