Nesting heading tags within li tags

Question

Is it ever acceptable to nest heading tags within list item tags within the HTML5 nav element in an effort to have the navigation list items show up in outlines? This validates but is it semantically correct to have a heading on a navigation list item? Is there any way to get the navigation items to show up in outlines with HTML5? Or should I even care about this?

Solution

The HTML5 syntax rules allow heading elements h1, h2 etc. inside li elements. However, it (like all HTML specifications) define heading elements as being headings for something. This is implicit in earlier specs but made clearer in HTML5, which defines how headings participate in the division of a document into sections. A heading for an empty section, though formally valid, does not make sense, except perhaps as a temporary state where the content has not been inserted yet and will be added in a later version or with a script.

Technically, using <nav><li><h2>foo</h2></li>...</nav> would put “foo” into the outline, as if the document had a section with the title “foo”. But you would hardly gain anything that way, even if HTML5 outlines had some support. And they don’t; see he HTML5 Document Outline is a dangerous fiction.

Comments

[Jukka K. Korpela]

This does not address the question. It was about outline.