<nav>要素

Technical Summary

Definition / Categories

項目	仕様上の整理
意味	同じページ内またはほかのページへの移動先を示すリンクを含むsection
Categories	Flow content、Sectioning content、Palpable content
Context	Sectioning contentが使用できる場所
Content model	Flow content
Tag omission	開始tag・終了tagとも省略できない
DOM interface	HTMLElement
HTML-AAM implicit role	navigation（landmark role）

仕様の意味は、ナビゲーションを目的とするsectionです。リスト要素を使うか、項目をいくつ含むかはnavの定義だけでは限定されません。

意味と適用範囲

HTML Standardは、navを「ほかのページまたは同じページ内の場所へ移動するリンクを含むsection」と定義し、主なnavigation blockに使うものと説明しています。ページ上のリンク群をすべてnavにする必要はありません。

サイトの主なメニュー、記事の目次、パンくずリストは代表的な例です。フッターにある利用規約や著作権情報などの短いリンク一覧は、通常、リンクがあるという理由だけでnavにする必要はありません。分類は見た目だけでなく、そのまとまりが担う案内の目的で判断します。

navはsectioning contentですが、見出しを自動で作ったり、リンクを自動生成したりしません。見出しが必要なときは別に見出し要素を置きます。アンカーの遷移は中にあるa要素とそのhrefが担います。

Content modelとDOM

Content modelはFlow contentです。順序が意味を持つ案内にはol、同列のリンクにはulを使う例が一般的ですが、リストは必須ではなく、文章などのFlow contentも入れられます。

DOM interfaceはHTMLElementです。専用のナビゲーションAPIや、navだけに定められたキーボード操作はありません。利用者は通常どおり中のリンクやコントロールへ移動します。視覚的な配置や色はCSSで決まり、要素の意味とは別に確認します。

const nav = document.querySelector('nav');

console.log(nav instanceof HTMLElement); // true
console.log(nav.localName);              // "nav"
console.log(nav.getAttribute('role'));   // null: role属性は指定していない

role属性がないことと、Accessibility Treeにroleがないことは同じではありません。HTML-AAMのimplicit roleと、ブラウザーが公開したAccessibility Treeの内容を別に調べます。

Accessibility / Landmark Name

HTML-AAM 1.0 Working Draft（2026-10-21）は、navの暗黙のroleをWAI-ARIAのnavigation roleに対応付けています。WAI-ARIAではnavigationはlandmarkです。ランドマークは、ページの大きな領域を支援技術から見つけ、移動する手がかりになります。

landmarkの名前は、その領域が何を案内するのかを伝えます。WAI-ARIA APGは、ページにnavigation landmarkが1つだけなら名前を省略でき、複数ある場合は目的が分かる名前を付けるよう勧めています。同じリンク群を同じ形で繰り返す場合は、同じ名前を付けます。これはAPGの実装指針として扱い、HTML StandardのContent modelとは分けます。

aria-labelまたはaria-labelledbyで名前を指定できます。HTML-AAMのname computationでは、参照されたラベルがほかの名前指定より優先されます。スクリーンリーダーはrole名を別に伝えるため、ラベル自体に「navigation」や「ナビゲーション」と重ねて書く必要はありません。特定の支援技術による発話は今回のブラウザー観測には含めません。

HTMLのnav要素を使えば暗黙のroleが伝わります。通常はrole="navigation"を重ねて指定する必要はありません。

Fact / Evidence（主張 / 根拠）

規範的なHTMLの定義、HTML-AAMのrole mapping、APGの実装指針を別の主張として整理します。

Evidence

1. HTML Living Standard, §4.3.4 The nav element — meaning, categories, context, content model, and the scope of navigation sections.
2. HTML Accessibility API Mappings 1.0 Working Draft, 2026-10-21 — implicit role and accessible-name mappings.
3. WAI-ARIA 1.2, navigation role — role definition and landmark semantics.
4. WAI-ARIA APG, Navigation Landmark — author guidance for one or multiple navigation landmarks and repeated link sets.
5. WPT at revision 68d964a5f292bc4b2c2eba2f21e2b916190b6ad2: html-aam/roles.html — the el-nav computed-role test.
6. WPT at the same revision: html-aam/names.html — navigation accessible-name sources and precedence.

Implementation Evidence

2026-10-25にChrome 155で選定WPT 188件を実行し、Chrome 156のローカルブラウザーで4ページを1280×720・390×844の2 viewportで確認しました。ライト・ダーク切替、ページの横はみ出し、ランドマーク名も観測しています。各結果は記録したブラウザーと範囲に限られます。スクリーンリーダーの発話とWindows platform accessibility APIは測定していません。

専用fixture: nav-v1の12項目はすべて成功しました。ランドマークのrole/name確認、4ページのviewport・theme観測、WPTの実行条件と対象範囲はdocs/atlas/nav-evidence-2026-10-25.mdに記録しています。

Coverage / Open Issues

• Specification checkedMeaning, categories, context, content model, and sectioning-content boundaries
• AAM checkedHTML-AAM navigation-role mapping and APG guidance for named and repeated landmarks
• WPT selected files runroles.html and names.html at one pinned revision
• OpenOther browsers, Windows UI Automation and other platform APIs, screen-reader speech, and the remainder of HTML-AAM/WPT coverage

Related surface

• Yugien: nav要素をやさしく確認
• English Atlas: The nav Element
• main要素: 主コンテンツと配置条件