nav要素

グローバルナビゲーション、サイドに表示するメニュー、フッター部のメニューなど、リンクのグループを表す場合に使用します。

サンプルコード

<header>
	<p class="logo">サイトロゴ</p>
	<nav>
		<ul>
			<li><a href="/service">サービス一覧</a></li>
			<li><a href="/products">製品紹介</a></li>
			<li><a href="/member">メンバー紹介</a></li>
			<li><a href="/blog">ブログ</a></li>
		</ul>
	</nav>
</header>

カテゴリー

フローコンテンツ、セクショニングコンテンツ、パルパブルコンテンツ
コンテンツモデル

フローコンテンツ
使用ケース

フローコンテンツが期待される場所（ただし、main要素を子孫要素に持つことはできない）

属性

グローバル属性: グローバル属性のみ使用することができます。
グローバル属性について詳しくは、「HTMLのグローバル属性」をご覧ください。

使用例

フッター部分のナビゲーションを想定したサンプルコード

サイトのページ下部によく設置されているナビゲーションを想定したHTMLサンプルコードです。
同じようにして、サイドメニューや特定ページのみ表示するサブメニューなどでも使うことができます。

セクショニングコンテンツですが、見出しがなくても問題ありません。

<!-- フッター -->
<footer>
	<nav>
		<ul>
			<li><a href="/access">アクセス</a></li>
			<li><a href="/privacy">プライバシーポリシー</a></li>
			<li><a href="/faq">よくある質問</a></li>
			<li><a href="/contact">お問い合わせ</a></li>
		</ul>
	</nav>
	<p class="copyright">Copyright©2016 サンプルコード</p>
</footer>
<!-- //フッター -->

こちらの記事は役に立ちましたか？

ありがとうございます。
もしよろしければ、あわせてフィードバックや要望などをご入力ください。

コメントありがとうございます！
運営の参考にさせていただきます。