文字が置かれる場所でコントラストを調べる
色の調和と文字の読みやすさは別の問題です。文字色を、そのすぐ背後の背景と比べましょう。
比率を理解する
sRGBを線形化して相対輝度Y = 0.2126R + 0.7152G + 0.0722Bを求めます。比率は(明るいY + 0.05)/(暗いY + 0.05)です。同色は1:1、黒と白は21:1になります。
適切な基準を使う
通常文字のAAは4.5:1以上、大きな文字は3:1以上です。大きな文字は約24 CSS px、太字なら約18.67 CSS px以上です。判定は丸める前の値を使うため、表示が4.50でも実際には4.5未満で不合格の場合があります。
2色以外の条件も確認する
透明な重なり、写真、グラデーション、フォーカス、無効状態は別途確認します。現在のツールは不透明色に対応しています。比率の合格はWCAG全体への適合ではなく、キーボード操作やラベルも重要です。