文字画像 (例外なし) :
達成基準 1.4.9 を理解する
この達成基準の意図
この達成基準の意図は、テキストによる特定の視覚的な提示を必要とする人が、必要に応じてテキストによる提示を調整できるようにすることである。これは、テキストに、特定のフォントサイズ、前景色及び背景色、書体、行間、又は配置を必要とする人を含む。
これは、テキストによる提示を変更できるようにそのテキストを実装すること、又は利用者が代替の提示を選択できるメカニズムを提供することを意味する。文字画像を使用することは、利用者がテキストの提示を変更することを許さない実装の一例である。
状況によっては、テキストの特定の視覚的提示がその情報を伝える上で不可欠である。これは、その特定の視覚的提示でないと、その情報が損なわれてしまうことを意味する。この場合は、テキストを変更できるような方法で実装する必要はない。これには、特定の書体のようなテキストの特定の視覚的な側面を示すテキスト、又は企業のロゴ内にあるテキストのようなアイデンティティを伝えるテキストが含まれる。
装飾を目的にした文字は、その提示を変更できるように実装する必要はない。
文字画像の定義には、「注記: これには、重要なその他の視覚的なコンテンツを含む画像の一部であるテキストは含まれない。」とある。そのような画像の事例としては、グラフ、スクリーンショットやダイアグラムなどが挙げられ、それらは文字以外のものを通じて重要な情報を視覚的に伝えているからである。
達成基準 1.4.9 の具体的なメリット:
ロービジョンの利用者 (コンテンツ制作者の指定した書体、サイズ、及び/又は色では、テキストが読みづらいことがある)
視線移動に問題のある利用者 (コンテンツ制作者の指定した行間及び/又は配置では、テキストが読みづらいことがある)
読字に影響を及ぼす認知の障害のある利用者
達成基準 1.4.9 の事例
引用
あるウェブページに引用がある。その引用部分自体は、イタリックのテキストで、左側をインデントした状態で提示されている。その引用した部分の人名が、引用の下に 1.5 倍の行間を空けて、左側からさらにインデントした状態になっている。そのテキストの配置、行間スペースの指定、そしてテキストの書体、サイズ、色及び装飾には、CSS を用いている。
ナビゲーション
ウェブページに、ナビゲーションリンクのメニューがあり、アイコンとテキストの両方でリンク先を示している。CSS を用いて、テキストの書体、サイズ、前景色及び背景色、そしてナビゲーションリンク間の間隔を指定している。
文字を含んだロゴ
あるウェブサイトには、各ウェブページの左上のコーナーに組織のロゴがある。そのロゴには、ロゴタイプ (ロゴの一部又は全部がテキスト) がある。テキストの視覚的提示は、そのロゴの特定に不可欠であり、そのテキストの特徴を変更することができない GIF 画像として含まていれる。その画像は、テキストによる代替がある。
書体のサンプル
ウェブページに、特定の書体に関する情報がある。その書体を他の書体に置き換えると、サンプルとしての目的が損なわれてしまう。そのサンプルは、その文字の特徴を変更することができない JPEG 画像である。そして、その画像には、テキストによる代替がある。
手紙の写し
ウェブページに、手紙の原本を描写したものがある。オリジナルの体裁でその手紙を見せることが、その手紙の書かれた時代に関する情報を伝える上で不可欠である。その手紙は、その文字の特徴を変更することができない GIF 画像である。そして、その画像には、テキストによる代替がある。
記号的な文字
利用者がテキストのブロックを入力できるフォームがある。そのフォームは、テキストのスタイル指定やスペルチェックなどの機能のボタンをたくさん提供している。ボタンの中には文字を用いたものがあり、その文字に自然言語で何かを表現する並び順はない。例えば、フォントを太字にする機能には "B"、テキストをイタリックにする機能には "I"、そしてスペルチェックの機能には "ABC" が使われている。その記号的な文字は、その文字の特徴を変更することができない GIF 画像としてボタンになっている。そして、そのボタンにはテキストによる代替がある。
関連リソース
リソースは、情報提供のみを目的としており、推奨を意味するものではない。
達成基準 1.4.9 の達成方法及び失敗例 - 文字画像 (例外なし)
この節にある番号付きの各項目は、WCAG ワーキンググループがこの達成基準を満たすのに十分であると判断する達成方法、又は複数の達成方法の組み合わせを表している。しかしながら、必ずしもこれらの達成方法を用いる必要はない。その他の達成方法についての詳細は、WCAG 達成基準の達成方法を理解するの「その他の達成方法」を参照のこと。
十分な達成方法
1.4.9 でさらに対応が望まれる達成方法 (参考)
適合のために必須ではないが、コンテンツをよりアクセシブルにするために、次の追加の達成方法を検討することが望ましい。ただし、すべての状況において、すべての達成方法が使用可能、又は効果的であるとは限らない。
CSS の達成方法
C12: フォントサイズにパーセントを使用する (CSS)
C13: 名前付きフォントサイズを使用する (CSS)
C14: フォントサイズに em 単位を使用する (CSS)
1 文字以内でデザインされるテキスト文字を避ける (リンク追加予定)
達成基準 1.4.9 のよくある失敗例
以下に挙げるものは、WCAG ワーキンググループが達成基準 1.4.9 の失敗例とみなした、よくある間違いである。
(今のところ、文書化された失敗例はない)
重要な用語
- テキスト (text)
プログラムによる解釈が可能な文字の並びで、自然言語で何かを表現しているもの。
- 必要不可欠 (essential)
もし取り除いてしまうと、コンテンツの情報あるいは機能を根本的に変えてしまい、かつ、適合する他の方法では情報及び機能を実現できない。
- 文字画像 (image of text)
特定の視覚的効果を得るために非テキスト形式 (例えば画像) でレンダリングされたテキスト。
注記: テキスト以外の部分が重要な視覚的コンテンツである場合、画像に含まれるテキストは該当しない。
事例: 写真に写っている人の名札にある人名。
- 純粋な装飾 (pure decoration)
見栄えのためだけのもので、情報は提供せず、機能性も備えていないもの。
注記: テキストが純粋な装飾といえるのは、単語を並べ替え、又は置き換えても意図が変わらないときだけである。
事例: 背景にとても淡い文字で単語がランダムに並んでいる辞書の表紙。