MEP-0012

Table Header Cells

This page proposes adding a th element for use in tables instead of the td element for cells that function as headers.

Authors:

Shaun McCance

Created:

2018-03-01

Status:

final (2019-01-31)

Target:

1.1

Issue:

https://github.com/projectmallard/projectmallard.org/issues/9

History:

show history

hide history

history

2018-03-01	1.1	proposed
2018-03-08	1.1	implemented
2019-01-31	1.1	final

Background

Mallard tables mostly mimic HTML tables for layout purposes, with some simplifications for table styling. Notably absent from Mallard tables, however, is the th element. The th element is important to screen readers and other assistive technologies, as it can help to convey information that is otherwise only discernable from visual presentation.

Proposal

This page proposes adding the th element. This element would be allowed wherever the td element is allowed, and would effectively function the same as a td element for layout purposes. The th element would accept the same attributes as the td attribute, including those for row and column spanning. In addition, the th element should accept the scope attribute, with the same definition as in HTML.

The scope attribute helps to identify which group of table cells the th element applies to. It is generally not necessary when the th element is in the first row (applying to the column), or in the first position in a row (applying to the row). It is useful when a th element applies to entire row groups or column groups.

Note that HTML also provides the headers attribute to identify which th elements correspond to which td elements in cases even more complex than those that can be handled with the scope attribute. This proposal does include adding the headers attribute, in part because such complex tables are rare, and in part because Mallard is stricter than HTML concerning id attributes.

Examples

Use th elements for column headers:

<table>
  <tr>
    <td></td>                <th><p>Scientific name</p></th>
    <th><p>Length</p></th>   <th><p>Mass</p></th>
  </tr>
  <tr>
    <td><p>Mallard</p></td>  <td><p>Anas platyrhynchos</p></td>
    <td><p>56-65 cm</p></td> <td><p>900-1200 g</p></td>
  </tr>
  <tr>
    <td><p>Eurasian Wigeon</p></td> <td><p>Anas penelope</p></td>
    <td><p>45-50 cm</p></td>        <td><p>680 g</p></td>
  </tr>
  <tr>
    <td><p>Common Teal</p></td> <td><p>Anas crecca</p></td>
    <td><p>34-43 cm</p></td>    <td><p>360 g</p></td>
  </tr>
  <tr>
    <td><p>Northern Pintail</p></td> <td><p>Anas acuta</p></td>
    <td><p>59-76 cm</p></td>         <td><p>450-1360 g</p></td>
  </tr>
</table>

	Scientific name	Length	Mass
Mallard	Anas platyrhynchos	56-65 cm	900-1200 g
Eurasian Wigeon	Anas penelope	45-50 cm	680 g
Common Teal	Anas crecca	34-43 cm	360 g
Northern Pintail	Anas acuta	59-76 cm	450-1360 g

Use th elements for column and row headers:

<table>
  <tr>
    <td></td>                <th><p>Scientific name</p></th>
    <th><p>Length</p></th>   <th><p>Mass</p></th>
  </tr>
  <tr>
    <th><p>Mallard</p></th>  <td><p>Anas platyrhynchos</p></td>
    <td><p>56-65 cm</p></td> <td><p>900-1200 g</p></td>
  </tr>
  <tr>
    <th><p>Eurasian Wigeon</p></th> <td><p>Anas penelope</p></td>
    <td><p>45-50 cm</p></td>        <td><p>680 g</p></td>
  </tr>
  <tr>
    <th><p>Common Teal</p></th> <td><p>Anas crecca</p></td>
    <td><p>34-43 cm</p></td>    <td><p>360 g</p></td>
  </tr>
  <tr>
    <th><p>Northern Pintail</p></th> <td><p>Anas acuta</p></td>
    <td><p>59-76 cm</p></td>         <td><p>450-1360 g</p></td>
  </tr>
</table>

	Scientific name	Length	Mass
Mallard	Anas platyrhynchos	56-65 cm	900-1200 g
Eurasian Wigeon	Anas penelope	45-50 cm	680 g
Common Teal	Anas crecca	34-43 cm	360 g
Northern Pintail	Anas acuta	59-76 cm	450-1360 g

Add a th element for a column group:

<table rules="colgroups">
  <colgroup><col/></colgroup>
  <colgroup><col/></colgroup>
  <colgroup><col/><col/></colgroup>
  <tr>
    <td></td> <td></td>
    <th colspan="2" scope="colgroup"><p>Size information</p></th>
  </tr>
  <tr>
    <td></td>                <th><p>Scientific name</p></th>
    <th><p>Length</p></th>   <th><p>Mass</p></th>
  </tr>
  <tr>
    <th><p>Mallard</p></th>  <td><p>Anas platyrhynchos</p></td>
    <td><p>56-65 cm</p></td> <td><p>900-1200 g</p></td>
  </tr>
  <tr>
    <th><p>Eurasian Wigeon</p></th> <td><p>Anas penelope</p></td>
    <td><p>45-50 cm</p></td>        <td><p>680 g</p></td>
  </tr>
  <tr>
    <th><p>Common Teal</p></th> <td><p>Anas crecca</p></td>
    <td><p>34-43 cm</p></td>    <td><p>360 g</p></td>
  </tr>
  <tr>
    <th><p>Northern Pintail</p></th> <td><p>Anas acuta</p></td>
    <td><p>59-76 cm</p></td>         <td><p>450-1360 g</p></td>
  </tr>
</table>

		Size information
	Scientific name	Length	Mass
Mallard	Anas platyrhynchos	56-65 cm	900-1200 g
Eurasian Wigeon	Anas penelope	45-50 cm	680 g
Common Teal	Anas crecca	34-43 cm	360 g
Northern Pintail	Anas acuta	59-76 cm	450-1360 g

Add th elements for row groups:

<table rules="rowgroups" shade="rows">
  <thead>
    <tr>
      <td></td>                <th><p>Scientific name</p></th>
      <th><p>Length</p></th>   <th><p>Mass</p></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th colspan="4" scope="rowgroup">
        <p>America, Europe, Asia, New Zealand</p>
      </th>
    </tr>
    <tr>
      <th><p>Mallard</p></th>  <td><p>Anas platyrhynchos</p></td>
      <td><p>56-65 cm</p></td> <td><p>900-1200 g</p></td>
    </tr>
  </tbody>
  <tbody>
    <tr>
      <th colspan="4" scope="rowgroup">
        <p>Eurasia</p>
      </th>
    </tr>
    <tr>
      <th><p>Eurasian Wigeon</p></th> <td><p>Anas penelope</p></td>
      <td><p>45-50 cm</p></td>        <td><p>680 g</p></td>
    </tr>
    <tr>
      <th><p>Common Teal</p></th> <td><p>Anas crecca</p></td>
      <td><p>34-43 cm</p></td>    <td><p>360 g</p></td>
    </tr>
  </tbody>
  <tbody>
    <tr>
      <th colspan="4" scope="rowgroup">
        <p>Europe, Asia, North America</p>
      </th>
    </tr>
    <tr>
      <th><p>Northern Pintail</p></th> <td><p>Anas acuta</p></td>
      <td><p>59-76 cm</p></td>         <td><p>450-1360 g</p></td>
    </tr>
  </tbody>
</table>

America, Europe, Asia, New Zealand
	Scientific name	Length	Mass
Mallard	Anas platyrhynchos	56-65 cm	900-1200 g
Eurasia
Eurasian Wigeon	Anas penelope	45-50 cm	680 g
Common Teal	Anas crecca	34-43 cm	360 g
Europe, Asia, North America
Northern Pintail	Anas acuta	59-76 cm	450-1360 g

Compatibility and Fallback

This proposal makes no backwards-incompatible changes. Any page written in a version prior to the implementation of this proposal will work exactly the same in a processing tool that implements this proposal.

This proposal adds a new element in a context with no defined behavior for unknown elements. The likely fallback behavior on non-supporting tools is that th elements will be ignored entirely. Depending on how consistently th elements are used, this could result in some rows or columns being misaligned. Do not use the th element if your documents must be processed by older tools.

Although non-standard, the Yelp stylesheets have supported the th element in the core Mallard namespace since version 3.16 in 2015, although notably without support for the scope attribute.

Comparison to Other Formats

The proposed Mallard th element works similarly to the HTML th element, since Mallard tables work similarly to HTML tables.

DocBook allows both HTML tables and CALS tables. When using HTML tables, DocBook allows the th element with the same meaning. CALS tables do not have an element similar to the th element. However, DocBook appears to have extended CALS tables to allow the scope and headers elements on the entry element, possibly to allow that element to function as a header.

DITA uses CALS tables, which do not have an element similar to the th element.