[html5] r5978 - [e] (0) apply wg decision Fixing http://www.w3.org/Bugs/Public/show_bug.cgi?id=8449
whatwg at whatwg.org
whatwg at whatwg.org
Fri Apr 8 14:35:44 PDT 2011
Author: ianh
Date: 2011-04-08 14:35:42 -0700 (Fri, 08 Apr 2011)
New Revision: 5978
Modified:
complete.html
index
source
Log:
[e] (0) apply wg decision
Fixing http://www.w3.org/Bugs/Public/show_bug.cgi?id=8449
Modified: complete.html
===================================================================
--- complete.html 2011-04-08 20:17:41 UTC (rev 5977)
+++ complete.html 2011-04-08 21:35:42 UTC (rev 5978)
@@ -650,7 +650,9 @@
<li><a href=#dimension-attributes><span class=secno>4.8.17 </span>Dimension attributes</a></ol></li>
<li><a href=#tabular-data><span class=secno>4.9 </span>Tabular data</a>
<ol>
- <li><a href=#the-table-element><span class=secno>4.9.1 </span>The <code>table</code> element</a></li>
+ <li><a href=#the-table-element><span class=secno>4.9.1 </span>The <code>table</code> element</a>
+ <ol>
+ <li><a href=#table-descriptions-techniques><span class=secno>4.9.1.1 </span>Techniques for describing tables</a></ol></li>
<li><a href=#the-caption-element><span class=secno>4.9.2 </span>The <code>caption</code> element</a></li>
<li><a href=#the-colgroup-element><span class=secno>4.9.3 </span>The <code>colgroup</code> element</a></li>
<li><a href=#the-col-element><span class=secno>4.9.4 </span>The <code>col</code> element</a></li>
@@ -37162,185 +37164,14 @@
</div>
- <p>There are a variety of ways to include this information, such as:</p>
+ <p><a href=#table-descriptions-techniques>Guidance on how to
+ provide such information</a> is provided below.</p>
- <dl><dt>In prose, surrounding the table</dt>
-
- <dd>
- <div class=example><pre><p>In the following table, characteristics are given in the second
-column, with the negative side in the left column and the positive
-side in the right column.</p>
-<table>
- <caption>Characteristics with positive and negative sides</caption>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
-</table></pre></div>
- </dd>
-
- <dt>In the table's <code><a href=#the-caption-element>caption</a></code></dt>
-
- <dd>
- <div class=example><pre><table>
- <caption>
- <strong>Characteristics with positive and negative sides.</strong>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- </caption>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
-</table></pre></div>
- </dd>
-
- <dt>In the table's <code><a href=#the-caption-element>caption</a></code>, in a <code><a href=#the-details-element>details</a></code> element</dt>
-
- <dd>
- <div class=example><pre><table>
- <caption>
- <strong>Characteristics with positive and negative sides.</strong>
- <details>
- <summary>Help</summary>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- </details>
- </caption>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
-</table></pre></div>
- </dd>
-
- <dt>Next to the table, in the same <code><a href=#the-figure-element>figure</a></code></dt>
-
- <dd>
- <div class=example><pre><figure>
- <figcaption>Characteristics with positive and negative sides</figcaption>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- <table>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
- </table>
-</figure></pre></div>
- </dd>
-
- <dt>Next to the table, in a <code><a href=#the-figure-element>figure</a></code>'s <code><a href=#the-figcaption-element>figcaption</a></code></dt>
-
- <dd>
- <div class=example><pre><figure>
- <figcaption>
- <strong>Characteristics with positive and negative sides</strong>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- </figcaption>
- <table>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
- </table>
-</figure></pre></div>
- </dd>
-
- </dl><p>Authors may also use other techniques, or combinations of the
- above techniques, as appropriate.</p>
-
- <p>The best option, of course, rather than writing a description
- explaining the way the table is laid out, is to adjust the table
- such that no explanation is needed.</p>
-
- <div class=example>
-
- <p>In the case of the table used in the examples above, a simple
- rearrangement of the table so that the headers are on the top and
- left sides removes the need for an explanation as well as removing
- the need for the use of <code title=attr-tdth-headers><a href=#attr-tdth-headers>headers</a></code> attributes:</p>
-
- <pre><table>
- <caption>Characteristics with positive and negative sides</caption>
- <thead>
- <tr>
- <th> Characteristic
- <th> Negative
- <th> Positive
- <tbody>
- <tr>
- <th> Mood
- <td> Sad
- <td> Happy
- <tr>
- <th> Grade
- <td> Failing
- <td> Passing
-</table></pre>
-
- </div>
-
<p>The <dfn id=attr-table-summary title=attr-table-summary><code>summary</code></dfn>
attribute on <code><a href=#the-table-element>table</a></code> elements was suggested in earlier
versions of the language as a technique for providing explanatory
- text for complex tables for users of screen readers. One of the <a href=#table-descriptions>techniques</a> described <!--in the
- <code>table</code> section--> above should be used
+ text for complex tables for users of screen readers. One of the <a href=#table-descriptions-techniques>techniques</a> described
+ <!--in the <code>table</code> section--> below should be used
instead. <!--Authors should not specify the <code
title="attr-table-summary">summary</code> attribute on
<code>table</code> elements. --> <!-- 2.65% pages --></p>
@@ -37671,6 +37502,185 @@
</div>
+ <h5 id=table-descriptions-techniques><span class=secno>4.9.1.1 </span>Techniques for describing tables</h5>
+
+ <p>There are a variety of ways to include this information, such as:</p>
+
+ <dl><dt>In prose, surrounding the table</dt>
+
+ <dd>
+ <div class=example><pre><p>In the following table, characteristics are given in the second
+column, with the negative side in the left column and the positive
+side in the right column.</p>
+<table>
+ <caption>Characteristics with positive and negative sides</caption>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+</table></pre></div>
+ </dd>
+
+ <dt>In the table's <code><a href=#the-caption-element>caption</a></code></dt>
+
+ <dd>
+ <div class=example><pre><table>
+ <caption>
+ <strong>Characteristics with positive and negative sides.</strong>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ </caption>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+</table></pre></div>
+ </dd>
+
+ <dt>In the table's <code><a href=#the-caption-element>caption</a></code>, in a <code><a href=#the-details-element>details</a></code> element</dt>
+
+ <dd>
+ <div class=example><pre><table>
+ <caption>
+ <strong>Characteristics with positive and negative sides.</strong>
+ <details>
+ <summary>Help</summary>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ </details>
+ </caption>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+</table></pre></div>
+ </dd>
+
+ <dt>Next to the table, in the same <code><a href=#the-figure-element>figure</a></code></dt>
+
+ <dd>
+ <div class=example><pre><figure>
+ <figcaption>Characteristics with positive and negative sides</figcaption>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ <table>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+ </table>
+</figure></pre></div>
+ </dd>
+
+ <dt>Next to the table, in a <code><a href=#the-figure-element>figure</a></code>'s <code><a href=#the-figcaption-element>figcaption</a></code></dt>
+
+ <dd>
+ <div class=example><pre><figure>
+ <figcaption>
+ <strong>Characteristics with positive and negative sides</strong>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ </figcaption>
+ <table>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+ </table>
+</figure></pre></div>
+ </dd>
+
+ </dl><p>Authors may also use other techniques, or combinations of the
+ above techniques, as appropriate.</p>
+
+ <p>The best option, of course, rather than writing a description
+ explaining the way the table is laid out, is to adjust the table
+ such that no explanation is needed.</p>
+
+ <div class=example>
+
+ <p>In the case of the table used in the examples above, a simple
+ rearrangement of the table so that the headers are on the top and
+ left sides removes the need for an explanation as well as removing
+ the need for the use of <code title=attr-tdth-headers><a href=#attr-tdth-headers>headers</a></code> attributes:</p>
+
+ <pre><table>
+ <caption>Characteristics with positive and negative sides</caption>
+ <thead>
+ <tr>
+ <th> Characteristic
+ <th> Negative
+ <th> Positive
+ <tbody>
+ <tr>
+ <th> Mood
+ <td> Sad
+ <td> Happy
+ <tr>
+ <th> Grade
+ <td> Failing
+ <td> Passing
+</table></pre>
+
+ </div>
+
+
+
+
<h4 id=the-caption-element><span class=secno>4.9.2 </span>The <dfn><code>caption</code></dfn> element</h4>
<dl class=element><dt>Categories</dt>
Modified: index
===================================================================
--- index 2011-04-08 20:17:41 UTC (rev 5977)
+++ index 2011-04-08 21:35:42 UTC (rev 5978)
@@ -658,7 +658,9 @@
<li><a href=#dimension-attributes><span class=secno>4.8.17 </span>Dimension attributes</a></ol></li>
<li><a href=#tabular-data><span class=secno>4.9 </span>Tabular data</a>
<ol>
- <li><a href=#the-table-element><span class=secno>4.9.1 </span>The <code>table</code> element</a></li>
+ <li><a href=#the-table-element><span class=secno>4.9.1 </span>The <code>table</code> element</a>
+ <ol>
+ <li><a href=#table-descriptions-techniques><span class=secno>4.9.1.1 </span>Techniques for describing tables</a></ol></li>
<li><a href=#the-caption-element><span class=secno>4.9.2 </span>The <code>caption</code> element</a></li>
<li><a href=#the-colgroup-element><span class=secno>4.9.3 </span>The <code>colgroup</code> element</a></li>
<li><a href=#the-col-element><span class=secno>4.9.4 </span>The <code>col</code> element</a></li>
@@ -37146,185 +37148,14 @@
</div>
- <p>There are a variety of ways to include this information, such as:</p>
+ <p><a href=#table-descriptions-techniques>Guidance on how to
+ provide such information</a> is provided below.</p>
- <dl><dt>In prose, surrounding the table</dt>
-
- <dd>
- <div class=example><pre><p>In the following table, characteristics are given in the second
-column, with the negative side in the left column and the positive
-side in the right column.</p>
-<table>
- <caption>Characteristics with positive and negative sides</caption>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
-</table></pre></div>
- </dd>
-
- <dt>In the table's <code><a href=#the-caption-element>caption</a></code></dt>
-
- <dd>
- <div class=example><pre><table>
- <caption>
- <strong>Characteristics with positive and negative sides.</strong>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- </caption>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
-</table></pre></div>
- </dd>
-
- <dt>In the table's <code><a href=#the-caption-element>caption</a></code>, in a <code><a href=#the-details-element>details</a></code> element</dt>
-
- <dd>
- <div class=example><pre><table>
- <caption>
- <strong>Characteristics with positive and negative sides.</strong>
- <details>
- <summary>Help</summary>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- </details>
- </caption>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
-</table></pre></div>
- </dd>
-
- <dt>Next to the table, in the same <code><a href=#the-figure-element>figure</a></code></dt>
-
- <dd>
- <div class=example><pre><figure>
- <figcaption>Characteristics with positive and negative sides</figcaption>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- <table>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
- </table>
-</figure></pre></div>
- </dd>
-
- <dt>Next to the table, in a <code><a href=#the-figure-element>figure</a></code>'s <code><a href=#the-figcaption-element>figcaption</a></code></dt>
-
- <dd>
- <div class=example><pre><figure>
- <figcaption>
- <strong>Characteristics with positive and negative sides</strong>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- </figcaption>
- <table>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
- </table>
-</figure></pre></div>
- </dd>
-
- </dl><p>Authors may also use other techniques, or combinations of the
- above techniques, as appropriate.</p>
-
- <p>The best option, of course, rather than writing a description
- explaining the way the table is laid out, is to adjust the table
- such that no explanation is needed.</p>
-
- <div class=example>
-
- <p>In the case of the table used in the examples above, a simple
- rearrangement of the table so that the headers are on the top and
- left sides removes the need for an explanation as well as removing
- the need for the use of <code title=attr-tdth-headers><a href=#attr-tdth-headers>headers</a></code> attributes:</p>
-
- <pre><table>
- <caption>Characteristics with positive and negative sides</caption>
- <thead>
- <tr>
- <th> Characteristic
- <th> Negative
- <th> Positive
- <tbody>
- <tr>
- <th> Mood
- <td> Sad
- <td> Happy
- <tr>
- <th> Grade
- <td> Failing
- <td> Passing
-</table></pre>
-
- </div>
-
<p>The <dfn id=attr-table-summary title=attr-table-summary><code>summary</code></dfn>
attribute on <code><a href=#the-table-element>table</a></code> elements was suggested in earlier
versions of the language as a technique for providing explanatory
- text for complex tables for users of screen readers. One of the <a href=#table-descriptions>techniques</a> described <!--in the
- <code>table</code> section--> above should be used
+ text for complex tables for users of screen readers. One of the <a href=#table-descriptions-techniques>techniques</a> described
+ <!--in the <code>table</code> section--> below should be used
instead. <!--Authors should not specify the <code
title="attr-table-summary">summary</code> attribute on
<code>table</code> elements. --> <!-- 2.65% pages --></p>
@@ -37655,6 +37486,185 @@
</div>
+ <h5 id=table-descriptions-techniques><span class=secno>4.9.1.1 </span>Techniques for describing tables</h5>
+
+ <p>There are a variety of ways to include this information, such as:</p>
+
+ <dl><dt>In prose, surrounding the table</dt>
+
+ <dd>
+ <div class=example><pre><p>In the following table, characteristics are given in the second
+column, with the negative side in the left column and the positive
+side in the right column.</p>
+<table>
+ <caption>Characteristics with positive and negative sides</caption>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+</table></pre></div>
+ </dd>
+
+ <dt>In the table's <code><a href=#the-caption-element>caption</a></code></dt>
+
+ <dd>
+ <div class=example><pre><table>
+ <caption>
+ <strong>Characteristics with positive and negative sides.</strong>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ </caption>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+</table></pre></div>
+ </dd>
+
+ <dt>In the table's <code><a href=#the-caption-element>caption</a></code>, in a <code><a href=#the-details-element>details</a></code> element</dt>
+
+ <dd>
+ <div class=example><pre><table>
+ <caption>
+ <strong>Characteristics with positive and negative sides.</strong>
+ <details>
+ <summary>Help</summary>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ </details>
+ </caption>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+</table></pre></div>
+ </dd>
+
+ <dt>Next to the table, in the same <code><a href=#the-figure-element>figure</a></code></dt>
+
+ <dd>
+ <div class=example><pre><figure>
+ <figcaption>Characteristics with positive and negative sides</figcaption>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ <table>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+ </table>
+</figure></pre></div>
+ </dd>
+
+ <dt>Next to the table, in a <code><a href=#the-figure-element>figure</a></code>'s <code><a href=#the-figcaption-element>figcaption</a></code></dt>
+
+ <dd>
+ <div class=example><pre><figure>
+ <figcaption>
+ <strong>Characteristics with positive and negative sides</strong>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ </figcaption>
+ <table>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+ </table>
+</figure></pre></div>
+ </dd>
+
+ </dl><p>Authors may also use other techniques, or combinations of the
+ above techniques, as appropriate.</p>
+
+ <p>The best option, of course, rather than writing a description
+ explaining the way the table is laid out, is to adjust the table
+ such that no explanation is needed.</p>
+
+ <div class=example>
+
+ <p>In the case of the table used in the examples above, a simple
+ rearrangement of the table so that the headers are on the top and
+ left sides removes the need for an explanation as well as removing
+ the need for the use of <code title=attr-tdth-headers><a href=#attr-tdth-headers>headers</a></code> attributes:</p>
+
+ <pre><table>
+ <caption>Characteristics with positive and negative sides</caption>
+ <thead>
+ <tr>
+ <th> Characteristic
+ <th> Negative
+ <th> Positive
+ <tbody>
+ <tr>
+ <th> Mood
+ <td> Sad
+ <td> Happy
+ <tr>
+ <th> Grade
+ <td> Failing
+ <td> Passing
+</table></pre>
+
+ </div>
+
+
+
+
<h4 id=the-caption-element><span class=secno>4.9.2 </span>The <dfn><code>caption</code></dfn> element</h4>
<dl class=element><dt>Categories</dt>
Modified: source
===================================================================
--- source 2011-04-08 20:17:41 UTC (rev 5977)
+++ source 2011-04-08 21:35:42 UTC (rev 5978)
@@ -41132,191 +41132,15 @@
</div>
- <p>There are a variety of ways to include this information, such as:</p>
+ <p><a href="#table-descriptions-techniques">Guidance on how to
+ provide such information</a> is provided below.</p>
- <dl>
-
- <dt>In prose, surrounding the table</dt>
-
- <dd>
- <div class="example"><pre><p>In the following table, characteristics are given in the second
-column, with the negative side in the left column and the positive
-side in the right column.</p>
-<table>
- <caption>Characteristics with positive and negative sides</caption>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
-</table></pre></div>
- </dd>
-
- <dt>In the table's <code>caption</code></dt>
-
- <dd>
- <div class="example"><pre><table>
- <caption>
- <strong>Characteristics with positive and negative sides.</strong>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- </caption>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
-</table></pre></div>
- </dd>
-
- <dt>In the table's <code>caption</code>, in a <code>details</code> element</dt>
-
- <dd>
- <div class="example"><pre><table>
- <caption>
- <strong>Characteristics with positive and negative sides.</strong>
- <details>
- <summary>Help</summary>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- </details>
- </caption>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
-</table></pre></div>
- </dd>
-
- <dt>Next to the table, in the same <code>figure</code></dt>
-
- <dd>
- <div class="example"><pre><figure>
- <figcaption>Characteristics with positive and negative sides</figcaption>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- <table>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
- </table>
-</figure></pre></div>
- </dd>
-
- <dt>Next to the table, in a <code>figure</code>'s <code>figcaption</code></dt>
-
- <dd>
- <div class="example"><pre><figure>
- <figcaption>
- <strong>Characteristics with positive and negative sides</strong>
- <p>Characteristics are given in the second column, with the
- negative side in the left column and the positive side in the right
- column.</p>
- </figcaption>
- <table>
- <thead>
- <tr>
- <th id="n"> Negative
- <th> Characteristic
- <th> Positive
- <tbody>
- <tr>
- <td headers="n r1"> Sad
- <th id="r1"> Mood
- <td> Happy
- <tr>
- <td headers="n r2"> Failing
- <th id="r2"> Grade
- <td> Passing
- </table>
-</figure></pre></div>
- </dd>
-
- </dl>
-
- <p>Authors may also use other techniques, or combinations of the
- above techniques, as appropriate.</p>
-
- <p>The best option, of course, rather than writing a description
- explaining the way the table is laid out, is to adjust the table
- such that no explanation is needed.</p>
-
- <div class="example">
-
- <p>In the case of the table used in the examples above, a simple
- rearrangement of the table so that the headers are on the top and
- left sides removes the need for an explanation as well as removing
- the need for the use of <code
- title="attr-tdth-headers">headers</code> attributes:</p>
-
- <pre><table>
- <caption>Characteristics with positive and negative sides</caption>
- <thead>
- <tr>
- <th> Characteristic
- <th> Negative
- <th> Positive
- <tbody>
- <tr>
- <th> Mood
- <td> Sad
- <td> Happy
- <tr>
- <th> Grade
- <td> Failing
- <td> Passing
-</table></pre>
-
- </div>
-
<p>The <dfn title="attr-table-summary"><code>summary</code></dfn>
attribute on <code>table</code> elements was suggested in earlier
versions of the language as a technique for providing explanatory
text for complex tables for users of screen readers. One of the <a
- href="#table-descriptions">techniques</a> described <!--in the
- <code>table</code> section--> above should be used
+ href="#table-descriptions-techniques">techniques</a> described
+ <!--in the <code>table</code> section--> below should be used
instead. <!--Authors should not specify the <code
title="attr-table-summary">summary</code> attribute on
<code>table</code> elements. --> <!-- 2.65% pages --></p>
@@ -41676,6 +41500,190 @@
</div>
+ <h5 id="table-descriptions-techniques">Techniques for describing tables</h5>
+
+ <p>There are a variety of ways to include this information, such as:</p>
+
+ <dl>
+
+ <dt>In prose, surrounding the table</dt>
+
+ <dd>
+ <div class="example"><pre><p>In the following table, characteristics are given in the second
+column, with the negative side in the left column and the positive
+side in the right column.</p>
+<table>
+ <caption>Characteristics with positive and negative sides</caption>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+</table></pre></div>
+ </dd>
+
+ <dt>In the table's <code>caption</code></dt>
+
+ <dd>
+ <div class="example"><pre><table>
+ <caption>
+ <strong>Characteristics with positive and negative sides.</strong>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ </caption>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+</table></pre></div>
+ </dd>
+
+ <dt>In the table's <code>caption</code>, in a <code>details</code> element</dt>
+
+ <dd>
+ <div class="example"><pre><table>
+ <caption>
+ <strong>Characteristics with positive and negative sides.</strong>
+ <details>
+ <summary>Help</summary>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ </details>
+ </caption>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+</table></pre></div>
+ </dd>
+
+ <dt>Next to the table, in the same <code>figure</code></dt>
+
+ <dd>
+ <div class="example"><pre><figure>
+ <figcaption>Characteristics with positive and negative sides</figcaption>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ <table>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+ </table>
+</figure></pre></div>
+ </dd>
+
+ <dt>Next to the table, in a <code>figure</code>'s <code>figcaption</code></dt>
+
+ <dd>
+ <div class="example"><pre><figure>
+ <figcaption>
+ <strong>Characteristics with positive and negative sides</strong>
+ <p>Characteristics are given in the second column, with the
+ negative side in the left column and the positive side in the right
+ column.</p>
+ </figcaption>
+ <table>
+ <thead>
+ <tr>
+ <th id="n"> Negative
+ <th> Characteristic
+ <th> Positive
+ <tbody>
+ <tr>
+ <td headers="n r1"> Sad
+ <th id="r1"> Mood
+ <td> Happy
+ <tr>
+ <td headers="n r2"> Failing
+ <th id="r2"> Grade
+ <td> Passing
+ </table>
+</figure></pre></div>
+ </dd>
+
+ </dl>
+
+ <p>Authors may also use other techniques, or combinations of the
+ above techniques, as appropriate.</p>
+
+ <p>The best option, of course, rather than writing a description
+ explaining the way the table is laid out, is to adjust the table
+ such that no explanation is needed.</p>
+
+ <div class="example">
+
+ <p>In the case of the table used in the examples above, a simple
+ rearrangement of the table so that the headers are on the top and
+ left sides removes the need for an explanation as well as removing
+ the need for the use of <code
+ title="attr-tdth-headers">headers</code> attributes:</p>
+
+ <pre><table>
+ <caption>Characteristics with positive and negative sides</caption>
+ <thead>
+ <tr>
+ <th> Characteristic
+ <th> Negative
+ <th> Positive
+ <tbody>
+ <tr>
+ <th> Mood
+ <td> Sad
+ <td> Happy
+ <tr>
+ <th> Grade
+ <td> Failing
+ <td> Passing
+</table></pre>
+
+ </div>
+
+
+
+
<h4>The <dfn><code>caption</code></dfn> element</h4>
<dl class="element">
More information about the Commit-Watchers
mailing list