テキストのコントラスト
Silktide は、ページ上のテキストとその背後の背景との色の差を測定し、背景と色が近すぎて快適に読めないテキストを報告します。これは、ほとんどのアクセシビリティ関連法規で求められる最低限のコントラスト基準です。
重要な理由
コントラストの低いテキストは、ウェブ上で最も一般的かつ深刻なアクセシビリティ違反の一つです。弱視の方や高齢の読者、また明るい日差しの下や画面の明るさを低く設定して画面を見ている人にとって、白地に薄いグレーのテキストは実質的に見えないことがあります。コントラストの最低基準は の に含まれており、これはほとんどの法規や契約で参照される基準です。そのため、基準を満たさない場合は法的リスクも生じます。
修正方法
- 必要な比率を満たすまで、テキストを暗くするか背景を明るくします(暗いデザインの場合はその逆にします)。各検出結果には、2 つの色、測定された 、および必要な比率が表示されます。
- 修正がそのスタイルを使用しているすべての場所に適用されるよう、個々のページではなく、サイトのスタイルシートまたはテーマ設定で色を変更します。
- たとえば、意図的に目立たせていないプレースホルダー風のテキストなど、検出結果が許容できる場合は、代わりに できます。
Silktide によるテスト方法
- ページ上の表示されているすべてのテキストを調べます。非表示のテキスト、SVG グラフィック内のテキスト、チェック対象から除外した要素は対象外です。
- 透明度と親要素を考慮して、実際に適用されるテキストの色と背景色を特定します。ここでは単色の背景上にあるテキストのみを測定します。画像やグラデーション上に配置されたテキストは、画像上のテキストのコントラストで処理されます。
- 2 つの色のコントラスト比を計算します。
- 必要な最低基準を下回るテキストを報告します。通常のテキストは 4.5:1、大きなテキストは 3:1 が基準です。テキストは、サイズが 18 ポイント(24 ピクセル)以上、または太字のウェイト(600 以上)で 14 ポイント(約 19 ピクセル)以上の場合に大きなテキストとみなされます。
トラブルシューティング
写真やグラデーション上のテキストがここで報告されない
背景が画像やグラデーションの場合、測定対象となる単一の背景色がないため、そのようなケースは 画像上のテキストのコントラスト で個別に報告されます。
これは関連する 2 つのチェックの AA 版です
このチェックでは、広く求められている最低基準である WCAG 成功基準 1.4.3(レベル AA)をテストします。より厳しいレベル AAA 版の成功基準 1.4.6 は、高コントラストのテキスト でテストされます。この 2 つのチェックでは決定が共有されます。一方で検出結果を承認または無視すると、もう一方の同じ検出結果にも適用されます。
テキストは問題ないように見える
画面上で問題ないように見えるコントラストでも、他の人にとっては基準を満たさないことがあります。モニター、明るさの設定、視力は大きく異なるためです。測定された比率は客観的な指標なので、見た目の印象よりも優先してください。