非テキストコンテンツのすぐ隣に別の場所へのリンクを置き、その別の場所で長い説明を提供する

達成方法に関する重要な情報

この達成方法 (参考) の使用法と、この達成方法が WCAG 2.1 達成基準 (規定) とどのように関係するのかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) のセクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法の存在は、その技術があらゆる状況で WCAG 2.1 を満たすコンテンツを作成するために使用できることを意味するものではない。

適用 (対象)

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

This technique relates to Success Criterion 1.1.1: Non-text Content (Sufficient).

解説

この達成方法の目的は、長い説明機能が直接組み込まれていない (例: longdesc)、又は機能がサポートされないことが確認されているウェブコンテンツ技術において、離れた場所にある長い説明へのリンクを提供することである。

この達成方法によって、長い説明が非テキストコンテンツとは別の場所に提供される。同じ URI の中の異なる場所、又は別の URI の場合もある。長い説明文へのリンクが非テキストコンテンツに近接して提供される。そのリンクは非テキストコンテンツの直前又は直後に提供できる。説明が他のテキストと一緒に配置されている場合、最後に「説明の終わり」と入れることで、いつ読み終えてメインコンテンツに戻るかがわかるようにする。「戻る」ボタンでジャンプしてきた場所に戻れない場合は、その非テキストコンテンツに戻るためのリンクを提供する。

この達成方法は、'longdesc’ が仕様に加えられる前に HTML で一般的に使用されていた。HTML では、通常、画像の隣に D を配置して、長い説明へのリンクとして実装していたため D リンクと呼ばれていた。この達成方法は技術に依存していないため、リンクをサポートするあらゆるウェブコンテンツ技術で利用できる。

事例

事例 1: 棒グラフ

ウェブページ に上位 3 名の販売員の売上げを示した棒グラフがある。

それには短いテキストによる代替があり、「上位 3 名の販売員の 10 月の売上げ表」と書かれている。

非テキストコンテンツの直後には長い説明文を示唆する小さな画像がある。その画像に対する代替テキストには「グラフの詳細な説明」と書かれている。画像は「このページのグラフの説明」という表題がつけられたページ下部のセクションへのリンクになっている。リンクは次のような具体的な説明を指している:「10 月の売上げはメアリーが 400 個でトップ、マイクが 389 個の僅差で続いており、クリスが 350 個でトップ 3 の最後となっている。[説明の終わり]」

事例 2: 棒グラフ -ユーザエージェントの「戻る」がセキュリティ上の理由からサポートされていない非 HTML 技術の場合

ウェブページ上に上位 3 名の販売員を表示した棒グラフがある。

それには短いテキストによる代替があり、「上位 3 名の販売員の 10 月の売上げ表」と書かれている。

非テキストコンテンツの直後には長い説明文を示唆する小さな画像がある。その画像に対する代替テキストには「グラフの詳細な説明」と書かれている。その画像は「10 月の売上げ報告にあるグラフの説明」というタイトルの別のページへリンクとなっている。その説明へのリンクは次のような具体的な説明を指している:「10 月の売上げはメアリーが 400 個でトップ、マイクが 389 個の僅差で続いており、クリスが 350 個でトップ 3 の最後となっている。説明の終わり。<link> 売上げグラフに戻る</link>

事例 4: 音声しか含まないファイルのトランスクリプト

マーチン ルーサー キングのスピーチの録音記録がある。音声ファイルへのリンクとその内容をテキストに書き起こしたトランスクリプトへのリンクが隣同士にある。

検証

手順

  1. 非テキストコンテンツの直前又は直後のリンクの存在を確認する。
  2. この特定の非テキストコンテンツの長い説明を直接指し示す有効なリンクであることを確認する。
  3. 長い説明が非テキストコンテンツと同じ情報を伝達していることを確認する。
  4. 利用者が非テキストコンテンツの元の場所に戻るためのリンク又は「戻る」機能の可用性を確認する。

期待される結果

上記の四つ全ての結果が真である。