カラー・コントラスト・アナライザーの概要
背景色と前景色の組み合わせが十分なコントラストを確保しているかどうかをチェックするツールです。"色のコントラスト" の判断基準は、W3C（World Wide Web Consortium）が提案している アルゴリズムに基づいています。
"2つの色は、その明度差および色差が基準値を上回っていれば、コントラストが十分に確保されていると考えます。
" W3C が提案している基準値は、明度差が125以上、色差が500以上です。
注意: ヒューレット・パッカード社がオンラインで提供している colour contrast verification tool も W3C のアルゴリズムを採用していますが、色差の基準値を400以上としており、より広範囲におよぶ背景色と前景色の組み合わせを許容しています。
明度差の計算式
色の明度差は以下の計算式で算出されます。:
((Rの値 X 299) + (Gの値 X 587) + (Bの値 X 114)) / 1000
背景色の明度と前景色の明度との差は、125以上あるべきだとされています。
注意: このアルゴリズムは、RGB値をYIQ値に変換するための計算式が元になっています。この明度の値は、識別可能な色の明度を示します。
色差の計算式
色差は以下の計算式で算出されます。:
(最大 (Rの値 1, Rの値 2) - 最小 (Rの値 1, Rの値 2)) + (最大 (Gの値 1, Gの値 2) - 最小 (Gの値 1, Gの値 2)) + (最大 (Bの値 1, Bの値 2) - 最小 (Bの値 1, Bの値 2))
背景色と前景色の色差は、500以上あるべきだとされています。
用途
カラー・コントラスト・アナライザー（CCA）は、特に Web ページ上のテキストの判読性および画像上の文字の判読性を判断するのに役立つツールです。
W3C / WCAG（Web Content Accessibility Guidelines）1.0 のチェックポイント 2.2 への適合性評価
WCAG 1.0のチェックポイント 2.2は、"前景色と背景色の組み合わせは、色覚に特性のあるユーザーが見たとき、あるいは白黒の画面で見たときにコントラストが十分であること"
としています。このCCAを使って、"コントラストが十分" かどうかを W3C が提案しているアルゴリズムで検証してください。
CCAの使い方
ユーザー・インターフェースは、以下の4つから構成されています。
1. 色選択
色の選択は2箇所（前景色 / 背景色）に分かれており、検証する色の選択方法は3つあります。
- セレクトボックスからカラーパレットを使えます。色の組み合わせを検討する際に使うと便利です。
下にある（小さいほうの）カラーパレットは、左上で選択されているベースカラーの透明度の異なる10種類のバリエーションです。上段は背景色が白の場合、下段は背景色が黒の場合です。それぞれの不透明度は、上段が100%、75%、50%、25%、10% の順、下段は最初が100% ではなく 85% になっています。
このパレットは、検討している色の組み合わせの視認性を改善するために、段階的に明るくしたり暗くしたりしながらチェックするのに便利です。注意：この機能はColor Palette Creatorからヒントを得ています。
色の値（16進数形式）をテキストボックスに入力します。チェックしたい色の値が分かっている際に使うと便利です。
スポイトのアイコンの拡大カラーピッカーを使って、Web ページ（あるいは、画面上のどこか）から色をサンプリングできます。
色を手早くサンプリングして、その値でチェックするのに便利です。カラーピッカーのボタンを押すと、マウスカーソル付近を拡大した小さな画面が現れます。マウスカーソルの先にある色がカラーパレットのセレクトボックスに出ます。 （左マウスをクリック、あるいは Enter キーを使って）カラーピッカーで色が選択されると、hex値のテキストボックスにその色の値が入り、その時点で選択されている色の組み合わせに合わせて、色の明度差および色差の結果が更新されます。
注意:マウスカーソルをうまく動かすには、矢印キーを使ってください。
2. 結果
結果表示は、サマリー（要約）と詳細とに分かれています。'サマリー結果' は、明度差と色差の両方の値を示します。
もし両方とも基準値をクリアしていれば、チェックマークが表示されます。どちらか一方だけでもクリアしていなければ、×印が表示されます。 '詳細結果' は、それぞれのチェックの値と基準値が表示され、そのコントラストが十分かどうかが示されます。
注意:サマリーおよび詳細結果のテキストは、選択してコピーすることが可能です。
3. 色覚特性による結果
'色覚特性ごとの結果も表示する' のチェックボックスを選択すると、'標準的な見え方' および3タイプの色覚特性（第一色覚：赤、第二色覚：緑、第三色覚：青）による結果が表示されます。
注意：3タイプの色覚特性における値の変換方法は、Journal of the Optical Society of America V14, #10 pp2647 にある、Hans Brettel、Francoise Vienot、そしてJohn Mollonによるアルゴリズムを参考にしています。謝辞：Brettel のアルゴリズムを実装しているVischeckの皆さんにそのソースコードを公開していただきました。
4. オプション
'常に最前面に表示' のメニューを選択すると、CCA のウィンドウを他に開いている全てのウィンドウよりも前面に常に表示します。'フォント' メニューを押すと、CCAの画面で使われている文字の書体を変更することができます。
注意: 選択した書体や文字サイズによっては、きちんと表示されない場合があります。
"ヘルプ" メニュを押すと、CCAのヘルプページをブラウザ画面で開きます。
注意:このヘルプを利用するには、インターネット接続環境が必要です。
キーボードによる使用
| 機能 | キー |
|---|---|
| 前景色パレットを開く | F9 |
| 背景色パレットを開く | F10 |
| カラーパレット間を移動する | 矢印キーまたはTabキー |
| 前景色カラーピッカーを起動 | F11 |
| 背景色カラーピッカーを起動 | F12 |
| カラーピッカーの移動 | 矢印キー |
| 選択する色の決定 | Enterキー |
利用条件
カラー・コントラスト・アナライザーはフリーウェアです。
カラー・コントラスト・アナライザーを使った時点で、あなたがカラー・コントラスト・アナライザーの以下の使用許諾契約書を読んで、その内容を理解して同意したものとみなされます。
このソフトウェアは、何の保証もなく "現状" のまま提供されるものです。特に、NATIONAL INFORMATION AND LIBRARY SERVICE (NILS) は、このソフトウェアの信頼性、品質、あるいは商業性に関して、また利用目的への適合性に関して、いかなる責任も負いません。加えて、NILS はこのソフトウェアを使用することであなたの Web サイトのアクセシビリティを何ら保証するものではありません。また、あなたの Web コンテンツがある特定の Web アクセシビリティの規格やガイドラインに準拠することを保証するものでもありません。
このソフトウェアは、クリエイティブ・コモンズのライセンスの下に提供されています。
ダウンロードおよびインストール方法
注意:カラー・コントラスト・アナライザーは、いかなるアドウェアあるいはスパイウェアを含んでいません。
システム要件: Windows 2000 & XP で動作検証済
ダウンロードしたら、解凍して CCA フォルダを好きなところに置いてください。Colour_Contrast_Analyser.exe ファイルを起動すると、そのままご利用になれます。
また、アンインストールはフォルダを削除するだけです。
日本語版: カラー・コントラスト・アナライザー日本語版 （zip形式、193 kb）
開発者
カラー・コントラスト・アナライザーは、Junが開発しました。
共同開発：Steve Faulkner（NILS）
コンテンツ提供：Gez lemon（Juicy Studio）カラー・コントラスト・アナライザー（オンライン版：英語）よりコンテンツ提供。
アドバイス・監修：Andrew Arch、Sofia Celic（ともに、NILS）
日本語版翻訳：植木 真（株式会社インフォアクシア）
カラー・コントラスト・アナライザーに関するご意見・ご要望:
- Steven Faulkner (英語版): steven.faulkner@nils.org.au
- Jun (日本語版): jun@idena.jp