テキストのサイズ変更:
達成基準 1.4.4 を理解する
この達成基準の意図
この達成基準の意図は、テキストベースのコントロール ([ASCII などのデータ形式であるテキスト文字に対して] 視覚的に見ることができるように表示された文字) を含む視覚的にレンダリングされたテキストを、例えば画面拡大ソフトのような支援技術を使わずに軽度の視覚障害のある人が、そのまま読むことができるように保証することである。利用者はウェブページ上のすべてのコンテンツを拡大することでメリットを得ることができるが、テキストは最も重要である。
コンテンツを拡大縮小することは、主にユーザエージェントの責任である。UAAG 1.0 チェックポイント 4.1 を満たしているユーザエージェントは、利用者がテキストの拡大縮小を設定できるようにしている。コンテンツ制作者の責任は、ユーザエージェントがコンテンツを効果的に拡大縮小することを妨げないウェブコンテンツを制作することである。コンテンツ制作者は、コンテンツがテキストベースのコントロールを含むテキストのサイズ変更のためのユーザエージェントのサポートを妨げていないことを確認すること、又はテキストのサイズ変更もしくはレイアウトの変更を直接サポートすることによって、この達成基準を満たすことができる。直接サポートの例は、異なるスタイルシートを割り当てるために使用できるサーバーサイドスクリプトを介したものかもしれない。
利用者が、ズームサポートを持つユーザエージェントにアクセスできない場合、コンテンツ制作者は、HTML コンテンツに対するこの達成基準を満たすためにユーザエージェントに依存することはできない。例えば、IE 6 を使用する必要のある環境で動作する場合などである。
訳注: ほとんどのモダンブラウザでは拡大機能が提供されている。また、IE6 は、サポートが終了したブラウザである。一目で分かる、各Windows OSでのInternet Explorerのサポート終了時期:Tech TIPS - @IT も参照されたい。
コンテンツ制作者が、ユーザエージェントによってズームサポートを提供していないウェブコンテンツ技術を使用している場合、コンテンツ制作者はこのタイプの機能を提供するか、又はユーザエージェントによって提供される機能のタイプで動作するコンテンツを提供する義務がある。ユーザエージェントがズーム機能を提供していないが、利用者にテキストの大きさの変更するのを許可する場合、コンテンツ制作者は、テキストの大きさを変更するときにコンテンツが利用可能なままであることを保証する責任がある。
ラベルとして機能し、コンテンツにアクセスするために利用者によるアクティベーションを必要とするユーザインターフェースコンポーネントの中には、ラベルコンテンツを収容するのに十分な幅がないものがある。例えば、ウェブメールアプリケーションにおける件名のカラムは、全ての可能性がある件名の見出しを収容するために十分な幅でなくてもよいが、件名の見出しをアクティブにすることで、利用者は、完全な件名の見出しを伴う完全なメッセージを得る。ウェブベースのスプレッドシートでは、カラム内に表示するには長すぎるセルのコンテンツは切り落とされ、そのセルの全コンテンツは、セルがフォーカスを受け取ったとき、利用者に提供される。ユーザインタフェースコンポーネントのコンテンツは、利用者がカラムの幅の大きさを変更することができるユーザインタフェースでも同様に、広くするかもしれない。このタイプのユーザインタフェースコンポーネントでは、改行が必須ではない。コンポーネントの完全なコンテンツが、フォーカスを置く又は利用者のアクティベーションの後に利用可能であり、この情報にアクセスすることができることが示され、それが切り捨てられるという事実の他にいずれかの方法で利用者へ提供される場合、切り捨ては許容される。
コンテンツが 200% まで、言い換えれば、幅と高さが 2 倍になるまで拡大可能である場合、コンテンツは達成基準を満たしている。コンテンツ制作者はそれ以上の拡大をサポートしてもよいが、拡大が極端に大きくなると、アダプティブレイアウトはユーザビリティの問題を引き起こす可能性がある。例えば、語句の広くなりすぎると、使用可能な横幅に収まりきらず、切り取られる可能性がある。レイアウト上の制約によって、拡大していったときに、テキストが他のコンテンツと重なり合ってしまうこともある。あるいは、文章中の一つの単語だけが各行にある状態になると、その文章が縦に表示されてしまって読みづらくなってしまう。
WCAG ワーキンググループは、広範囲に及ぶデザイン及びレイアウトをサポートできるという点と、最小の拡大率が 200% である古い画面拡大ソフトを補完するという点から、200% が合理的な適応と考えている。200% を超えると、拡大 (テキスト、画像、及びレイアウト領域のサイズを変更し、横スクロールと縦スクロールの両方を必要とする可能性のある大きなキャンバスを作り出す) のほうが、テキストのサイズ変更よりも効果的かもしれない。このような状況では、通常、拡大機能専用の支援技術が使用されており、コンテンツ制作者が利用者に直接サポートする機能よりもより良いアクセシビリティを提供することができる。
注記: 文字画像はピクセル化されている傾向があるため、テキストと同様に拡大しない。したがって、可能な限りテキストを使用することを勧める。一部の利用者にとって必要である、テキストの画像の前景と背景のコントラスト及び色の組み合わせを変更することも困難である。
達成基準 1.4.8 視覚的提示を理解するも参照のこと。
達成基準 1.4.4 の具体的なメリット:
この達成基準は、コンテンツのテキストサイズを拡大して読むことができるようにすることで、ロービジョンの人に役立つ。
達成基準 1.4.4 の事例
視覚障害のある利用者は、ブラウザにあるウェブページのテキストの大きさを 1 em から 1.2 em に増やしている。その利用者は、小さいテキストを読むことはできないが、大きいテキストは読むことができる。テキストに大きなフォントを使用すると、ページ上のすべての情報が表示される。
ウェブページは、ページの縮尺を変更するコントロールを含んでいる。異なる設定を選択すると、ページのレイアウトが変更され、その縮尺に最適なデザインが使用される。
利用者は、ユーザエージェントのズーム機能を使って、コンテンツの縮尺を変更する。すべてのコンテンツは均一に拡大し、必要に応じてユーザエージェントがスクロールバーを提供している。
関連リソース
リソースは、情報提供のみを目的としており、推奨を意味するものではない。
訳注: CSS2 の「Box Model」は、CSS Box Model Module Level 3 で再定義されている。
達成基準 1.4.4 の達成方法及び失敗例 - テキストのサイズ変更
この節にある番号付きの各項目は、WCAG ワーキンググループがこの達成基準を満たすのに十分であると判断する達成方法、又は複数の達成方法の組み合わせを表している。しかしながら、必ずしもこれらの達成方法を用いる必要はない。その他の達成方法についての詳細は、WCAG 達成基準の達成方法を理解するの「その他の達成方法」を参照のこと。
十分な達成方法
SL22: Supporting Browser Zoom in Silverlight (Silverlight)
SL23: Using A Style Switcher to Increase Font Size of Silverlight Text Elements (Silverlight)
テキストのサイズを変更した際に、テキストコンテナもサイズ変更するようにする、かつ、次の達成方法の一つ以上を用いて、コンテンツにあるその他の大きさと相対的な大きさにする
相対的な大きさの達成方法:
C12: フォントサイズにパーセントを使用する (CSS)
C13: 名前付きフォントサイズを使用する (CSS)
C14: フォントサイズに em 単位を使用する (CSS)
テキストコンテナのサイズを可変にする達成方法:
G178: 利用者がウェブページ上のすべてのテキストを 200%まで徐々に変更できるコントロールをウェブページ上で提供する
1.4.4 でさらに対応が望まれる達成方法 (参考)
適合のために必須ではないが、コンテンツをよりアクセシブルにするために、次の追加の達成方法を検討することが望ましい。ただし、すべての状況において、すべての達成方法が使用可能、又は効果的であるとは限らない。
デフォルトで大きなフォントを提供する (リンク追加予定)
ページ比率のコンテナーサイズを用いる (リンク追加予定)
ユーザエージェントのデフォルトよりも小さなサイズのフォント尺度を使わない (リンク追加予定)
注記: コンテンツ制作者は本当のフォントサイズを知ることはできないが、100%よりも小さな値の尺度を避けるべきである
両端揃えは避ける (リンク追加予定)
十分なスペースを持った行間を提供する (リンク追加予定)
アクセシブルな選択肢が提供できない場合、非テキストコンテンツは異なるサイズを提供する (リンク追加予定)
ビットマップ (ラスター画像) の文字の利用を避ける (リンク追加予定)
文字画像のサイズ変更にサーバーサイドスクリプトを用いる (リンク追加予定)
少なくとも 18 ポイント以上のビットマップ (ラスター画像) の文字を保証する (リンク追加予定)
文字サイズを 50% に縮小する (リンク追加予定)
C20: ブラウザがサイズ変更されるときに、行が平均で 80 字以下になるようなカラムの幅を設定するために、相対長さを使用する (CSS)
拡大するメカニズムをもつキャプションを提供する (リンク追加予定)
達成基準 1.4.4 のよくある失敗例
以下に挙げるものは、WCAG ワーキンググループが達成基準 1.4.4 の失敗例とみなした、よくある間違いである。
重要な用語
- (この文書で用いられている) 支援技術 (assistive technology (as used in this document))
ユーザエージェントとして機能する、又は主流のユーザエージェントと一緒に機能するハードウェア及び/又はソフトウェアで、主流のユーザエージェントで提供されている機能以上の機能を、障害のある利用者の要求を満たすために提供するもの。
注記 1: 支援技術が提供する機能としては、代替の提示 (例: 合成音声や拡大表示したコンテンツ)、代替入力手法 (例: 音声認識)、付加的なナビゲーション又は位置確認のメカニズム、及びコンテンツ変換 (例: テーブルをよりアクセシブルにするもの) などを挙げることができる。
注記 2: 支援技術は、API を利用、監視することで、主流のユーザエージェントとデータやメッセージのやりとりをすることが多い。
注記 3: 主流のユーザエージェントと支援技術との区別は、絶対的なものではない。多くの主流のユーザエージェントは、障害者を支援する機能を提供している。基本的な差異は、主流のユーザエージェントが障害のある人もない人も含めて、広く多様な利用者を対象にしているのに対し、支援技術は、特定の障害のある利用者という、より狭く限られた人たちを対象にしているということである。支援技術により提供される支援は、対象とする利用者に特化した、よりニーズに適したものである。主流のユーザエージェントは、プログラムオブジェクトからのウェブコンテンツの抽出、マークアップの識別可能な構造への解釈といった、重要な機能を支援技術に対して提供する場合がある。
事例: この文書の文脈において重要な支援技術としては、以下のものが挙げられる:
画面拡大ソフト及びその他の視覚的な表示に関する支援技術。視覚障害、知覚障害、及び読書困難などの障害のある人が、レンダリング後のテキスト及び画像の視覚的な読みやすさを改善するために、テキストのフォント、サイズ、間隔、色、音声との同期などを変更するのに使用している。
スクリーンリーダー。全盲の人がテキスト情報を合成音声あるいは点字で読み取るために使用している。
音声変換ソフトウェア。認知障害、言語障害、及び学習障害のある人が、テキストを合成音声に変換するために使用している。
音声認識ソフトウェア。何らかの身体障害のある利用者が使用することがある。
代替キーボード。特定の身体障害のある人がキーボード操作をシミュレートするのに使用している (ヘッドポインタ、シングルスイッチ、呼気・吸気スイッチ、及びその他の特別な入力デバイスを使った代替キーボードを含む)。
代替ポインティングデバイス。特定の身体障害のある人がマウスポインタとボタンの動きをシミュレートするのに使用している。
- キャプション (captions)
そのメディアのコンテンツを理解するのに必要な、会話及び会話でない音声情報に対する、同期した視覚、及び/又はテキストによる代替。
注記 1: キャプションは会話のみの字幕と似ているが、会話の内容だけを伝えるのではなく、その番組の内容を理解するために必要な効果音、音楽、笑い声、話者の特定、位置などを含む、会話でない音声情報と同等の内容も伝える点が異なる。
注記 2: クローズドキャプションは、音声情報と同等の内容で、プレーヤーによっては表示/非表示を切り替えることができるものを指す。
注記 3: オープンキャプションは、非表示にできないキャプションである。例えば、キャプションが同等の視覚化された文字画像で映像に埋め込まれている場合である。
注記 4: キャプションは、映像に含まれる情報を分かりにくくしたり遮ったりすべきではない。
注記 5: 国によっては、キャプションは "subtitle" と呼ばれている。
訳注: subtitleには、「字幕」の意がある。日本では、キャプションのことを一般に字幕と呼ぶことが多い。
注記 6: 音声解説にキャプションをつけることもできるが、つける必要はない。なぜなら、音声解説は既に視覚的に提示されている情報の説明だからである。
- テキスト (text)
プログラムによる解釈が可能な文字の並びで、自然言語で何かを表現しているもの。
- 文字画像 (image of text)
特定の視覚的効果を得るために非テキスト形式 (例えば画像) でレンダリングされたテキスト。
注記: テキスト以外の部分が重要な視覚的コンテンツである場合、画像に含まれるテキストは該当しない。
事例: 写真に写っている人の名札にある人名。