背景色や文字色の選択は、アクセシビリティにどのような影響を与えるのでしょうか？
視覚障がいの方のために、制作するドキュメントに適切なコントラストが必要となります。このようなユーザのためには、背景と前景のコントラストが4.5:1以上になるようにするのが最善の方法です。エディタのデフォルトのままであれば、白地に黒のテキスト、21:1の比率が最適です。
コントラストの例
上の画像は、コントラスト比を変えたテキストの例で、コントラストのレベルが適切であるかどうかを示しています。
描画色と背景色を変更する手順
- 文字色を編集する必要がある場合は、Aの文字色ボタンをクリックします。
- テキストの背景色を編集するには、テキストの色ボタンの右側にある背景色ボタンをクリックします。 背景色ボタンは、白い「A」の文字が入った黒一色のボックスのような形をしています。
- カラーピッカーが表示され、黒や茶などの色を選択することができます。 黄色は、文字を強調するためによく使われる背景色です。 色をクリックすると、その色が選択されます。
色の選択にはコントラストが必要です。
ほとんどの場合、コントラストは明らかですが、確認する必要がある場合は、以下の手順で行います。
- カラーピッカーのその他の色...オプションをクリックします。
- 色選択ウィンドウが表示されます。 ウィンドウの右端に、選択した色がハイライトに表示されます。
- 選択した色が表示されているボックスの下には、#で始まる6桁の16進数が表示されています。 これは、インターネットブラウザが選択した色を表示するための番号です。
- 選択した色の6桁の16進数を記録します。 WebAIMのColor Contrast Checkerなどのオンラインツールを使って、選択した文字色と文字の後ろの背景色とのコントラスト（文字色を選択している場合）や、選択した背景色と文字の色とのコントラストを確認します。 WebAIMのカラーコントラストチェッカーを使用するには、テキストカラーと背景カラーの16進数をボックスに入力します。 コントラストチェッカーで十分なコントラストを持っているかどうかを確認できます。