The new HTML5 Bones template uses the following example for the main content (I removed some parts (like ARIA, comments, aside
, …) not relevant for this question):
<!-- The <section> element can be used to enclose content that comes under a related heading.
NOTE: The <section> element can contain <article> elements and vice versa, if you think the content warrants it. -->
<section>
<header>
<h2>Getting Started</h2>
<nav>
…
</nav>
</header>
<!-- The <article> element can be used to enclose content that still makes sense on its own and is therefore "reusable" -->
<article id="introduction">
<h3>Introduction</h3>
<p>Welcome to <abbr title="HyperText Markup Language 5">HTML5</abbr> Bones. This is a template that contains comments to aid you with setting up your <abbr title="HyperText Markup Language 5">HTML5</abbr> document.</p>
</article>
<!-- The <article> element can be used to enclose content that still makes sense on its own and is therefore "reusable" -->
<article id="instructions">
<h3>Instructions</h3>
<ol>
<li>Read the comments in this template</li>
<li>Decide how you think your content may fit into the template</li>
<li>Start building your document</li>
</ol>
</article>
</section>
The whole document has the following outline:
- HTML5 Bones
- Untitled Section
- Getting Started
- Untitled Section
- Introduction
- Instructions
- Did you know?
This outline is correct for the document. But I wonder if the use of the section
element and the article
elements is correct.