WCAG 2.0 実装方法集

メインコンテンツへスキップ

-

G65: パンくずリストを提供する

適用(対象)

全てのウェブコンテンツ技術

これは、次の達成基準に関連する実装方法である:

解説

パンくずリストは、コンテンツがどのような構造になっていたのか、及びこれまでにたどってきたウェブページへ戻る方法を、利用者が想起する助けとなり、また一連のウェブページの中で現在位置を特定する。パンくずリストには、利用者がそのウェブページに到達するまでに通ってきた場所、又はサイトの編成における現在のウェブページの位置が表示されている。

パンくずリストは、現在のウェブページまでナビゲートする途中にアクセスしたウェブページへのリンクを使って実装される。パンくずリストは、ウェブページ一式の各ウェブページの中で同じ位置に置く。

目に見える区切り文字でパンくずリストの中の項目を切り離すと、利用者の助けになる。区切り文字の例には「>」、「|」、「/」、及び「::」がある。

事例

事例 1

開発者が、ハイパーリンクを作成する方法を見つけるために、オーサリングツールのメーカーのウェブサイトの中を探している。検索結果を使って、オーサリングツールを使用してハイパーリンクを作成するための詳しい説明があるウェブページへ行く。そのページには、以下のようなリンクでできたパンくずリストがある:

コード例:


ホーム :: デベロッパーセンター :: 手引き

この例では、パンくずリストには現在のウェブページのタイトルである「ハイパーリンクを作成する方法」が含まれていない。その情報はウェブページのタイトルとして入手できる。

事例 2

写真家の作品集のウェブサイトはいろいろなギャラリーに分かれていて、各ギャラリーはさらに分類ごとに分割されている。サイトの中でジェンツーペンギンの写真を含むウェブページに移動する利用者は、ウェブページの冒頭で以下のようなパンくずリストを見る:

コード例:


ホーム / ギャラリー / 南極大陸 / ペンギン / ジェンツーペンギン 

「ジェンツーペンギン」を除くすべての項目がリンクとして実装されている。現在位置(ジェンツーペンギン)はパンくずリストに含まれているが、リンクとしては実装されていない。

参考リソース

この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。

検証

チェックポイント

ウェブページの中にパンくずリストが実装されているとき:

  1. あるウェブページに移動する。

  2. パンくずリストが表示されている。

  3. パンくずリストが、現在位置に達する正しい案内の順序、又はサイト構造において現在位置までの正しい階層の経路を表示している。

  4. 現在位置を含んでいないパンくずリストに:

    1. パンくずリストのすべての要素がリンクとして実装されている。

  5. 現在位置を含んでいるパンくずリストに:

    1. 現在位置を除くすべての要素がリンクとして実行されている。

    2. 現在位置がリンクとして実装されていない。

  6. すべてのリンクが、パンくずリストによって指定された正しいウェブページへ移動する。

判定基準

注意: この実装方法が「達成基準を満たすことのできる実装方法」の一つである場合、このチェックポイントや判定基準を満たしていなければ、それはこの実装方法が正しく用いられていないことを意味するが、必ずしも達成基準を満たしていないことにはならない。場合によっては、別の実装方法によってその達成基準が満たされていることもありうる。

日本語訳における注記:

この文書の正式版は、W3Cサイトで公開されている英語の文書であり、この日本語訳には誤訳が含まれていることもありえます。なお、文中にある「日本語訳における注記」は、W3Cの原文にはないものであり、日本語訳監修者が追記したものです。