Тег header — заголовок документа

Новые теги HTML5

header элемент представляет группу вводных или навигационных средств.

Note: header элемент предназначен обычно для включения названия раздела (h1 - h6 элемент или hgroup  элемент), но это не требуется. header  элемент также может быть использован для упаковки таблицы разделяемого содержания, формы поиска, или любых логотипов.

Вот некоторые примеры заголовков. Это первая для игры:

<header>
 <p>Welcome to...</p>
 <h1>Voidwars!</h1>
</header>

Следующий фрагмент показывает, как элемент может быть использован для разметки заголовка на спецификации:

<header>
 <hgroup>
  <h1>Scalable Vector Graphics (SVG) 1.2</h1>
  <h2>W3C Working Draft 27 October 2004</h2>
 </hgroup>
 <dl>
  <dt>This version:</dt>
  <dd><a href="http://www.w3.org/TR/2004/WD-SVG12-20041027/">http://www.w3.org/TR/2004/WD-SVG12-20041027/</a></dd>
  <dt>Previous version:</dt>
  <dd><a href="http://www.w3.org/TR/2004/WD-SVG12-20040510/">http://www.w3.org/TR/2004/WD-SVG12-20040510/</a></dd>
  <dt>Latest version of SVG 1.2:</dt>
  <dd><a href="http://www.w3.org/TR/SVG12/">http://www.w3.org/TR/SVG12/</a></dd>
  <dt>Latest SVG Recommendation:</dt>
  <dd><a href="http://www.w3.org/TR/SVG/">http://www.w3.org/TR/SVG/</a></dd>
  <dt>Editor:</dt>
  <dd>Dean Jackson, W3C, <a href="mailto:dean@w3.org">dean@w3.org</a></dd>
  <dt>Authors:</dt>
  <dd>See <a href="#authors">Author List</a></dd>
 </dl>
 <p><a href="http://www.w3.org/Consortium/Legal/ipr-notic ...
</header>
Note: header элемент не вводит новый раздел.

В этом примере страница имеет заголовок страницы в виде h1 элемента и два подраздела  в виде h2 элементов. Содержание после header  элемента все еще является частью последнего пункта начатого в header элементе, потому что header  элемент не принимает участие в схеме алгоритма.

<body>
 <header>
  <h1>Little Green Guys With Guns</h1>
  <nav>
   <ul>
    <li><a href="/games">Games</a>
    <li><a href="/forum">Forum</a>
    <li><a href="/download">Download</a>
   </ul>
  </nav>
  <h2>Important News</h2> <!-- this starts a second subsection -->
  <!-- this is part of the subsection entitled "Important News" -->
  <p>To play today's games you will need to update your client.</p>
  <h2>Games</h2> <!-- this starts a third subsection -->
 </header>
 <p>You have three active games:</p>
 <!-- this is still part of the subsection entitled "Games" -->
 ...