Constructing Content - HTML5 with CSS3 - page 83

Everything seems to be in order until you reach the last paragraph: does that note about tailoring refer only
to Capes and Cloaks, or to all costumes? It seems like it should relate to the entire page, but its position in
the document hierarchy implies that it relates only to the preceding heading, at least as far as the
generated outline is concerned.
HTML5 addresses this problem by introducing sectioning roots . Nested sections and subsections could
only be implied by the order of headings in past versions of HTML, but now some elements in HTML5
explicitly define a discreet section of content that has its own internal outline. Rather than merely following
a straight line of headings from the top down, the new HTML5 outlining formula can also build a hierarchy
from the document tree of sections within sections.
Here's the same content, now organized into a few nested section elements:
<section>
<h1>Costume Basics for Superheroes</h1>
<p>Battle for justice in comfort and style.</p>
<section>
<h2>Unitards and Leotards</h2>
<p>Freedom of movement and a sleek profile.</p>
</section>
<section>
<h2>Capes and Cloaks</h2>
<p>For timeless majesty or ominous mystery.</p>
</section>
<p>We do tailoring and alterations, too! Fittings are
by appointment only, so please call ahead.</p>
</section>
The last paragraph is now clearly and explicitly associated with the first heading because they belong to
the same sectioning root. In fact, that outermost section element might not be necessary because the
body element itself is a sectioning root. Elements that define new sectioning roots include:
 the body element, which you've already seen in Chapter 3
 the new sectioning elements: section , article , aside , and nav
 blockquote , figure , fieldset , details , and td —all covered elsewhere in this topic
This is pretty cutting-edge stuff and none of the major browsers have fully implemented the new outlining
algorithm yet, but that will change in due time. Until then, there are some nagging accessibility concerns
about breaking up the heading hierarchy in nested sections.
Some assistive technologies—especially screen-readers for the vision impaired—rely on generating a
document outline to aid the user in navigating the document. They can read aloud the headings on a page
according to rank and allow the user to skip directly to the part of the page that interests him. But most of
those screen-readers haven't yet implemented the outlining algorithm proposed in HTML5, so for now
they'll still generate an outline the old-fashioned way, completely ignorant of these new-fangled sectioning
roots and their effect on heading hierarchy.