「非テキストコンテンツ」というのは、端的には画像、動画、音声です。またフォームの入力欄も非テキストコンテンツです。本達成基準では、こういった非テキストコンテンツを知覚できない利用者に対しての対応を求めています。非テキストコンテンツを知覚できない利用者の例は、画像、動画であれば、視覚障害者（全盲、ロービジョン、高齢者）。音声であれば、聴覚障害者があたります。こういった利用者に向けて、非テキストコンテンツには、非テキストコンテンツを理解あるいは識別できる代替テキストを付与してください。
収録済みの動画の場合は、"音声のみ及び映像のみ (収録済)"、"キャプション (収録済)"、"音声解説、又はメディアに対する代替 (収録済)"、"キャプション (ライブ)"、"音声解説 (収録済)"、"手話 (収録済)"、"拡張音声解説 (収録済)"、"メディアに対する代替 (収録済)"を参照してください。
ライブ動画の場合は、"キャプション (ライブ)"を参照してください。
収録済みの音声の場合は、"音声のみ及び映像のみ (収録済)"、"メディアに対する代替 (収録済)"を参照してください。
ライブ音声の場合は、"音声のみ (ライブ)"を参照してください。
入力欄などのフォームの部品に関しては、"情報及び関係性"、"見出し及びラベル"、"ラベル又は説明"を参照してください。
画像の場合は、本項目を参照してください。
画像の代替テキストはaltと呼ばれるHTMLの属性値を用いて設定します。
画像化された文字（文字画像）であれば、原則、画像と一致するaltを付与してください。あわせて、本当にその文字を画像化すべきか、よく吟味してください。
装飾目的の画像の場合、altを空することで、支援技術がこの画像を無視できるようになります。この場合でも<img src="" alt="">とするようにして、<img src="">というように、alt属性値そのものを省略しないようにしてください。なおHTML5以降においては、alt省略の例外がありますが、この例外を適用するためには、HTML5以降の仕様をよく理解した上で適用してください。
alt=" "など空白文字をaltにいれておくと、スクリーンリーダごとに対応が異なるので、装飾目的の画像の場合は、空白文字でなく空文字にするほうがベターです。全角空白や は、空白文字の扱いにすらならないので、これらの文字のみでaltとするのは避けてください。
ちなみに、role="presentation"というように、装飾目的であることを属性値で明示すると、このアクセシビリティチェッカーのチェック時に警告が出なくなりますが、決してrole="presentation"の濫用を推奨するものではありません。
なお装飾目的の画像については、CSSで背景として設定することも有効ですが、逆に意味のある画像をCSSの背景画像にしないように注意してください"F3: 達成基準 1.1.1 の失敗例 － 重要な情報を伝える画像を付加するために、CSS を使用している"。
低速回線環境の利用者が、画像表示をオフにしていることがあります。適切なaltは、「画像をあえて表示するかどうか」の判断にもなるので、なるべく丁寧にいれてください。
画像が存在するが、付近に画像と重複する文字列がある場合、altを省略することが有効な場合があります（Aさんの画像があり、その付近に「Aさん」と書いてあるような場合、「Aさん」あるいは「Aさんの画像」といったaltは省略したほうが、スクリーンリーダには読みやすい場合があります）。
「画像化された文字」と「画像」の判別をつけやすくするため、「写真：XX」というように接頭辞をつけたり「XXの写真」というように説明的なaltを心がけると良いです。たとえば「和菓子」というaltは、「『和菓子』という文字を画像化」したのか、「和菓子の写真」なのか判断を悩ませることがあります。
グラフやチャートの画像など複雑な情報を提供している画像については、それが何のグラフやチャートであるかを説明したaltをつけてください（例：「6月、7月、8月の売上のグラフ」）。複雑な情報を提供している画像は、まず、その画像を識別できるようにしておくこと必要があります。その上で、付近にtableでマークアップした表や画像の内容を詳述するようにしましょう。
画像が、リンクやボタンなどの操作の対象である場合は、さらに注意が必要です。丁寧なaltを心がけてください。画像をリンクの操作対象としている場合は、"リンクの目的 (コンテキスト内)"を参照し、リンクの目的を明記するようにしてください。
Google Mapの場合、視覚障害者が扱うことは難しいのですが、すくなくともiframeのtitle属性で「Google Map」と説明をしておくとよいでしょう。
地図の画像には、とりあえず識別できるように「XXの地図」というaltをつけましょう。ただし付近にテキストによる経路説明等があれば、このaltは空にしても致命的なバリアではないでしょう。付近に経路説明等がなく、しかも地図の画像であることを明示していなければ、ひとに尋ねることもできないので、確実にバリアなので修正しましょう。
なにかの器具の操作の仕方を説明するgifアニメーションは、「器具の操作方法を説明するアニメーション」というような代替テキストをあてることで、画像を識別できるようにした上で、本文で機能を詳述すれば、本達成基準を満たします。
なお「CAPTCHA」「試験目的の画像」など、altには、いくつかの例外があります。くわしくは1.1.1の解説書を呼んでください。
| 原則 | 知覚可能 | 情報及びユーザインタフェース コンポーネントは、利用者が知覚できる方法で利用者に提示可能でなければならない。 |
|---|---|---|
| ガイドライン | テキストによる代替 | すべての非テキストコンテンツには、拡大印刷、点字、音声、シンボル、平易な言葉などの利用者が必要とする形式に変換できるように、テキストによる代替を提供すること。 |
| 達成基準 | 非テキストコンテンツ (1.1.1 A) |
利用者に提示されるすべての非テキストコンテンツには、同等の目的を果たすテキストによる代替が提供されている。 |