ナビゲーション要素(<nav>
) は、その内容がページ上の主要なナビゲーション (他のページやページ内の他の部分へのリンク) である事を表します。
使用上の注意:
<nav>
要素は主要なナビゲーションにのみ用います。ページ上の全てのリンク集合に使用するのは誤りです。 ページの<footer>
要素によくリンクのリストが設置されますが、同じページ上の他部位に主要なナビゲーションが存在する場合はそちらを<nav>
要素でマークアップし、フッター側にはこれを用いるべきではありません。仮にページ上に主要なナビゲーションが存在しなかったとしても、フッター部分に配置したリンク集合が主要なナビゲーションとは言い難い場合(※例えばトップページや主用ページなどへのリンク集合でなく、著作権情報、使用条件、免責事項などで構成されたものである場合)は、やはり<nav>
でのマークアップは適切ではありません。その様な用途には<footer>
要素が適切です。<nav>
要素はページ上に一つしか設置してはならないというわけではありません。文書にグローバルナビゲーション(※サイトの主要なページへのリンク集合の通称)とローカルナビゲーション(※そのページ上の各セクションへのリンク集合の通称)が有れば、これらは何れも主要なナビゲーションといえます。その場合、その両方を<nav>
でマークアップするのは適切であるといえます。- スクリーンリーダーのようなユーザーエージェントはこの要素を、その内容の初期表示を省略するかどうかを確認する用途で使用できます。
コンテンツカテゴリ | フローコンテンツ、セクショニングコンテンツ、パルパブルコンテンツ |
---|---|
許可された内容 | フローコンテンツ |
タグの省略 | 不可。開始と終了タグの両方が必要。 |
許可された親要素 | フローコンテンツを受け入れるすべての要素 |
DOM インターフェイス | HTMLElement |
属性
この要素には、全ての要素で使用可能なグローバル属性以外に指定可能な属性はありません。
例
<nav> <ul> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul> </nav>
仕様
仕様書 | 策定状況 | コメント |
---|---|---|
WHATWG HTML Living Standard <nav> の定義 |
現行の標準 | 最新の W3C スナップショットから変更なし |
HTML5 <nav> の定義 |
勧告 | 最初の定義 |
ブラウザ実装状況
機能 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
基本サポート | 5 | 4.0 (2.0) | 9.0 | 11.10 | 4.1 |
機能 | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
基本サポート | 2.2 | 4.0 (2.0) | 9.0 | 11.0 | 5.0 (iOS 4.2) |
関連情報
- 他のセクション関連要素:
<body>
、<article>
、<section>
、<aside>
、<h1>
、<h2>
、<h3>
、<h4>
、<h5>
、<h6>
、<hgroup>
、<header>
、<footer>
、<address>
- HTML5 文書のセクションとアウトライン