1.4.3 コントラスト (最低限) レベルAA 原則1 知覚可能
うすい文字、読める?
おしゃれに見せようとして文字を薄い灰色にすると、読めない人が出てきます。視力が弱い人、年配の人、そして日差しの下でスマートフォンを見るあなたも。
さわってみよう
下のお知らせから、申し込みの締め切り日を読み取ろう。
文化祭 ステージ発表のお知らせ
出演を希望する団体は、10月17日(金)の17時までに生徒会室へ申込用紙を出してください。
見え方を変える
この文字色は #b8b8b8、背景は白です。コントラスト比は — しかありません。
画面が明るく反射すると、差がさらに縮まります。
直してみよう
スライダーで色を変えて、コントラスト比を基準に届かせよう。
文化祭 ステージ発表のお知らせ
出演を希望する団体は、10月17日(金)の17時までに生徒会室へ申込用紙を出してください。
いまのコントラスト比
—
分かったこと
- ふつうの大きさの文字は、背景とのコントラスト比を 4.5 : 1 以上にする。
- 大きな文字(24px以上、太字なら約18.5px以上)は 3 : 1 以上でよい。
- 比は 1 : 1(同じ色)から 21 : 1(白と黒)まで。見た目の印象ではなく、計算で確かめる。
- ボタンの枠線や入力欄の枠、アイコンは、文字とは別の基準 1.4.11 で 3 : 1 以上が求められる。
くわしい条件や例外(ロゴなど)は、WCAG 2.2 の日本語訳で確かめよう。