[a] (2) Elaborate on <strong>'s semantics, add new examples.

Affected topics: HTML git-svn-id: http://svn.whatwg.org/webapps@8326 340c8d12-0b0e-0410-8428-c7bf67bfef74
whatwg · Dec 3, 2013 · a140db3 · a140db3
1 parent f7b1c4c
commit a140db3
Show file tree

Hide file tree

Showing 3 changed files with 165 additions and 3 deletions.
diff --git a/complete.html b/complete.html
@@ -17712,7 +17712,23 @@ <h4 id=the-strong-element><span class=secno>4.5.3 </span>The <dfn><code>strong</
    <dd><a href=#global-attributes>Global attributes</a></dd>
    <dt><a href=#element-dfn-dom title=element-dfn-dom>DOM interface</a>:</dt><!--TOPIC:DOM APIs-->
    <dd>Uses <code><a href=#htmlelement>HTMLElement</a></code>.</dd>
-  </dl><!--TOPIC:HTML--><p>The <code><a href=#the-strong-element>strong</a></code> element <a href=#represents>represents</a> strong importance for its contents.</p>
+  </dl><!--TOPIC:HTML--><p>The <code><a href=#the-strong-element>strong</a></code> element <a href=#represents>represents</a> strong importance, seriousness, or
+  urgency for its contents.</p>
+
+  <p><strong>Importance</strong>: The <code><a href=#the-strong-element>strong</a></code> element can be used in a heading, caption,
+  or paragraph to distinguish the part that really matters from other parts of the that might be
+  more detailed, more jovial, or merely boilerplate. (This is distinct from marking up subheadings,
+  for which the <code><a href=#the-hgroup-element>hgroup</a></code> element is appropriate.)</p>
+
+  <p class=example>For example, the first word of the previous paragraph is marked up with
+  <code><a href=#the-strong-element>strong</a></code> to distinguish it from the more detailed text in the rest of the
+  paragraph.</p>
+
+  <p><strong>Seriousness</strong>: The <code><a href=#the-strong-element>strong</a></code> element can be used to mark up a warning
+  or caution notice.</p>
+
+  <p><strong>Urgency</strong>: The <code><a href=#the-strong-element>strong</a></code> element can be used to denote contents that
+  the user needs to see sooner than other parts of the document.</p>
 
   <p>The relative level of importance of a piece of content is given by its number of ancestor
   <code><a href=#the-strong-element>strong</a></code> elements; each <code><a href=#the-strong-element>strong</a></code> element increases the importance of its
@@ -17721,6 +17737,28 @@ <h4 id=the-strong-element><span class=secno>4.5.3 </span>The <dfn><code>strong</
   <p>Changing the importance of a piece of text with the <code><a href=#the-strong-element>strong</a></code> element does not change
   the meaning of the sentence.</p>
 
+  <div class=example>
+
+   <p>Here, the word "chapter" and the actual chapter number are mere boilerplate, and the actual
+   name of the chapter is marked up with <code><a href=#the-strong-element>strong</a></code>:</p>
+
+   <pre>&lt;h1&gt;Chapter 1: &lt;strong&gt;The Praxis&lt;/strong&gt;&lt;/h1&gt;</pre>
+
+   <p>In the following example, the name of the diagram in the caption is marked up with
+   <code><a href=#the-strong-element>strong</a></code>, to distinguish it from boilerplate text (before) and the description
+   (after):</p>
+
+   <pre>&lt;figcaption&gt;Figure 1. &lt;strong&gt;Ant colony dynamics&lt;/strong&gt;. The ants in this colony are
+affected by the heat source (upper left) and the food source (lower right).&lt;/figcaption&gt;</pre>
+
+   <p>In this example, the heading is really "Flowers, Bees, and Honey", but the author has added a
+   light-hearted addition to the heading. The <code><a href=#the-strong-element>strong</a></code> element is thus used to mark up
+   the first part to distinguish it from the latter part.</p>
+
+   <pre>&lt;h1&gt;&lt;strong&gt;Flowers, Bees, and Honey&lt;/strong&gt; and other things I don't understand&lt;/h1&gt;</pre>
+
+  </div>
+
   <div class=example>
    <p>Here is an example of a warning notice in a game, with the
    various parts marked up according to how important they are:</p>
@@ -17732,6 +17770,21 @@ <h4 id=the-strong-element><span class=secno>4.5.3 </span>The <dfn><code>strong</
 ten meters.&lt;/strong&gt;&lt;/strong&gt; You have been warned.&lt;/p&gt;</pre>
   </div>
 
+  <div class=example>
+
+   <p>In this example, the <code><a href=#the-strong-element>strong</a></code> element is used to denote the part of the text that
+   the user is intended to read first.</p>
+
+   <pre>&lt;p&gt;Welcome to Remy, the reminder system.&lt;/p&gt;
+&lt;p&gt;Your tasks for today:&lt;/p&gt;
+&lt;ul&gt;
+ &lt;li&gt;&lt;p&gt;&lt;strong&gt;Turn off the oven.&lt;/strong&gt;&lt;/p&gt;&lt;/li&gt;
+ &lt;li&gt;&lt;p&gt;Put out the trash.&lt;/p&gt;&lt;/li&gt;
+ &lt;li&gt;&lt;p&gt;Do the laundry.&lt;/p&gt;&lt;/li&gt;
+&lt;/ul&gt;</pre>
+
+  </div>
+
 
   <h4 id=the-small-element><span class=secno>4.5.4 </span>The <dfn><code>small</code></dfn> element</h4>
 
@@ -102054,6 +102107,7 @@ <h2 class=no-num id=references>References</h2><!--REFS-->
   Michael Powers,
   Michael Rakowski,
   Michael(tm) Smith,
+  Michael Walmsley,
   Michal Zalewski,
   Michel Fortin,
   Michelangelo De Simone,

diff --git a/index b/index
@@ -17712,7 +17712,23 @@ included with Exhibit B.
    <dd><a href=#global-attributes>Global attributes</a></dd>
    <dt><a href=#element-dfn-dom title=element-dfn-dom>DOM interface</a>:</dt><!--TOPIC:DOM APIs-->
    <dd>Uses <code><a href=#htmlelement>HTMLElement</a></code>.</dd>
-  </dl><!--TOPIC:HTML--><p>The <code><a href=#the-strong-element>strong</a></code> element <a href=#represents>represents</a> strong importance for its contents.</p>
+  </dl><!--TOPIC:HTML--><p>The <code><a href=#the-strong-element>strong</a></code> element <a href=#represents>represents</a> strong importance, seriousness, or
+  urgency for its contents.</p>
+
+  <p><strong>Importance</strong>: The <code><a href=#the-strong-element>strong</a></code> element can be used in a heading, caption,
+  or paragraph to distinguish the part that really matters from other parts of the that might be
+  more detailed, more jovial, or merely boilerplate. (This is distinct from marking up subheadings,
+  for which the <code><a href=#the-hgroup-element>hgroup</a></code> element is appropriate.)</p>
+
+  <p class=example>For example, the first word of the previous paragraph is marked up with
+  <code><a href=#the-strong-element>strong</a></code> to distinguish it from the more detailed text in the rest of the
+  paragraph.</p>
+
+  <p><strong>Seriousness</strong>: The <code><a href=#the-strong-element>strong</a></code> element can be used to mark up a warning
+  or caution notice.</p>
+
+  <p><strong>Urgency</strong>: The <code><a href=#the-strong-element>strong</a></code> element can be used to denote contents that
+  the user needs to see sooner than other parts of the document.</p>
 
   <p>The relative level of importance of a piece of content is given by its number of ancestor
   <code><a href=#the-strong-element>strong</a></code> elements; each <code><a href=#the-strong-element>strong</a></code> element increases the importance of its
@@ -17721,6 +17737,28 @@ included with Exhibit B.
   <p>Changing the importance of a piece of text with the <code><a href=#the-strong-element>strong</a></code> element does not change
   the meaning of the sentence.</p>
 
+  <div class=example>
+
+   <p>Here, the word "chapter" and the actual chapter number are mere boilerplate, and the actual
+   name of the chapter is marked up with <code><a href=#the-strong-element>strong</a></code>:</p>
+
+   <pre>&lt;h1&gt;Chapter 1: &lt;strong&gt;The Praxis&lt;/strong&gt;&lt;/h1&gt;</pre>
+
+   <p>In the following example, the name of the diagram in the caption is marked up with
+   <code><a href=#the-strong-element>strong</a></code>, to distinguish it from boilerplate text (before) and the description
+   (after):</p>
+
+   <pre>&lt;figcaption&gt;Figure 1. &lt;strong&gt;Ant colony dynamics&lt;/strong&gt;. The ants in this colony are
+affected by the heat source (upper left) and the food source (lower right).&lt;/figcaption&gt;</pre>
+
+   <p>In this example, the heading is really "Flowers, Bees, and Honey", but the author has added a
+   light-hearted addition to the heading. The <code><a href=#the-strong-element>strong</a></code> element is thus used to mark up
+   the first part to distinguish it from the latter part.</p>
+
+   <pre>&lt;h1&gt;&lt;strong&gt;Flowers, Bees, and Honey&lt;/strong&gt; and other things I don't understand&lt;/h1&gt;</pre>
+
+  </div>
+
   <div class=example>
    <p>Here is an example of a warning notice in a game, with the
    various parts marked up according to how important they are:</p>
@@ -17732,6 +17770,21 @@ they are explosive and &lt;strong&gt;will destroy anything within
 ten meters.&lt;/strong&gt;&lt;/strong&gt; You have been warned.&lt;/p&gt;</pre>
   </div>
 
+  <div class=example>
+
+   <p>In this example, the <code><a href=#the-strong-element>strong</a></code> element is used to denote the part of the text that
+   the user is intended to read first.</p>
+
+   <pre>&lt;p&gt;Welcome to Remy, the reminder system.&lt;/p&gt;
+&lt;p&gt;Your tasks for today:&lt;/p&gt;
+&lt;ul&gt;
+ &lt;li&gt;&lt;p&gt;&lt;strong&gt;Turn off the oven.&lt;/strong&gt;&lt;/p&gt;&lt;/li&gt;
+ &lt;li&gt;&lt;p&gt;Put out the trash.&lt;/p&gt;&lt;/li&gt;
+ &lt;li&gt;&lt;p&gt;Do the laundry.&lt;/p&gt;&lt;/li&gt;
+&lt;/ul&gt;</pre>
+
+  </div>
+
 
   <h4 id=the-small-element><span class=secno>4.5.4 </span>The <dfn><code>small</code></dfn> element</h4>
 
@@ -102054,6 +102107,7 @@ if (s = prompt('What is your name?')) {
   Michael Powers,
   Michael Rakowski,
   Michael(tm) Smith,
+  Michael Walmsley,
   Michal Zalewski,
   Michel Fortin,
   Michelangelo De Simone,

diff --git a/source b/source
@@ -18459,7 +18459,23 @@ included with Exhibit B.
    <dd>Uses <code>HTMLElement</code>.</dd>
   </dl><!--TOPIC:HTML-->
 
-  <p>The <code>strong</code> element <span>represents</span> strong importance for its contents.</p>
+  <p>The <code>strong</code> element <span>represents</span> strong importance, seriousness, or
+  urgency for its contents.</p>
+
+  <p><strong>Importance</strong>: The <code>strong</code> element can be used in a heading, caption,
+  or paragraph to distinguish the part that really matters from other parts of the that might be
+  more detailed, more jovial, or merely boilerplate. (This is distinct from marking up subheadings,
+  for which the <code>hgroup</code> element is appropriate.)</p>
+
+  <p class="example">For example, the first word of the previous paragraph is marked up with
+  <code>strong</code> to distinguish it from the more detailed text in the rest of the
+  paragraph.</p>
+
+  <p><strong>Seriousness</strong>: The <code>strong</code> element can be used to mark up a warning
+  or caution notice.</p>
+
+  <p><strong>Urgency</strong>: The <code>strong</code> element can be used to denote contents that
+  the user needs to see sooner than other parts of the document.</p>
 
   <p>The relative level of importance of a piece of content is given by its number of ancestor
   <code>strong</code> elements; each <code>strong</code> element increases the importance of its
@@ -18468,6 +18484,28 @@ included with Exhibit B.
   <p>Changing the importance of a piece of text with the <code>strong</code> element does not change
   the meaning of the sentence.</p>
 
+  <div class="example">
+
+   <p>Here, the word "chapter" and the actual chapter number are mere boilerplate, and the actual
+   name of the chapter is marked up with <code>strong</code>:</p>
+
+   <pre>&lt;h1>Chapter 1: &lt;strong>The Praxis&lt;/strong>&lt;/h1></pre>
+
+   <p>In the following example, the name of the diagram in the caption is marked up with
+   <code>strong</code>, to distinguish it from boilerplate text (before) and the description
+   (after):</p>
+
+   <pre>&lt;figcaption>Figure 1. &lt;strong>Ant colony dynamics&lt;/strong>. The ants in this colony are
+affected by the heat source (upper left) and the food source (lower right).&lt;/figcaption></pre>
+
+   <p>In this example, the heading is really "Flowers, Bees, and Honey", but the author has added a
+   light-hearted addition to the heading. The <code>strong</code> element is thus used to mark up
+   the first part to distinguish it from the latter part.</p>
+
+   <pre>&lt;h1>&lt;strong>Flowers, Bees, and Honey&lt;/strong> and other things I don't understand&lt;/h1></pre>
+
+  </div>
+
   <div class="example">
    <p>Here is an example of a warning notice in a game, with the
    various parts marked up according to how important they are:</p>
@@ -18479,6 +18517,21 @@ they are explosive and &lt;strong>will destroy anything within
 ten meters.&lt;/strong>&lt;/strong> You have been warned.&lt;/p></pre>
   </div>
 
+  <div class="example">
+
+   <p>In this example, the <code>strong</code> element is used to denote the part of the text that
+   the user is intended to read first.</p>
+
+   <pre>&lt;p>Welcome to Remy, the reminder system.&lt;/p>
+&lt;p>Your tasks for today:&lt;/p>
+&lt;ul>
+ &lt;li>&lt;p>&lt;strong>Turn off the oven.&lt;/strong>&lt;/p>&lt;/li>
+ &lt;li>&lt;p>Put out the trash.&lt;/p>&lt;/li>
+ &lt;li>&lt;p>Do the laundry.&lt;/p>&lt;/li>
+&lt;/ul></pre>
+
+  </div>
+
 
   <h4>The <dfn><code>small</code></dfn> element</h4>
 
@@ -113998,6 +114051,7 @@ if (s = prompt('What is your name?')) {
   Michael Powers,
   Michael Rakowski,
   Michael(tm) Smith,
+  Michael Walmsley,
   Michal Zalewski,
   Michel Fortin,
   Michelangelo De Simone,