スライドを作る
読みやすい。
このコントラストチェッカーは、テキストと背景色のコントラスト比を測定します。小さい文字と大きい文字について WCAG AA と AAA の合否を表示し、さらにスライドのプレビューで、見る人と同じ見え方を確認できます。
1. コントラスト比とは?
コントラスト比は、2つの色が明るさの面でどれだけ異なるかを表す数値です。高いほど読みやすくなります。コントラストが低いと、明るい部屋やプロジェクター、画質の悪い画面では文字が見えなくなります。
2. WCAG の基準(AA と AAA)
- AA: 通常のテキストは 4.5:1、大きいテキストは 3:1。
- AAA: 通常のテキストは 7:1、大きいテキストは 4.5:1。
- スライドはしばしばよくない環境で表示されるため、最低基準より高い値を目指すほうが安全です。
3. スライドのコントラストのヒント
薄いグレーの文字は避けましょう。プロジェクターではすぐに薄れてしまいます。
本文テキストが AA に合格しないなら、使わないでください。見出しだけのスライドでは解決になりません。
ブランドカラーが基準を満たさない場合は、本文テキストではなくアクセントとして使ってください。
よくある質問
スライドに適したコントラスト比は?
最低でも AA を目指しましょう。プロジェクターや明るい部屋で見せる資料なら、さらに高い基準のほうが安全です。
なぜプロジェクターで失敗するのですか?
プロジェクターはコントラストが低く、部屋の環境光も加わります。ノートパソコンでは問題なく見える色でも、実際のプレゼン環境では薄れてしまうことがよくあります。
WCAG を満たさないブランドカラーは使えますか?
はい。ただし、本文テキストではなくアクセントや図形として使ってください。文字のコントラストは高く保ち、ブランドカラーは強調に使いましょう。