- From: poot <cvsmail@w3.org>
- Date: Fri, 1 May 2009 03:09:00 +0900 (JST)
- To: public-html-diffs@w3.org
Introduce a new <header> element. (whatwg r3040)
4.4.3 The nav element
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#the-nav-element
sectioning roots
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#sectioning-root
4.4.7 The hgroup element
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#the-hgroup-element
4.4.11.2 Distinguishing site-wide headings from page headings
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#distinguishing-site-wide-headings-from-page-headings
4.8.2.1.3 A short phrase or label with an alternative graphical representation: icons, logos
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#a-short-phrase-or-label-with-an-alternative-graphical-representation:-icons-logos
4.4.9 The footer element
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#the-footer-element
Special
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#special
In addition, whenever you exit a node, after doing the steps above, if current section is not null, associate the node with the section current section.
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#associatedSection
4.4.11 Headings and sections
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#headings-and-sections
8.2.5.10 The "in body" insertion mode
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#parsing-main-inbody
Scoping
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#scoping
8.1.2.4 Optional tags
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#optional-tags
4.4.8 The header element
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#the-header-element
4.4.11.1 Creating an outline
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#outlines
4.4.10 The address element
http://people.w3.org/mike/diffs/html5/spec/Overview.1.2200.html#the-address-element
http://people.w3.org/mike/diffs/html5/spec/Overview.diff.html
http://dev.w3.org/cvsweb/html5/spec/Overview.html?r1=1.2199&r2=1.2200&f=h
http://html5.org/tools/web-apps-tracker?from=3039&to=3040
===================================================================
RCS file: /sources/public/html5/spec/Overview.html,v
retrieving revision 1.2199
retrieving revision 1.2200
diff -u -d -r1.2199 -r1.2200
--- Overview.html 30 Apr 2009 17:37:35 -0000 1.2199
+++ Overview.html 30 Apr 2009 18:07:24 -0000 1.2200
@@ -445,12 +445,13 @@
<code>h5</code>, and <code>h6</code>
elements</a></li>
<li><a href="#the-hgroup-element"><span class="secno">4.4.7 </span>The <code>hgroup</code> element</a></li>
- <li><a href="#the-footer-element"><span class="secno">4.4.8 </span>The <code>footer</code> element</a></li>
- <li><a href="#the-address-element"><span class="secno">4.4.9 </span>The <code>address</code> element</a></li>
- <li><a href="#headings-and-sections"><span class="secno">4.4.10 </span>Headings and sections</a>
+ <li><a href="#the-header-element"><span class="secno">4.4.8 </span>The <code>header</code> element</a></li>
+ <li><a href="#the-footer-element"><span class="secno">4.4.9 </span>The <code>footer</code> element</a></li>
+ <li><a href="#the-address-element"><span class="secno">4.4.10 </span>The <code>address</code> element</a></li>
+ <li><a href="#headings-and-sections"><span class="secno">4.4.11 </span>Headings and sections</a>
<ol>
- <li><a href="#outlines"><span class="secno">4.4.10.1 </span>Creating an outline</a></li>
- <li><a href="#distinguishing-site-wide-headings-from-page-headings"><span class="secno">4.4.10.2 </span>Distinguishing site-wide headings from page headings</a></ol></ol></li>
+ <li><a href="#outlines"><span class="secno">4.4.11.1 </span>Creating an outline</a></li>
+ <li><a href="#distinguishing-site-wide-headings-from-page-headings"><span class="secno">4.4.11.2 </span>Distinguishing site-wide headings from page headings</a></ol></ol></li>
<li><a href="#grouping-content"><span class="secno">4.5 </span>Grouping content</a>
<ol>
<li><a href="#the-p-element"><span class="secno">4.5.1 </span>The <code>p</code> element</a></li>
@@ -10798,20 +10799,21 @@
navigation section.</p>
<pre><body>
- <!--<header>-->
+ <header>
<h1>Wake up sheeple!</h1>
<p><a href="news.html">News</a> -
<a href="blog.html">Blog</a> -
<a href="forums.html">Forums</a></p>
- <!--</header>-->
- <nav>
- <h1>Navigation</h1>
- <ul>
- <li><a href="articles.html">Index of all articles</a></li>
- <li><a href="today.html">Things sheeple need to wake up for today</a></li>
- <li><a href="successes.html">Sheeple we have managed to wake</a></li>
- </ul>
- </nav>
+ <p>Last Modified: <time>2009-04-01</time></p>
+ <nav>
+ <h1>Navigation</h1>
+ <ul>
+ <li><a href="articles.html">Index of all articles</a></li>
+ <li><a href="today.html">Things sheeple need to wake up for today</a></li>
+ <li><a href="successes.html">Sheeple we have managed to wake</a></li>
+ </ul>
+ </nav>
+ </header>
<article>
<p>...<em>page content would be here</em>...</p>
</article>
@@ -10968,19 +10970,39 @@
<h2>Or: How I Learned to Stop Worrying and Love the Bomb</h2>
</hgroup></pre>
-<!--
- The <code>header</code> element may contain more than just the
- section's headings and subheadings — for example it would be
- reasonable for the header to include version history information.
+ </div><h4 id="the-header-element"><span class="secno">4.4.8 </span>The <dfn><code>header</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
+ <dd><a href="#flow-content-0">Flow content</a>.</dd>
+ <dt>Contexts in which this element may be used:</dt>
+ <dd>Where <a href="#flow-content-0">flow content</a> is expected.</dd>
+ <dt>Content model:</dt>
+ <dd><a href="#flow-content-0">Flow content</a>, but with no <code><a href="#the-header-element">header</a></code>
+ element descendants.</dd>
+ <dt>Content attributes:</dt>
+ <dd><a href="#global-attributes">Global attributes</a></dd>
+ <dt>DOM interface:</dt>
+ <dd>Uses <code><a href="#htmlelement">HTMLElement</a></code>.</dd>
+ </dl><p>The <code><a href="#the-header-element">header</a></code> element <a href="#represents">represents</a> a header
+ for the section it <a href="#applyToSection">applies</a> to. A
+ header typically contains a heading
+ (<code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h1</a></code>–<code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h6</a></code> or <code><a href="#the-hgroup-element">hgroup</a></code>), a
+ table of contents, a search form, relevant logos, and other
+ introductory or navigational aids.<p>Contact information for the section to which the
+ <code><a href="#the-header-element">header</a></code> element <a href="#applyToSection">applies</a>
+ should be marked up using the <code><a href="#the-address-element">address</a></code> element.<div class="example">
+
+ <p>Here are some sample headers. This first one is for a game:</p>
<pre><header>
<p>Welcome to...</p>
- <h1><strong>Voidwars!</strong></h1>
+ <h1>Voidwars!</h1>
</header></pre>
+ <p>The following snippet shows how the element can be used to mark
+ up a specification's heading:</p>
+
<pre><header>
<hgroup>
- <h1><strong>Scalable Vector Graphics (SVG) 1.2</strong></h1>
+ <h1>Scalable Vector Graphics (SVG) 1.2</h1>
<h2>W3C Working Draft 27 October 2004</h2>
</hgroup>
<dl>
@@ -10999,8 +11021,8 @@
</dl>
<p class="copyright"><a href="http://www.w3.org/Consortium/Legal/ipr-notic <em>...</em>
</header></pre>
--->
- </div><h4 id="the-footer-element"><span class="secno">4.4.8 </span>The <dfn><code>footer</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
+
+ </div><h4 id="the-footer-element"><span class="secno">4.4.9 </span>The <dfn><code>footer</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
<dd><a href="#flow-content-0">Flow content</a>.</dd>
<dt>Contexts in which this element may be used:</dt>
<dd>Where <a href="#flow-content-0">flow content</a> is expected.</dd>
@@ -11016,10 +11038,14 @@
for the section it <a href="#applyToSection">applies</a> to. A
footer typically contains information about its section such as who
wrote it, links to related documents, copyright data, and the
- like.<p>Contact information for the section given in a
- <code><a href="#the-footer-element">footer</a></code> should be marked up using the
- <code><a href="#the-address-element">address</a></code> element.<p>Footers don't necessarily have to appear at the end of a section,
- though they usually do.<div class="example">
+ like.<p>Contact information for the section to which the
+ <code><a href="#the-footer-element">footer</a></code> element <a href="#applyToSection">applies</a>
+ should be marked up using the <code><a href="#the-address-element">address</a></code> element.<p>Footers don't necessarily have to appear at the end of a section,
+ though they usually do.<p>The <code><a href="#the-footer-element">footer</a></code> element is inappropriate for containing
+ entire sections. For appendices, indexes, long colophons, verbose
+ license agreements, and other such content which needs sectioning
+ with headers and so forth, regular <code><a href="#the-section-element">section</a></code> elements
+ should be used, not a <code><a href="#the-footer-element">footer</a></code>.<div class="example">
<p>Here is a page with two footers, one at the top and one at the
bottom, with the same content:</p>
@@ -11040,7 +11066,7 @@
<footer><a href="../">Back to index...</a></footer>
</body></pre>
- </div><h4 id="the-address-element"><span class="secno">4.4.9 </span>The <dfn><code>address</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
+ </div><h4 id="the-address-element"><span class="secno">4.4.10 </span>The <dfn><code>address</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
<dd><a href="#flow-content-0">Flow content</a>.</dd>
<dt>Contexts in which this element may be used:</dt>
<dd>Where <a href="#flow-content-0">flow content</a> is expected.</dd>
@@ -11087,7 +11113,7 @@
</div><p class="note">Contact information for one <a href="#sectioning-content-0">sectioning
content</a> element, e.g. an <code><a href="#the-aside-element">aside</a></code> element, does
not apply to its ancestor elements, e.g. the page's
- <code><a href="#the-body-element">body</a></code>.<h4 id="headings-and-sections"><span class="secno">4.4.10 </span><dfn>Headings and sections</dfn></h4><p>The <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h1</a></code>–<code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h6</a></code> elements and the
+ <code><a href="#the-body-element">body</a></code>.<h4 id="headings-and-sections"><span class="secno">4.4.11 </span><dfn>Headings and sections</dfn></h4><p>The <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h1</a></code>–<code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h6</a></code> elements and the
<code><a href="#the-hgroup-element">hgroup</a></code> element are headings.<p>The first element of <a href="#heading-content-0">heading content</a> in an element
of <a href="#sectioning-content-0">sectioning content</a> <a href="#represents">represents</a> the
header for that section. Subsequent headers of equal or higher
@@ -11177,7 +11203,7 @@
<p>Both of the documents above are semantically identical and would
produce the same outline in compliant user agents.</p>
- </div><h5 id="outlines"><span class="secno">4.4.10.1 </span>Creating an outline</h5><div class="impl">
+ </div><h5 id="outlines"><span class="secno">4.4.11.1 </span>Creating an outline</h5><div class="impl">
<!-- v2 idea: It would be nice if there was a way to use this to
autogenerate a table of contents or some such -->
@@ -11477,7 +11503,7 @@
</div>
- </div><h5 id="distinguishing-site-wide-headings-from-page-headings"><span class="secno">4.4.10.2 </span>Distinguishing site-wide headings from page headings</h5><div class="impl">
+ </div><h5 id="distinguishing-site-wide-headings-from-page-headings"><span class="secno">4.4.11.2 </span>Distinguishing site-wide headings from page headings</h5><div class="impl">
<p>Given the <a href="#outline">outline</a> of a document, but ignoring any
sections created for <code><a href="#the-nav-element">nav</a></code> and <code><a href="#the-aside-element">aside</a></code>
@@ -15201,35 +15227,33 @@
</div><p>In other cases, the icon has no text next to it describing what
it means; the icon is supposed to be self-explanatory. In those
- cases, an equivalent textual label must be given in the <code title="attr-img-alt"><a href="#attr-img-alt">alt</a></code> attribute.</p><!--
- <div class="example">
+ cases, an equivalent textual label must be given in the <code title="attr-img-alt"><a href="#attr-img-alt">alt</a></code> attribute.<div class="example">
<p>Here, posts on a news site are labeled with an icon
indicating their topic.</p>
- <pre><body>
- <article>
- <header>
- <h1>Ratatouille wins <i>Best Movie of the Year</i> award</h1>
- <p><strong><img src="movies.png" alt="Movies"></strong></p>
- </header>
- <p>Pixar has won yet another <i>Best Movie of the Year</i> award,
- making this its 8th win in the last 12 years.</p>
- </article>
- <article>
- <header>
- <h1>Latest TWiT episode is online</h1>
- <p><strong><img src="podcasts.png" alt="Podcasts"></strong></p>
- </header>
- <p>The latest TWiT episode has been posted, in which we hear
+ <pre><body>
+ <article>
+ <header>
+ <h1>Ratatouille wins <i>Best Movie of the Year</i> award</h1>
+ <p><strong><img src="movies.png" alt="Movies"></strong></p>
+ </header>
+ <p>Pixar has won yet another <i>Best Movie of the Year</i> award,
+ making this its 8th win in the last 12 years.</p>
+ </article>
+ <article>
+ <header>
+ <h1>Latest TWiT episode is online</h1>
+ <p><strong><img src="podcasts.png" alt="Podcasts"></strong></p>
+ </header>
+ <p>The latest TWiT episode has been posted, in which we hear
several tech news stories as well as learning much more about the
iPhone. This week, the panelists compare how reflective their
- iPhones' Apple logos are.</p>
- </article>
-</body></pre>
+ iPhones' Apple logos are.</p>
+ </article>
+</body></pre>
- </div>
---><p>Many pages include logos, insignia, flags, or emblems, which
+ </div><p>Many pages include logos, insignia, flags, or emblems, which
stand for a particular entity such as a company, organization,
project, band, software package, country, or some such.<p>If the logo is being used to represent the entity, e.g. as a page
header, the <code title="attr-img-alt"><a href="#attr-img-alt">alt</a></code> attribute must
@@ -46959,12 +46983,12 @@
<code><a href="#the-div-element">div</a></code>, <code><a href="#the-dl-element">dl</a></code>, <code><a href="#the-fieldset-element">fieldset</a></code>,
<code><a href="#the-footer-element">footer</a></code>, <code><a href="#the-form-element">form</a></code>, <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h1</a></code>,
<code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h2</a></code>, <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h3</a></code>, <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h4</a></code>, <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h5</a></code>,
- <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h6</a></code>, <code><a href="#the-hgroup-element">hgroup</a></code>, <code><a href="#the-hr-element">hr</a></code>,
- <code><a href="#menus">menu</a></code>, <code><a href="#the-nav-element">nav</a></code>, <code><a href="#the-ol-element">ol</a></code>,
- <code><a href="#the-p-element">p</a></code>, <code><a href="#the-pre-element">pre</a></code>, <code><a href="#the-section-element">section</a></code>,
- <code><a href="#the-table-element">table</a></code>, or <code><a href="#the-ul-element">ul</a></code>, element, or if there is no
- more content in the parent element and the parent element is not an
- <code><a href="#the-a-element">a</a></code> element.</p><!-- </rt> --><p>An <code><a href="#the-rt-element">rt</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
+ <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h6</a></code>, <code><a href="#the-header-element">header</a></code>, <code><a href="#the-hgroup-element">hgroup</a></code>,
+ <code><a href="#the-hr-element">hr</a></code>, <code><a href="#menus">menu</a></code>, <code><a href="#the-nav-element">nav</a></code>,
+ <code><a href="#the-ol-element">ol</a></code>, <code><a href="#the-p-element">p</a></code>, <code><a href="#the-pre-element">pre</a></code>,
+ <code><a href="#the-section-element">section</a></code>, <code><a href="#the-table-element">table</a></code>, or <code><a href="#the-ul-element">ul</a></code>,
+ element, or if there is no more content in the parent element and
+ the parent element is not an <code><a href="#the-a-element">a</a></code> element.</p><!-- </rt> --><p>An <code><a href="#the-rt-element">rt</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
tag</a> may be omitted if the <code><a href="#the-rt-element">rt</a></code> element is
immediately followed by an <code><a href="#the-rt-element">rt</a></code> or <code><a href="#the-rp-element">rp</a></code>
element, or if there is no more content in the parent element.</p><!-- </rp> --><p>An <code><a href="#the-rp-element">rp</a></code> element's <a href="#syntax-end-tag" title="syntax-end-tag">end
@@ -47954,20 +47978,20 @@
<code><a href="#the-footer-element">footer</a></code>, <code><a href="#the-form-element">form</a></code>, <code>frame</code>,
<code>frameset</code>, <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h1</a></code>, <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h2</a></code>,
<code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h3</a></code>, <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h4</a></code>, <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h5</a></code>, <code><a href="#the-h1-h2-h3-h4-h5-and-h6-elements">h6</a></code>,
- <code><a href="#the-head-element">head</a></code>, <code><a href="#the-hgroup-element">hgroup</a></code>, <code><a href="#the-hr-element">hr</a></code>,
- <code><a href="#the-iframe-element">iframe</a></code>, <!-- <code>image</code>, (commented out
- because this isn't an element that can end up on the stack, so it
- doesn't matter) --> <code><a href="#the-img-element">img</a></code>, <code><a href="#the-input-element">input</a></code>,
- <code>isindex</code>, <code><a href="#the-li-element">li</a></code>, <code><a href="#the-link-element">link</a></code>,
- <code>listing</code>, <code><a href="#menus">menu</a></code>, <code><a href="#meta">meta</a></code>,
- <code><a href="#the-nav-element">nav</a></code>, <code>noembed</code>, <code>noframes</code>,
- <code><a href="#the-noscript-element">noscript</a></code>, <code><a href="#the-ol-element">ol</a></code>, <code><a href="#the-p-element">p</a></code>,
- <code><a href="#the-param-element">param</a></code>, <code>plaintext</code>, <code><a href="#the-pre-element">pre</a></code>,
- <code><a href="#script">script</a></code>, <code><a href="#the-section-element">section</a></code>, <code><a href="#the-select-element">select</a></code>,
- <code>spacer</code>, <code><a href="#the-style-element">style</a></code>, <code><a href="#the-tbody-element">tbody</a></code>,
- <code><a href="#the-textarea-element">textarea</a></code>, <code><a href="#the-tfoot-element">tfoot</a></code>, <code><a href="#the-thead-element">thead</a></code>,
- <code><a href="#the-title-element">title</a></code>, <code><a href="#the-tr-element">tr</a></code>, <code><a href="#the-ul-element">ul</a></code>, and
- <code>wbr</code>.</dd>
+ <code><a href="#the-head-element">head</a></code>, <code><a href="#the-header-element">header</a></code>, <code><a href="#the-hgroup-element">hgroup</a></code>,
+ <code><a href="#the-hr-element">hr</a></code>, <code><a href="#the-iframe-element">iframe</a></code>, <!-- <code>image</code>,
+ (commented out because this isn't an element that can end up on the
+ stack, so it doesn't matter) --> <code><a href="#the-img-element">img</a></code>,
+ <code><a href="#the-input-element">input</a></code>, <code>isindex</code>, <code><a href="#the-li-element">li</a></code>,
+ <code><a href="#the-link-element">link</a></code>, <code>listing</code>, <code><a href="#menus">menu</a></code>,
+ <code><a href="#meta">meta</a></code>, <code><a href="#the-nav-element">nav</a></code>, <code>noembed</code>,
+ <code>noframes</code>, <code><a href="#the-noscript-element">noscript</a></code>, <code><a href="#the-ol-element">ol</a></code>,
+ <code><a href="#the-p-element">p</a></code>, <code><a href="#the-param-element">param</a></code>, <code>plaintext</code>,
+ <code><a href="#the-pre-element">pre</a></code>, <code><a href="#script">script</a></code>, <code><a href="#the-section-element">section</a></code>,
+ <code><a href="#the-select-element">select</a></code>, <code>spacer</code>, <code><a href="#the-style-element">style</a></code>,
+ <code><a href="#the-tbody-element">tbody</a></code>, <code><a href="#the-textarea-element">textarea</a></code>, <code><a href="#the-tfoot-element">tfoot</a></code>,
+ <code><a href="#the-thead-element">thead</a></code>, <code><a href="#the-title-element">title</a></code>, <code><a href="#the-tr-element">tr</a></code>,
+ <code><a href="#the-ul-element">ul</a></code>, and <code>wbr</code>.</dd>
<dt><dfn id="scoping">Scoping</dfn></dt>
<dd><p>The following HTML elements introduce new <a href="#has-an-element-in-scope" title="has
@@ -50578,8 +50602,8 @@
<!-- the normal ones -->
<dt>A start tag whose tag name is one of: "address", "article",
"aside", "blockquote", "center", "datagrid", "details", "dialog",
- "dir", "div", "dl", "fieldset", "figure", "footer", "hgroup",
- "menu", "nav", "ol", "p", "section", "ul"</dt>
+ "dir", "div", "dl", "fieldset", "figure", "footer", "header",
+ "hgroup", "menu", "nav", "ol", "p", "section", "ul"</dt>
<dd>
<!-- As of May 2008 this doesn't match any browser exactly, but is
@@ -50781,8 +50805,9 @@
<!-- the normal ones -->
<dt>An end tag whose tag name is one of: "address", "article",
"aside", "blockquote", "center", "datagrid", "details", "dialog",
- "dir", "div", "dl", "fieldset", "figure", "footer", "hgroup",
- "listing", "menu", "nav", "ol", "pre", "section", "ul"</dt>
+ "dir", "div", "dl", "fieldset", "figure", "footer", "header",
+ "hgroup", "listing", "menu", "nav", "ol", "pre", "section",
+ "ul"</dt>
<dd>
<p>If the <a href="#stack-of-open-elements">stack of open elements</a> does not <a href="#has-an-element-in-scope" title="has an element in scope">have an element in scope</a>
Received on Thursday, 30 April 2009 18:09:37 UTC