イベントページの色のコントラストを確認する

計算ツールを使う

コントラスト計算ツールを開く（英語）

前景色と背景色の６桁の16進数を入力するか、カラーピッカーを使います。通常の文字、大きな文字、より高い基準、必要な操作部品の図形ごとに結果が出ます。表示は小数第２位までですが、判定は丸める前の値で行います。日時、価格、リンク、エラーに実際に使われる色を入力してください。

基準値を読み取る

WCAG 2.2の最低基準は通常の文字で4.5:1、大きな文字で3:1です。強化基準はそれぞれ7:1と4.5:1です。必要なUI部品や図形の情報は、隣接する色との間に原則3:1が必要です。「大きな文字」は通常18ポイント以上、太字14ポイント以上という定義です。基準未満の値を切り上げて合格としないでください。[1][2][3]

参加者の実際の動線を確認する

公開画面で日時、場所、価格、券種、申込欄、エラー、確認、問い合わせ先をスマートフォンとPCで確認します。写真、グラデーション、透過色はこの計算ツールの対象外なので、最も読みにくい場所を実画面で見ます。フォーカスやエラー状態も確認してください。外部決済画面は別に点検します。[1][3]

修正と再確認を記録する

URL、画面の状態、色、比率、適用基準、担当者、再確認結果を記録します。共通の色を変更すると複数ページに影響します。Boletolibre.comに掲載されたイベントでは、参加者に見える情報とチケットへの動線を確認し、主催者サイトと外部決済もそれぞれ点検してください。