移行中の知識
文字サイズ変更への耐性
Text Resizing
定義
文字サイズ変更への耐性（text resizing）とは、assistive technologyなしで文字を拡大しても、contentや機能を失わず読み取り・操作できるようにすることです。WCAG 2.2 Success Criterion 1.4.4（Level AA）は、captionsと文字画像を除き、原則として文字を200%までresizeできることを求めます。これはdefault font-sizeを特定px以上に固定する要件ではなく、拡大後のlayout・clipping・overlapも含めて確認する条件です。
実例
実際の場面で考える
同じ概念を異なる制作文脈へ持ち込み、何を観察して判断するかを見る。
dashboard card
card titleを200%へ拡大する
見るポイント
固定heightのcardでtitleが2行・3行になった時、文字がclipされたりbuttonと重なったりしないか確認する。font-sizeを戻すのではなくlayout側が伸びるかを見る。
header navigation
navigation labelの拡大
見るポイント
文字を拡大してlabelが長くなった時、hidden overflowや狭いhit targetが生じないか確認する。必要ならwrap、menu化、reflowを含めて対応する。
注意
誤解しやすい点
- WCAGの200%を、本文の推奨font-sizeが200%であるという意味に読み替える。
- 一つの拡大方法だけで見た目を確認して終え、実際の対象環境で文字拡大時に起きるclipping・overlap・content lossを見ない。
- 拡大時にoverflowした文字を省略表示へ変え、content lossを見逃す。
関連
関連する概念
出典