<nav>要素
英語で「航法」や「交通」を表す”navigation”より。
現在の文書内の他の部分や他の文書へのナビゲーションリンクを提供するためのセクションを表します。ナビゲーションセクションの一般的な例としてメニュー、目次、索引などがあります。
<nav> 要素はあくまでも、文書の「意味的なまとまり」を表すためのものなので、標準では見た目は何も変わりません。
「ナビゲーションリンクを提供するためのセクション」ということですが、文書内のすべてのリンクを <nav> 要素に入れる必要はありません。
一般的には、サイドメニューやグローバルメニューなど、「リンク」を集めたようなセクションを表す際に用いられることが多いようです。
<nav>要素は文書内に複数用いることが出来ます。そのような場合は、アクセシビリティを強化するために、aria-labelledby属性を使用することが出来ます。
子要素として使用できるもの
フローコンテンツを記述できます。
親要素として使えるもの
フローコンテンツを受け入れるすべての要素。
許可されている ARIA ロール
なし
DOMインターフェース
HTMLElement
属性
グローバル属性のみが指定できます。
サンプル
以下の例では、他の文書の「意味的なまとまり」を表すための要素も合わせて作成した例を示します。
See the Pen KKKXxdX by Masahiko Iwakiri (@m-iwakiri) on CodePen.
このサイトでは、HTML要素や属性の定義は下記サイトを参考にしています。
MDN Web Docs： https://developer.mozilla.org/ja/
W3C仕様の正確な定義、最新情報は上記サイトをご覧ください。
コメント