＜header＞要素とは？
＜header＞はHTMLページでヘッダーやセクションの見出し部分を表す要素です。
ページの最初にロゴ、会社名、サイトタイトル、メインナビゲーションなどが含まれます。
＜header＞要素の基本的な使い方
＜header＞要素の基本的な使い方ソースになります。
<body>
<header>
<h1>ホームページのタイトル</h1>
</header>
</body>他、＜header＞要素の中にはメインナビゲーション（＜nav＞要素）なども含みます。ですが必須ではありません。
<body>
<header>
<h1>ホームページのタイトル</h1>
<nav>
<ul>
<li><a href="#">ページ</a></li>
<li><a href="#">ページ</a></li>
<li><a href="#">ページ</a></li>
</ul>
</nav>
</header>
</body>＜header＞要素の主な特徴
- ページのヘッダー、セクションのヘッダーに定義する為に使用します。
- 1つのHTMLページ内で複数可能です。
- ＜header＞要素内には通常見出しタグ（h1～h6）を使用しますが、必須ではありません。
- サイトロゴ、検索フォーム、キャッチコピー、メインナビゲーションなども含みます。
＜header＞の注意点
＜header＞要素を使用する際に、以下の様な点に注意しましょう。
- 複数使えるが、＜header＞の中に＜header＞、＜footer＞の中に＜header＞など入れ子にしてはならない。
- ＜header＞は＜div＞などのブロック要素として使用してはならない。ヘッダーを定義する為のタグとして使用する。
- ＜header＞要素がbannerランドマークを定義するのは＜body＞要素の時のみです。＜article＞、＜aside＞、＜main＞、＜nav＞、＜section＞要素の中で使用した＜header＞はbannerランドマークに定義されません。
※bannerランドマークとは、Webページの先頭に配置されるコンテンツを表すランドマークロールの事です。
＜header＞を複数使った場合の基本的な使い方
1ページ内に＜header＞要素を複数使う場合は、＜article＞や＜section＞要素を使ってマークします。
<body>
<header>
<h1>ホームページのタイトル</h1>
<nav>
<ul>
<li><a href="#">ページ</a></li>
<li><a href="#">ページ</a></li>
<li><a href="#">ページ</a></li>
</ul>
</nav>
</header>
<article>
<header>
<h2>記事のタイトル</h2>
</header>
<section>
<header>
<h3>コンテンツタイトル</h3>
</header>
<p>記事の内容がここに入ります。</p>
</section>
</article>
</body>ですが、＜header＞要素を「複数使用する派」と「1つしか使用しない派」がいます。
私は1つしか使用しない派ですが、これはどちらも必須ではありません。
