3

I've searched and have not come up with any useful answers, so here goes:

Is an HTML5 <header> tag unnecessary if there is only a single <hx> tag inside it? For instance, I have the following HTML5 markup:

<article>

   <header>
      <h1>Heading Title</h1>
   </header>

   ...

</article>

From an HTML5 semantics point of view, when there is only one <hx> tag inside the <header> and nothing else, is the <header> tag unnecessary/redundant, and should I just do this instead:

<article>

   <h1>Heading Title</h1>

   ...

</article>
Peter Andrews
  • 90
  • 5
  • That depends on what _meaning_ you want to have the content inside the `h1`, I’d say … if that content actually constitutes a header for the whole page, then there is nothing wrong with using `header`. – CBroe Aug 14 '14 at 16:45
  • Perhaps the best argument against semantics is the fact nobody ever agrees on semantics. – OdraEncoded Aug 14 '14 at 16:45
  • You might be interested in the [W3C wiki `
    ` page](http://www.w3.org/wiki/HTML/Elements/header) and the [W3C HTML5 `
    ` spec](http://www.w3.org/TR/html5/sections.html#the-header-element), which explain the element's intention and some semantics/examples for it.
     – ajp15243 Aug 14 '14 at 17:20
  • What do you expect to gain from using `header` in the first place? – Jukka K. Korpela Aug 14 '14 at 17:25
  • @JukkaK.Korpela I am hoping to gain a properly-formed, semantic HTML5 document. – Peter Andrews Aug 14 '14 at 17:27
  • @PeterAndrews, meaning what? How would a) the appearance b) the functionality differ? – Jukka K. Korpela Aug 14 '14 at 17:42
  • 1
    @JukkaK.Korpela Unless I am mistaken, there would be no difference in either appearance or functionality. What I am concerned about is whether it is more correct to do it one way or the other *from an HTML5 semantics point of view*. – Peter Andrews Aug 14 '14 at 17:47
  • So, it is a matter of opinion only, isn’t it? “HTML5 semantics” is just a collection of opinions (and does not relate to real semantics, i.e. meaning; `header` says nothing about the *meaning* of the content, just (at most) about its structural role in a site. – Jukka K. Korpela Aug 14 '14 at 18:07
  • 1
    "So, it is a matter of opinion only, isn’t it?" It may be just a matter of opinion, but I can hardly image that there is no "best practice" or leading school of thought. – Peter Andrews Aug 14 '14 at 18:29

2 Answers2

3

Yes, it’s unnecessary in this specific case. Which means, you may use a header (it wouldn’t be wrong) but it’s also not required.

header (together with footer and address) is used to markup a section’s content that is not considered to be the main content of that section. A section can be a sectioning root (like body) or a sectioning content (like article) element.

So when your header would contain more than a heading element (for example, a subtitle), you should use a header element, because otherwise it wouldn’t be clear if this content is part of the header or the main content. But in case of a single heading element, it’s clear by definition: the first heading element in a section is the heading for this section.

Community
  • 1
  • 1
unor
  • 92,415
  • 26
  • 211
  • 360
2

From the first Note section on the W3C's header spec which ajp15243 mentioned above, emphasis mine:

A header element is intended to usually contain the section's heading (an h1–h6 element), but this is not required. The header element can also be used to wrap a section's table of contents, a search form, or any relevant logos.

If all you have is a single (as per your example) <h1></h1>, the <header> tag is not required for your document to be properly-formed and semantically correct.

You might find that having the <header> element as a wrapper aids you in styling the h1 later with CSS, but as far as the HTML alone in this case, you're semantically fine either with or without <header>.

Community
  • 1
  • 1
simmer
  • 2,639
  • 1
  • 18
  • 22
  • This does not address the question asked. It deals with the possible content of the element, not whether it should be used or not. – Jukka K. Korpela Aug 14 '14 at 18:49
  • 1
    I understood that note to mean "the
    element is not required as a wrapper for a section's h1-h6 element", but I see how it could also be interpreted as "you can use
    without an h1-h6 inside".
     – simmer Aug 14 '14 at 21:52