要素は最低限の色のコントラスト比のしきい値を満たす必要があります

すべてのテキスト要素において、前景のテキストとその背後の背景色の間に十分な色のコントラストがあることを確認します。

成功基準: テキストが画像の一部である場合でも、小さいテキストの場合は少なくとも4.5:1、大きいテキストの場合は3:1の色のコントラストを確保します。要件では、大きなテキストは18pt (24 CSSピクセル) または14pt太字 (19 CSSピクセル) と定義されています。注: 1:1の比率が見つかった要素は "不完全" とみなされ、手動での確認が必要になります。

以下のカラーコントラスト アナライザーを使用して、ガイドラインに適合する色を見つけます。

色コントラスト分析ツール: 以下は、ガイドラインに照らして色のコントラスト比を分析するツールへのリンクです。

• axe DevToolsブラウザ拡張機能 — Dequeのエンタープライズ製品であるaxe DevTools HTMLを使用すると、開発グループはアクセシビリティ テストを既存の自動テスト プロセスに統合することができ、顧客はこれをDequeの axe Monitor アクセシビリティ監視およびレポート製品と組み合わせて使用します。Axe DevToolsには、多くのプログラミング言語に統合するためのコード ライブラリの提供に加えて、Google ChromeおよびMozilla Firefox用のWebアクセシビリティ分析拡張機能も含まれており、企業のフロントエンド開発者はいつでも簡単にアクセシビリティ テストを実行できます。分析ツールは、アクセシビリティ違反に関する詳細情報と、より詳細な知識へのリンクを含む問題を修正するための手順を返します。
• axe-core — axeアクセシビリティ エンジンは、高速で、誤検知エラーや重複結果を返さず、GitHubリポジトリ、ブラウザー プラグイン、またはフレームワーク統合として利用できるオープンソースのJavaScriptアクセシビリティ ルール ライブラリです。