コンテンツに移動
Silktideヘルプ

高いテキストコントラスト

Silktide は、ページ上のテキストとその背後の背景色の差を測定し、コントラストに関する最も厳しいアクセシビリティ基準を満たしていないテキストを報告します。これは法律で求められる最低限の基準を上回るもので、重度の視覚障害がある人でもコンテンツを読めるようにするためのものです。

重要な理由

標準的なコントラストの最低基準はほとんどの読者に役立ちますが、より重度の視力低下がある人(およそ視力 20/80 に相当)には、テキストと背景のより大きな差が必要です。強化された基準を満たすことで、拡大表示やその他の を使わなくても、これらのユーザーがコンテンツを読めるようになります。

これは の の目標です。ほとんどの組織では達成が義務付けられておらず、ウェブサイト全体で実現するのは現実的でない場合もありますが、実現できる場所では価値があります。特に、高齢者や障害のある人を対象としたコンテンツでは有効です。

修正方法

  1. 色の組み合わせが必要な比率を満たすまで、テキストを暗くするか背景を明るくします(暗いデザインではその逆にします)。各検出結果には、2 色、測定された 、必要な比率が表示されます。
  2. 個々のページではなく、サイトのスタイルシートまたはテーマ設定で色を変更します。これにより、そのスタイルが使用されているすべての場所に修正が適用されます。
  3. デザイン上、AAA 基準を満たすことが現実的でない場合は、テキストのコントラストでテストされる AA の最低基準を引き続き満たしていれば、検出結果を できます。

Silktide によるテスト方法

  1. ページ上に表示されるすべてのテキストを調べます。非表示のテキスト、SVG グラフィック内のテキスト、チェック対象から除外した要素はスキップします。
  2. 透明度と親要素を考慮して、実際に適用されるテキスト色と背景色を特定します。測定の対象となるのは単色の背景上にあるテキストのみです。画像やグラデーション上に配置されたテキストは自動的に測定できません。
  3. 2 色のコントラスト比を計算します。
  4. 強化された最低基準を下回るテキストを報告します。通常のテキストは 7:1、大きなテキストは 4.5:1 が基準です。テキストは、サイズが 18 ポイント(24 ピクセル)以上の場合、または太字のウェイト(600 以上)で 14 ポイント(約 19 ピクセル)以上の場合に大きいとみなされます。

トラブルシューティング

これは関連する 2 つのチェックのうち AAA 版です

このチェックでは、WCAG 達成基準 1.4.6(レベル AAA)をテストします。より一般的に必要とされるレベル AA 版の達成基準 1.4.3 は、テキストのコントラストでテストされ、基準値はより低く設定されています(4.5:1 と 3:1)。まずはサイト全体で AA のチェックに合格することを目指してください。2 つのチェックでは判定が共有されます。一方で検出結果を承認または無視すると、もう一方の同じ検出結果にも適用されます。

サイト全体で検出結果が多数ある

7:1 を満たせないことはよくあります。一般的なカラーパレットの多くはこの値に達しません。まず、最も多く読まれるコンテンツ(ナビゲーションや主要ページの本文など)を修正し、残りについてはページごとの編集ではなく、デザインシステム上の判断として扱ってください。

詳細情報

最終更新

このページは役に立ちましたか?

高いテキストコントラスト | Silktide ヘルプ