header要素

ページやページ内文章のヘッダー(見出し情報)を示す要素です。
例えばタイトル、概要、日付などを<header>で囲います。

<body>
<header><!--サイトの見出し情報 -->
<h1>日本の詩</h1>
<nav>メニューナビゲーション</nav>
</header>
 <article>
  <header><!-- 文書の見出し情報 -->
  <h1>くらかけの雪</h1>
  <p>宮沢賢治『春と修羅』より</p>
  </header>
  <p>たよりになるのは
  くらかけつづきの雪ばかり
 野はらもはやしも
 ぽしやぽしやしたりくすんだりして
 すこしもあてにならないので
 ほんたうにそんな酵母かうぼのふうの
 おぼろなふぶきですけれども
 ほのかなのぞみを送るのは
 くらかけ山の雪ばかり
   (ひとつの古風こふうな信仰です)
 </p>
 </article>
<aside>サイドバー</aside>
<footer>フッター</footer>
</body>

上記のように、サイト全体のヘッダー情報や、各文書内の見出し情報である部分はheader要素として囲うことができるため、一つのページに複数回使用可能。
<header>の中に<header>を入れたりしてはいけません。

ちなみにmetaタグやCSSなどを記述する<head>とは別物。

h1~h6の見出しが必ずしも必要ではない

html5を学習し始めの頃は、<header>は「ヘッダー」なんだから、必ず見出しタグが必要なんだ!と思い込んでいたけど…必ず必要というわけでもないとのこと(笑)

<article>
<header><!--▼見出しを入れなくてもいい -->
<p><time datetime="2013-09-15">2013.09.15</time></p>
<p>新着情報のお知らせ</p>
</header>
<p>サイトをリニューアルしました。</p>
</article>

<header>の中には、通常は<h1>–<h6>や <hgroup>など、セクションの見出しが含まれることが想定されていますが、必ず必要というわけではありません。 他にも、セクションの目次や検索フォーム、あるいは、関連ロゴをまとめるために<header>タグを使用することができます。

<header>-HTML5タグリファレンス

でも、個人的には見出しを入れたほうが様になる?気がして、見出しを入れてコーディングするようにしてますが・・。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です