【注意】この文書にはより新しいバージョンが存在します: WCAG 2.1 達成方法集
この達成方法 (参考) の使用法と、この達成方法が WCAG 2.0 達成基準 (規定) とどのように関係するのかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) のセクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法の存在は、その技術があらゆる状況で WCAG 2.0 を満たすコンテンツを作成するために使用できることを意味するものではない。
関係のあるリンクを含む HTML5 文書
これは、次の達成基準に関連する達成方法である:
この達成方法の目的は、HTML5 nav 要素を使ってナビゲーションリンクをグループ化することである。nav 要素は、HTML5 のいくつかの区分される要素の一つである。このマークアップを使うと、スクリーンリーダーのような支援技術の利用者が過去に場所を確認してスキップしたリンクを分類するのが容易になる。セマンティックな構造を使うと、カスタムスタイルシートでそれらの関係性を維持しながらリンクのグループの提示を変更できる。nav 要素がページ上で複数回使用されている場合は、aria-label 又は aria-labelledby 属性を使用してナビゲーショングループを区別する。
リンクのグループ全てを nav 要素でマークアップする必要は無い。例として、リンクはリストのような他の構造にグループ化されることもあり、またはページの分離されたセクションを表現しない場合 ARIA マークアップを使うこともある。
訳注: WAIC では H97 に関するアクセシビリティ サポーテッド（AS）情報を提供している。
2020 年 3 月版の アクセシビリティ サポーテッド（AS）情報: H97 も参照されたい。
この例は、アクセシビリティカリキュラムにおけるナビゲーションリンクを分類するために nav 要素を使う。
コード例:
<nav>
<a href="../webaccessibility.html">Web Accessibility</a>
<a href="../docaccessibility.html">Document Accessibility</a>
<a href="../mobileaccessibility.html">Mobile Accessibility</a>
</nav>
この例は、文書中に一つ以上の nav 要素があるときに、ナビゲーション分類を識別するために aria-label 属性と nav 要素を使う。
コード例:
<nav aria-label="Site menu">
<ul>
<li>...a list of links site navigation link here ...</li>
</ul>
</nav>
...
<article>
<nav aria-label="Related links">
...a list of related links here ...
</nav>
</article> 以下の例は、同じページに二つ以上のナビゲーションメニューが存在し、ラベルとして参照されうるページ上に既存のテキストが無いという状況での良い事例である。
コード例:
<nav aria-label="primary">
<a href="home.html">Home</a>
<a href="about-us.html">About Us</a>
<a href="products.html">Products</a>
</nav>
<nav aria-label="secondary">
<a href="adverts.html">Our Advertisers</a>
<a href="related.html">Related Links</a>
<a href="subsidiaries.html">Subsidiaries</a>
</nav> この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。
視覚的に寄せ集められておりページのセクションを表現するリンクが nav 要素で囲まれていることを確認する。
上記 1. の結果が真である。
この達成方法が「十分な達成方法」の一つである場合、この手順や期待される結果を満たしていなければ、それはこの達成方法が正しく用いられていないことを意味するが、必ずしも達成基準を満たしていないことにはならない。場合によっては、別の達成方法によってその達成基準が満たされていることもありうる。