1.4.3 コントラスト（最低限レベル）の達成基準
解説
弱視や色覚に差異があるなど、何らかの事情で色の違いが分からないユーザーにとって、文字の背景色等やサイズ（大きさのほか文字自体の細さなど）の違いが明確でないと見えづらい場合があります。
十分なコントラスト比で色やサイズを設定する必要があります。
十分なコントラスト比で色やサイズを設定する必要があります。
文字色と背景色のコントラストについて
最低4:5:1のコントラスト比を設定しなければいけません。
しかし、テキストのサイズが大きい場合は、この比ではありません。
サイズ・タイプについて
日本語や韓国語などの文字サイズは18ポイントを推奨とされており、英語等は14ポイント以上を推奨としております。
また、文字の線幅が細いフォントタイプでは、コントラスト比を満たせない場合があるため、他のフォントを使用するか、太字（bold）等の設定を追加します。
なお、この達成基準には、写真などの中に意図せず入っていたテキストのほか、企業名や製品名などのロゴ、意味を持たない装飾としてのテキストには適用されません。
各コントラストのチェックは以下よりお確かめ下さい。
※リンク先のサービスは、外部サービスとなります。使用に関して弊社が保証するものではございません。
【カラー・コントラスト・アナライザー（無料）】
https://weba11y.jp/tools/cca/
【コントラストチェッカー（無料）】
https://lab.syncer.jp/Tool/Color-Contrast-Checker/
具体例
例1 テキストの場合
「おりこうブログDS」は、これまでの「おりこうブログ」で掲げてきた「誰でも簡単更新」をさらに進化させた、企業ホームページの作成・運用に最適なWebアプリケーションソフトです。
製品名の「DS」には、あらゆる業種・業態の企業にも対応できる多様性（Diversity）と、ホームページ活用に役立つ機能とサービスの相乗作用（Synergy）で企業活動をサポートする製品にしたいという思いを込めました。
「おりこうブログDS」にはその思いを実現する３つのメリットがあります。
製品名の「DS」には、あらゆる業種・業態の企業にも対応できる多様性（Diversity）と、ホームページ活用に役立つ機能とサービスの相乗作用（Synergy）で企業活動をサポートする製品にしたいという思いを込めました。
「おりこうブログDS」にはその思いを実現する３つのメリットがあります。
例2 画像上のテキストの場合
例1 テキストの場合
背景色が白（#FFFFFF）の時、文章内に使用されている紫（#4B0082）、赤（#800000）、緑（#006400）のカラ―コードは達成基準である4:5:1のコントラスト比を満たしています。
"「おりこうブログDS」には3つのメリットがあります。"というテキストで使用されている橙（#BF4A0C）は、他と同じフォントサイズで使用すると達成基準をかろうじて達成できるところですが、フォントサイズを大きくすることで、高いレベルでの達成が見込めます。
例2 画像上のテキストの場合
画像上のテキストは、使用する画像により文字の視認性が悪くなる場合、背景に帯を敷く、またはテキストに十分なコントラスト比の縁取りを行うことで、基準を満たします。
|
