達成基準 1.1.1: 非テキストコンテンツを理解する

意図

この達成基準の意図は、非テキストコンテンツにより伝達される情報を、テキストによる代替を用いることによってアクセシブルにすることである。テキストによる代替は、利用者の要求に合わせてあらゆる感覚モダリティ (例えば、視覚、聴覚、又は触覚) を通じてレンダリング可能なので、情報をアクセシブルにするための最も重要な方法である。テキストによる代替を提供することにより、情報を様々なユーザエージェントによって様々な方法でレンダリングすることを可能にする。例えば、写真を見ることのできない利用者は、合成音声を用いてテキストによる代替を読み上げさせることができる。また、音声ファイルを聞くことができない利用者は、テキストによる代替を表示させることで、読むことができるようになる。将来的には、テキストによる代替は、情報を手話又は同じ言語のより単純な形式に、より容易に変換することも可能になるだろう。

CAPTCHA に関する注記

CAPTCHA は、アクセシビリティのコミュニティにおいて、議論の的になるトピックの一つである。Inaccessibility of CAPTCHA で説明されているように、CAPTCHA はもともと、機械的な自動処理を排除しようとして、人間の能力の効果を追求するものである。特定の障害のある利用者は、あらゆる種類の CAPTCHA が解釈できないであろう。しかし、CAPTCHA は広く使われており、WCAG ワーキンググループは、もし CAPTCHA が完全に禁止されてしまったら、ウェブサイトは CAPTCHA の使用を断念するのではなく、WCAG に適合しないことを選択するだろうと考える。このことは、障害のある、非常に多くの利用者に対しての障壁を引き起こす。このため、ワーキンググループは、障害のある利用者のほとんどの要求を満たし、その上ウェブサイトが採用可能だと考えられる方法で、CAPTCHA に関する要件を構築することを選択した。異なる二つの形態の CAPTCHA をサイト上で提供することを要件として、障害のある利用者のほとんどが使用できる形式を見つけられるようにした。

中には最低限の要件を満たしているサイトに、それでもアクセスできない障害のある利用者もいるため、ワーキンググループは追加の手順に関する推奨を提供している。WCAG に適合する意欲のある組織は、このトピックの重要性を認識することが望ましく、かつ可能な限りこのガイドラインの最低要件を遥かに超えることが望ましい。追加の推奨される手段は、以下のものがある:

CAPTCHA を二つよりも多くのモダリティで提供する
CAPTCHA を回避できる、カスタマーサービスの担当者へのアクセスを提供する
認証された利用者には CAPTCHA を要求しない

補足情報

非テキストコンテンツには様々な形態があり、この達成基準ではそれぞれをどのように扱うべきかを特定している。

下記のその他の状況のいずれも適用されない非テキストコンテンツ (例: グラフ、図表、録音した音声、写真、及びアニメーション) の場合、テキストによる代替はあらゆる感覚モダリティ (例えば、視覚、聴覚、又は触覚) によってレンダリング可能な形態で同じ情報を入手可能にできる。短い、及び長いテキストによる代替は、非テキストコンテンツにある情報を伝達するのに必要に応じて用いられる。収録済の音声しか含まないファイル及び収録済の映像しか含まないファイルは、ここで扱われている。ライブの音声しか含まないファイル及びライブの映像しか含まないファイルは、以下で扱われている (この段落の三つ後の段落を参照のこと)。

コントロール又は利用者の入力を受け入れる非テキストコンテンツ、例えば、送信ボタンとして用いられる画像、イメージマップ、又は複雑なアニメーションなどの場合、名前は、少なくともその非テキストコンテンツが何で、なぜそこにあるのかを認識できるように、その非テキストコンテンツの目的を説明するために提供される。

時間依存のメディアである非テキストコンテンツは、1.2: Time-Based Media によりアクセシブルになる。しかし、利用者がそのメディアを利用したいことがもしあれば、利用者がどんな動作をするかを解決できるので、利用者がページ上でそのメディアに出会ったときに、そのメディアが何であるかを知ることが重要である。したがって、時間依存のメディアを説明する、及び／又はそのメディアのタイトルを示すテキストによる代替を提供する。

ライブの音声しか含まないコンテンツ及びライブの映像しか含まないコンテンツの場合、それらと同じ情報を示すテキストによる代替を提供することは、はるかに困難なこともありうる。このようなタイプの非テキストコンテンツに対しては、テキストによる代替は説明ラベルを提供する。

テスト又は演習が、部分的又は全体的に非テキストの形式で提示されなければならないことがある。そのテスト又は演習は、聴覚又は視覚を用いて行う必要があるため、音声又は視覚情報はテキストに変換することのできないものとして提示される。例えば、ヒアリングテストは、もしテキストによる代替が提供されるなら、効力がないだろう。視覚能力向上のための演習も、テキスト形式では同様に意味を成さない。さらに、テキストによる代替のあるスペルのテストもあまり効果がない。このような場合には、テキストによる代替は非テキストコンテンツの目的を説明するために提供されることが望ましい。もちろん、そのテキストによる代替は、テストに合格するために必要な情報と同じものは提供しないことになる。

言葉で完全に捉えられない特定の感覚的体験を作り出すことを主な目的とするコンテンツもある。例としては、交響楽団の演奏、視覚的な芸術作品などが挙げられる。そのようなコンテンツの場合、テキストによる代替は、少なくとも説明ラベルをもつ非テキストコンテンツ及び、可能ならば追加のテキストで特定できるようにする。ページにそのコンテンツを含む理由が分かっていて、かつ説明できる場合、その情報を含めることは役立つ。

利用者が人間であることを証明するために用いられる、非テキストのテスト。スパムロボットやその他のソフトウェアがサイトにアクセスしてくるのを回避するために、CAPTCHA と呼ばれている仕掛けが用いられる。CAPTCHA には通常、今日のウェブロボットの能力を超えた視覚的又は聴覚的な課題を伴う。しかし、その課題に対してテキストによる代替を提供することは、ロボットでも操作可能なものにしてしまい、結果としてその目的を挫折させてしまう。このような場合、テキストによる代替は、CAPTCHA の目的を説明し、かつ、様々な障害のある利用者の要求に対処するために、異なるモダリティを用いた代替形式が提供される。

利用者が視覚的に確認したり、理解したりすることを実際には意図していない非テキストコンテンツ。ページ上でテキストを移動させるために用いる透過画像、ログ解析のために用いる非表示の画像、情報を伝えていないが、単に空白を埋めて美しい効果を作り出すコーナーのスウォール (渦巻き) などは、すべてこの例である。そのような画像にテキストによる代替を置くことは、スクリーンリーダーの利用者をそのページのコンテンツに集中できなくさせるだけである。しかし、形はどうあれコンテンツをマークアップしないことは、非テキストコンテンツがどのようなものか、(実際には何も見逃していないにもかかわらず) どのような情報を見逃していたのかを利用者に推測させてしまうことになる。そのため、このような非テキストコンテンツについては、支援技術 (AT) がそれを無視して、かつ利用者に何も提示しない方法でマークアップ又は実装する。

メリット

この達成基準は、視覚的なコンテンツを知覚するのが困難な利用者の役に立つ。支援技術が、テキストを読み上げたり、視覚的に提示したり、点字に変換したりすることができるようになる。
テキストによる代替は、写真、図面、その他の画像 (例えば、線画、グラフィックデザイン、絵画、3D 表現)、グラフ、図表、アニメーションなどの意味を理解するのが困難な利用者の役に立つことがある。
ろう、難聴、又は何らかの理由で音声情報を理解するのが困難な人が、テキストによる提示を読むことができる。テキストを手話に自動翻訳する研究が現在進められている。
盲ろうの利用者が、テキストを点字で読むことができるようになる。
加えて、テキストによる代替は非テキストコンテンツの検索する能力を支援し、コンテンツを様々な方法で再利用できるようにする。

事例

データのグラフ

6 月、7 月、そして 8 月にどれだけの数の商品が売れたかを比較している棒グラフがある。短いラベルには、「図 1 - 6 月、7 月、8 月の売上」と書かれている。長い説明は、グラフの種類を特定し、そのグラフから見てとれるものに相当する、データ、傾向及び意味合いの高レベルな概要を提供している。可能かつ実用的な場合には、実際のデータが表で提供されている。
演説を録音した音声

「議会での議長の演説」という音声クリップへのリンクがある。そして、音声クリップへのリンクの直後に、テキストの書き起こしへのリンクが提供されている。
車のエンジンがどのように動くのかを説明するアニメーション

車のエンジンがどのように動くのかを見せているアニメーションがある。音声はなく、そのアニメーションはエンジンがどのように動くかを説明するチュートリアルの一部である。チュートリアルのテキストがすでに完全な説明をしているため、そのアニメーションはテキストの代替物であり、画像はテキストの代替物であり、テキストによる代替はそのアニメーションの簡潔な説明のみを含み、詳細についてはチュートリアルのテキストを参照している。
交通情報ウェブカメラ

利用者がある大都市の至る所に設置された様々なウェブカメラを選択できるウェブサイトがある。どれか一つのカメラを選択すると、画像が 2 分おきに更新される。短いテキストによる代替では、そのウェブカメラを「交通情報ウェブカメラ」と説明している。そのサイトでは、ウェブカメラで扱われる経路のそれぞれの所要時間を表で提供している。その表も 2 分おきに更新されている。
ニュース記事にある歴史的な出来事の写真

握手を交わしている 2 人の世界的指導者の写真が国際首脳会議に関するニュース記事に添えられている。テキストによる代替には、「X 国の X 大統領が、Y 国の Y 首相と握手している。」と記述されている。
外交関係を議論するコンテンツにある歴史的な出来事の写真

同じ写真が外交会談のニュアンスを説明するために、異なる文脈で使われている。首相と握手している大統領の画像が、複雑な外交関係を議論しているウェブサイトに掲載されている。最初のテキストによる代替には、「X 国の X 大統領が、2009年 1 月 2 日に、Y 国の Y 首相と握手している。」と書かれている。追加のテキストによる代替は、両首脳の顔の表情だけでなく 2 人が立っている部屋の説明もしており、さらに、その部屋にいる他の人を明らかにしている。その追加の説明は、写真と同じページに含まれるかもしれないし、リンク又はその他の標準的なプログラムによるメカニズムによってその画像と関連付けられた別のファイルに含まれるかもしれない。
記者会見を録音した音声

ウェブページに、記者会見を録音した音声へのリンクがある。リンクテキストは、録音された音声を示している。また、そのページには記者会見のテキストによる書き起こしへのリンクもある。テキストによる書き起こしには、話者が発言したすべての逐語的な記録が含まれる。そこには、例えば、喝采、笑い、聴衆からの質問など、その録音の一部であるその他の重要な音声に言及するだけでなく、誰が話しているのかも記されている。
E-ラーニングアプリケーション

回答が正しいかどうかを示すために効果音を用いている E-ラーニングアプリケーションがある。チャイム音はその回答が正解であることを示し、ビープ音はその回答が不正解であることを示している。テキストの説明もあるため、その音を聞いたり理解したりすることができない利用者も、その回答が正解かどうかを理解できる。
リンクのあるサムネイル画像

「スモールヴィルタイムス」のウェブサイトにリンクしている、新聞の一面のサムネイル画像がある。そのテキストによる代替には、「スモールヴィルタイムス」と記述されている。
異なるサイトで使われている同じ画像

世界地図の画像に対する異なる代替の例: 旅行サイトで海外旅行コーナーへのリンクとして用いられている世界地図の画像には、「海外旅行」というテキストによる代替がある。同じ画像が、「国際キャンパス」というテキストによる代替とともに、ある大学のウェブサイトでリンクとして用いられている。
イメージマップ

ビルの見取り図のイメージマップ画像は操作可能で、利用者が特定の部屋を選択して、その部屋に関する情報のあるページへ移動できる。「ビルの見取り図。詳細については部屋を選択してください。」という短いテキストによる代替が、そのイメージマップの画像と操作の目的を説明している。

達成方法

この節にある番号付きの各項目は、WCAG ワーキンググループがこの達成基準を満たすのに十分であると判断する達成方法、又は複数の達成方法の組み合わせを表している。しかしながら、必ずしもこれらの達成方法を用いる必要はない。その他の達成方法についての詳細は、WCAG 達成基準の達成方法を理解するの「その他の達成方法」を参照のこと。

十分な達成方法

そのコンテンツに合致する状況を以下から選択すること。それぞれの状況には、WCAG ワーキンググループがその状況において十分であると判断する、番号付の達成方法 (又は、達成方法の組み合わせ) がある。

状況 A: 短い説明が非テキストコンテンツと同じ目的を果たし、かつ同じ情報を提示できる場合:

次に挙げる状況 A における短いテキストによる代替の達成方法のいずれかを用いて、G94: 非テキストコンテンツに対して、それと同じ目的を果たし、かつ同じ情報を示す、短いテキストによる代替を提供する:

状況 A における短いテキストによる代替の達成方法:

状況 B: 短い説明が非テキストコンテンツと同じ目的を果たせず、かつ同じ情報を提示できない場合 (例: チャート又は図表):

次に挙げる状況 B における短いテキストによる代替の達成方法のいずれかかつ、状況 B における長いテキストによる代替の達成方法のいずれかを用いて、G95: 非テキストコンテンツの簡単な説明を提供する、短いテキストによる代替を提供する:

状況 B における短いテキストによる代替の達成方法:

状況 B における長いテキストによる代替の達成方法:

状況 C: 非テキストコンテンツがコントロールである、又は利用者の入力を受け入れる場合:

次に挙げる状況 C におけるコントロールと入力のための短いテキストによる代替の達成方法のいずれかを用いて、G82: 非テキストコンテンツの目的を特定するテキストによる代替を提供する:

状況 C におけるコントロールと入力のための短いテキストによる代替の達成方法:

状況 D: 非テキストコンテンツが時間依存のメディアである (ライブの映像しか含まないコンテンツ及びライブの音声しか含まないコンテンツを含む)、テキストで提示されると無効になるテスト又は演習である、又は、特定の感覚的体験を創り出すことを主に意図しているコンテンツである場合:

次に挙げる状況 D における短いテキストによる代替の達成方法のいずれかを用いて、ラベルを記述する:
次に挙げる状況 D における短いテキストによる代替の達成方法のいずれかを用いて、G68: ライブの音声のみのコンテンツ及びライブの映像のみのコンテンツの目的を説明するために、短いテキストによる代替を提供する:
次に挙げる状況 D における短いテキストによる代替の達成方法のいずれかを用いて、G100: 非テキストコンテンツの一般に認められた名前 (name) 又は説明的な名前となる短いテキストによる代替を提供する:

状況 D における短いテキストによる代替の達成方法:

状況 E: 非テキストコンテンツが CAPTCHA である場合:

G143: CAPTCHA の目的を説明するために、テキストによる代替を提供する、かつ、G144: 異なるモダリティを用いて同じ目的を果たす、もう一つの CAPTCHA がウェブページに含まれていることを確認する

状況 F: 非テキストコンテンツを支援技術が無視することが望ましい場合:

次に挙げる状況 F における必須ではないテキストによる代替を示す達成方法のいずれかを用いて、支援技術によって無視することができるように、非テキストコンテンツを実装またはマーク付けする:

状況 F における必須ではないテキストによる代替を示す達成方法:

参考達成方法

適合のために必須ではないが、コンテンツをよりアクセシブルにするために、次の追加の達成方法を検討することが望ましい。ただし、すべての状況において、すべての達成方法が使用可能、又は効果的であるとは限らない。

HTML の達成方法（参考）

H46: embed 要素と一緒に noembed 要素を用いる

CSS の達成方法 (参考)

C18: レイアウトデザインのためのスペーサー画像ではなく、CSS のマージンとパディング規則を使用する

失敗例

以下に挙げるものは、WCAG ワーキンググループが達成基準の失敗例とみなした、よくある間違いである。

テストルール

以下は、この達成基準の特定の側面に関するテストルールである。この特定のルールを使用して WCAG に適合しているかどうかを確認する必要はないが、これらのルールは定義され、承認されたテスト方法である。テストルールの使用については、WCAG 達成基準のテストルールを理解するを参照のこと。

重要な用語

ASCII アート (ASCII art)

文字又はグリフの空間的配置によって作られた図画 (典型的には、ASCII で定義されている 95 の印字可能文字から作られる)。

支援技術 (assistive technology)

障害のある利用者の要件を満たすために、主流のユーザエージェントが提供する機能を超えた機能を提供するような、ユーザエージェントとして動作する、又は主流のユーザエージェントと共に動作するハードウェア及び／又はソフトウェア。

注記

支援技術が提供する機能としては、代替の提示 (例: 合成音声や拡大表示したコンテンツ)、代替入力手法 (例: 音声認識)、付加的なナビゲーション又は位置確認のメカニズム、及びコンテンツ変換 (例: テーブルをよりアクセシブルにするもの) などを挙げることができる。

注記

支援技術は、API を利用、監視することで、主流のユーザエージェントとデータやメッセージのやりとりをすることが多い。

注記

主流のユーザエージェントと支援技術との区別は、絶対的なものではない。多くの主流のユーザエージェントは、障害者を支援する機能を提供している。基本的な差異は、主流のユーザエージェントが障害のある人もない人も含めて、広く多様な利用者を対象にしているのに対し、支援技術は、特定の障害のある利用者という、より狭く限られた人たちを対象にしているということである。支援技術により提供される支援は、対象とする利用者に特化した、よりニーズに適したものである。主流のユーザエージェントは、プログラムオブジェクトからのウェブコンテンツの抽出、マークアップの識別可能な構造への解釈といった、重要な機能を支援技術に対して提供する場合がある。

この文書の文脈において重要な支援技術としては、以下のものが挙げられる:

画面拡大ソフト及びその他の視覚的な表示に関する支援技術。視覚障害、知覚障害、及び読書困難などの障害のある人が、レンダリング後のテキスト及び画像の視覚的な読みやすさを改善するために、テキストのフォント、サイズ、間隔、色、音声との同期などを変更するのに使用している。
スクリーンリーダー。全盲の人がテキスト情報を合成音声あるいは点字で読み取るために使用している。
音声変換ソフトウェア。認知障害、言語障害、及び学習障害のある人が、テキストを合成音声に変換するために使用している。
音声認識ソフトウェア。何らかの身体障害のある利用者が使用することがある。
代替キーボード。特定の身体障害のある人がキーボード操作をシミュレートするのに使用している (ヘッドポインタ、シングルスイッチ、呼気・吸気スイッチ、及びその他の特別な入力デバイスを使った代替キーボードを含む)。
代替ポインティングデバイス。特定の身体障害のある人がマウスポインタとボタンの動きをシミュレートするのに使用している。

CAPTCHA

コンピュータと人間とを判別する完全自動化されたチューリングテスト (Completely Automated Public Turing test to tell Computers and Humans Apart) の頭文字語。

注記

CAPTCHA のテストは多くの場合、利用者に対し、不明瞭な画像又は音声ファイルによって提示されたテキストを入力するよう求める。

注記

チューリングテストは、人間とコンピュータを区別することを目的としたテストの仕組みである。その名は、高名なコンピュータ科学者のアランチューリングにちなんでいる。この用語は、カーネギーメロン大学の研究者たちによる造語である。

コンテンツ (content)

コンテンツの構造、提示、及びインタラクションを定義するコード又はマークアップも含めて、ユーザエージェントによって利用者に伝達される情報及び感覚的な体験。

自然言語 (human language)

人間とコミュニケーションをとるために話される、書かれる、又は (視覚的もしくは触覚的な手段で) 手話にされる言語。

注記

手話も参照。

ラベル (label)

テキスト、又はテキストによる代替を伴うコンポーネントで、ウェブコンテンツ内のコンポーネントを識別するために利用者に提示されているもの。

注記

名前 (name) は隠されていて、支援技術に対してだけ公開される場合がある一方で、ラベルはすべての利用者に提示される。多くの場合 (すべてではないが)、名前 (name) とラベルは同じである。

注記

ラベルという用語は、HTML における label 要素だけに限定されない。

名前 (name)

ソフトウェアが、ウェブコンテンツのコンポーネントを利用者に識別させることができるテキスト。

注記

ラベルはすべての利用者に提示される一方で、名前 (name) は隠されていて、支援技術に対してだけ明らかにされる場合もある。多くの場合 (すべてではないが)、ラベルと名前 (name) は同じである。

注記

これは、HTML の name 属性とは関係がない。

非テキストコンテンツ (non-text content)

プログラムによる解釈が可能な文字の並びではないコンテンツ、又は文字の並びが自然言語においても何をも表現していないコンテンツ。

注記

これには、 (文字による図画である) ASCII アート、顔文字、 (文字を置き換える) リートスピーク、文字を表現している画像が含まれる。

提示 (presentation)

利用者が知覚できる形式でコンテンツをレンダリングすること。

プログラムによる解釈 (programmatically determined)

支援技術を含む様々なユーザエージェントが抽出でき、利用者に様々な感覚モダリティで提示できるような形のデータがコンテンツ制作者によって提供されたとき、そのデータがソフトウェアによって解釈されること。

マークアップ言語で、一般に入手可能な支援技術が直接アクセスできる要素と属性から解釈される。

非マークアップ言語の技術特有のデータ構造から解釈され、一般に入手可能な支援技術がサポートするアクセシビリティ API を通じて支援技術に提供される。

純粋な装飾 (pure decoration)

見栄えのためだけのもので、情報は提供せず、機能性も備えていないもの。

注記

テキストが純粋な装飾といえるのは、単語を並べ替え、又は置き換えても意図が変わらないときだけである。

背景にとても淡い文字で単語がランダムに並んでいる辞書の表紙。

手話 (sign language)

意味を伝えるために、手と腕の動き、顔の表情又は身体の姿勢の組み合わせを用いる言語。

特定の感覚的な体験 (specific sensory experience)

純粋な装飾ではなく、かつ、重要な情報を伝える、又は機能を果たすことを主としない、感覚的な体験。

フルートのソロ演奏、視覚芸術の作品などが例として挙げられる。

構造 (structure)

ウェブページの各部を相互の関係性によりまとめる方法論。及び、
一連のウェブページをまとめる方法論。

テキスト (text)

プログラムによる解釈が可能な文字の並びで、自然言語で何かを表現しているもの。

テキストによる代替 (text alternative)

非テキストコンテンツとプログラムで関連付けられるテキスト、又は非テキストコンテンツとプログラムで関連付けられるテキストから参照されるテキスト。プログラムで関連付けられたテキストとは、その場所を、非テキストコンテンツからプログラムによる解釈が可能なテキストである。

チャートの画像があり、その直後の段落にテキストによる説明がある。チャートに対する短いテキストによる代替で後に説明があることを示している。

注記

より詳細な情報は、テキストによる代替を理解するを参照。

ユーザエージェント (user agent)

ウェブコンテンツを取得して利用者に提示するあらゆるソフトウェア。

ウェブコンテンツの取得、レンダリング及びインタラクションを支援する、ウェブブラウザ、メディアプレーヤ、プラグイン、及びその他のプログラム (支援技術も含む)。

ウェブページ (web page)

単一の URI から HTTP で得た埋め込まれていないリソースに加え、レンダリングに使われる、又はユーザエージェントがこのリソースと一緒にレンダリングすることを意図しているその他のあらゆるリソースを合わせたもの。

注記

どのような「その他のリソース」も主たるリソースと一緒にレンダリングされるであろうが、これらのリソースが同時にレンダリングされるとは限らない。

注記

このガイドラインの適合範囲に含まれる対象となるウェブページとみなされるためには、リソースが「埋め込まれていない」リソースでなければならない。

単体のウェブリソースであり、埋め込まれている画像及びメディアのすべてを含んだもの。

Asynchronous JavaScript and XML (AJAX) を用いたウェブメールのプログラム。そのプログラム全体は http://example.com/mail に存在しているが、受信トレイ、連絡先、カレンダーがある。受信トレイ、連絡先、又はカレンダーを表示するリンク又はボタンが提供されているが、全体としてページの URI は変更されない。

カスタマイズ可能なポータルサイトで、利用者が様々なコンテンツモジュールのセットから表示させるコンテンツを選択できるようなもの。

ブラウザで "http://shopping.example.com/" へ行くと、映画のようなインタラクティブなショッピング環境になる。そこでは、視覚的に店内を移動して、店内の棚から商品をドラッグして、目の前にある視覚的な買物カゴに商品を入れる。商品をクリックすると、同時に仕様書が浮き上がるように表示される。これは 1 ページだけのウェブサイトかもしれないし、ウェブサイトの中のほんの 1 ページなのかもしれない。