[html5] headers

Stephen Stewart carisenda at gmail.com
Fri Mar 27 07:33:48 PDT 2009


Hi there,

I've been playing about with headline types as used by newspapers, for  
example (pardon my mixing of examples):

<style type="text/css">
.typeline {width:469px;font-size:72px}
.mainline {font-size:18px}
</style>

<section>
<header class="reverse-kicker">
   <h1 class="typeline">Obama</h1>
   <h2 class="mainline">Change has come</h2>
</header>
  <section>
   <h2>Taste</h2>
   <p>They taste lovely.</p>
   <section>
    <h3>Sweet</h3>
    <p>Red apples are sweeter than green ones.</p>
   </section>
  </section>
</section>

I was going to ask a question about the semantics and order of h1-6  
headers within a header element but I think my particular issue is  
solved by this line in the spec:
"Sections may contain headers of any rank, but authors are strongly  
encouraged to either use only h1 elements, or to use elements of the  
appropriate rank  for the section's nesting level."
Which gives me:

<section>
<header class="reverse-kicker">
   <h1 class="typeline">Obama</h1>
   <h1 class="mainline">Change has come</h1>
<header>
  <section>
   <h1>Taste</h1>
   <p>They taste lovely.</p>
   <section>
    <h1>Sweet</h1>
    <p>Red apples are sweeter than green ones.</p>
   </section>
  </section>
</section>

It's less confusing (to me) to not have to think about h1-6 as giving  
an outline structure as well as sections and articles, simply using h1  
all the way through.

So assuming I haven't made a huge blunder somewhere my suggestion is  
that the spec contain an example of only h1's with sections being used  
to show the outline, or if I really haven't made a blunder that none  
of the examples contain more than a h1.

--
Stephen








More information about the Help mailing list