body要素内で使用される「header」「nav」「article」「section」「footer」
body要素内で使われるタグから特定の範囲指定を行うための「header」「nav」「article」「section」「footer」を紹介します。
divやspanと大きく異なる特徴として、上に挙げたタグはそれぞれ特定の範囲を指定するために用意されたものとなります。
header
ページのヘッダー部分を範囲指定するための要素です。
ヘッダー部分には通常ロゴ・ナビゲーション・大見出し・検索フォームなどが含まれることが想定されます。（ただしどれも必須というわけではなく、別の情報が含まれる場合もあります）
記述例：
<header> <h1>Webサイトタイトル</h1> <nav> <ul> <li><a href="#">ナビゲーション</a></li> <li><a href="#">ナビゲーション</a></li> <li><a href="#">ナビゲーション</a></li> <li><a href="#">ナビゲーション</a></li> </ul> </nav> </header>
nav
主要なナビゲーションを範囲指定するための要素です。
補足的なナビゲーションやただのテキストリンクなどはnav要素で範囲指定する必要はありません。
グローバルナビゲーションや、ローカルナビゲーションなどを含むのが一般的です。
記述例：
<nav> <ul> <li><a href="#">ナビゲーション</a></li> <li><a href="#">ナビゲーション</a></li> <li><a href="#">ナビゲーション</a></li> <li><a href="#">ナビゲーション</a></li> </ul> </nav>
article
記事部分を範囲指定するための要素です。
記事とはブログやニュースなど、その部分のみを抜粋して見ても独立した一つの記事として成り立つものを指します。 （ブログ・ニュース以外でも記事として成立するものであればarticleで囲みます）
記述例：
<article> <h1>ニュースタイトル</h1> <p> ニュース本文です。これはニュース本文のテキストになります。 </p> </article>
section
ページ内に章や項や節などを範囲指定するための要素です。
含んだ範囲を一つのセクションとして区切り、1章・2章・3章・・・のように章立てを行う際などに使用します。
必ずしもaritcle要素内で使用されるものではなくarticleの外でも使用することができます。
記述例：
<article> <h1>記事タイトル</h1> <section> <h2>第1章の記事</h2> <p>これは第1章の記事の本文のテキストです。</p> </section> <section> <h2>第2章の記事</h2> <p>これは第2章の記事の本文のテキストです。</p> </section> <section> <h2>第3章の記事</h2> <p>これは第3章の記事の本文のテキストです。</p> </section> </article>
footer
ページのフッター部分を範囲指定するための要素です。
フッター部分には通常、著作権表示・補足的なナビゲーション・連絡先などが服荒れることが想定されます。（ただしどれも必須というわけではなく、別の情報が含まれる場合もあります）
記述例：
<footer> <small>© 2019 hiroshinakazato All Rights Reserved.</small> <address>e-mail : info@hiroshinakazato.com</address> </footer>
small要素とaddress要素
small要素は注釈や免責事項、著作権表記などを指定する要素、address要素は問い合わせ先を指定する要素です。
