WCAG 1.4.4: テキストを200%まで拡大しても利用できるか確認する
ブラウザのズームや文字サイズ変更でテキストを200%まで拡大しても、文字が重なったり切れたりせず、情報や操作が失われないようにします。
意図的な失敗例: 拡大時にテキストが欠落する
固定高さかつoverflow:hiddenにより、200%拡大時に説明が読めなくなります。
確認観点
- ブラウザのズームを200%にして、主要ページの本文、ナビゲーション、フォーム、ボタンを確認する
- meta viewportでピンチ拡大を制限していないか確認する
- テキストを囲む要素に固定heightを使って文字がはみ出していないか確認する
- 文字画像ではなく、可能な限りHTMLテキストで実装する
人の判断が必要な例
- 200%拡大時に文字が重なる、切れる、画面外に出る、ボタンが押せなくなる箇所がないか確認する
- 固定ヘッダー、固定フッター、チャットボタンなどが本文や操作対象を覆っていないか確認する
- 画像化された文字が拡大時に粗くなって読みにくくないか確認する
補助ツール候補
- font-size-200
- text-spacing
- fixed-header-overlap
生成メモ
- デバイス・環境検証が必要