人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

コントラストの比率について。

「2つの色のコントラストが50%以上となるよう、配色を考えろ」
といわれました。
ここでいう50%って、どういう計算式で算出するものなのでしょうか?
たとえば、#FF0000と#0000FFとでは、コントラストは何%になるのでしょうか?

よくディスプレイのコントラスト比が1:300とかって書かれていますが、あれもどういう計算式で出す比率なのでしょうか?

これについての情報が記載されているURLがありましたら、それも合わせて教えてください。
お詳しい方、ご回答をよろしくお願いいたします。

●質問者: xml-document1
●カテゴリ:ウェブ制作
✍キーワード:URL コントラスト ディスプレイ 計算
○ 状態 :終了
└ 回答数 : 5/5件

▽最新の回答へ

1 ● komorebi
●0ポイント

http://www.infoaxia.com/tools/cca/index.html

カラー・コントラスト・アナライザー 日本語版/ツール&ダウンロード ? Webアクセシビリティポータルサイト『infoaxia(インフォアクシア)』

配色チェック用のツールが植木真 氏のインフォアクシアで『カラー・コントラスト・アナライザー』で配布されていますから、これをつかってみてください。

これをつかって、文字とその背景との色相差などをチェックするのが一番かと思います。


また、計算結果の云々ではなく是非、自分の目で確かめて見ることもしてください。

もしアクセシビリティを配慮・・・というので、この投稿をしたのであれば、富士通のアクセシビリティアシスタンツツールの『ColorSelector』や、『ColorDoctor』で実際のシュミレーションも行って、その意味付けも自分の体験から行えるようになってもらえればと思います。


機械的な処理だけ終わって欲しくないので

http://design.fujitsu.com/jp/universal/assistance/

富士通アクセシビリティ・アシスタンス : FUJITSU Japan

◎質問者からの返答

すみませんが、これは求める回答にはなっていません。

2つの色のコントラストの割合(60%など)、またはコントラスト比(300:1など)が、どのような計算式で算出されるのかを知りたいのです。

引き続き回答をお待ちしています。


2 ● くまっぷす
●0ポイント

http://www.kanzaki.com/docs/html/color-check

?F??g??????`?F?b?N - ???????O?i?F??w?i?F

このURLに出ています。


前景/背景を二色に置き換えて考えればよいはずです。

◎質問者からの返答

数式は記載されていますが、コントラスト比(例えば1:300)とかコントラストの%を求める計算式はありません。

この計算式が記載されているサイトを探しています。

引き続きよろしくお願いします。


3 ● peppon
●20ポイント

c(コントラスト)=(Lmax-Lmin)/(Lmax+Lmin)

Lmax:最高輝度、Lmin:最低輝度

photoshopカラーパレットのLabのL

#FF0000と#0000FFの場合Lは54と30


まちがってたらごめんなさい


4 ● くまっぷす
●70ポイント

http://it.jeita.or.jp/document/publica/report/CRT_catalog_rev4_1...

まずディスプレイのコントラスト比と質問者さんが考えろといわれた色のコントラスト比では定義が違います。


ディスプレイのコントラスト比は非常に単純で、最初の参考URLのp14(2.6コントラスト比)にあるように白と黒の光度を実際に測定して計算します。なのでこれは今は考えなくていいはずです。


先ほどの式についてもう一度見てください。引用元の2番目のURLのTechnique 2.2.1 [priority 3] Test the color attributes of the following elements for visibility:のほうがごちゃごちゃ書いてない分わかりやすいかもしれません。

ご質問の色、赤#FF0000と緑#0000FFでは式2によればそれぞれ76.245,29.070の値を持ちます。これは人間の目の感覚に合わせたそれぞれの色の明るさです。

この評価基準では比率(%)ではなく差で見ていますが、単純に76.245/29.070=2.6228..なのでこの場合はコントラスト比260%(2.6)ということになります。

ただ、最初の回答者さんもおっしゃっていましたが、この基準、これでなんでも大丈夫、というところまでは全然いっていません。基準の取りかたもいろいろで、しかも基準を満たしていてもこれ、見やすいといえるか?みたいな配色も出てきてしまいます。

ですので最初の指示は単に目安としてコントラスト比が2.0以上になるぐらいの、という意味でいわれたと考えるのが妥当でしょう。

(もっと言い替えると「紛らわしい色使いをするな」だけかもしれない)

http://www.w3.org/TR/AERT

Techniques For Accessibility Evaluation And Repair Tools

◎質問者からの返答

なるほどなるほど。

こういう回答待ってました。

知りたいことがきちんと説明されていて、分かりやすかったです。

ありがとうございます。

念のため、回答は全部開こうと思います。


5 ● peppon
●0ポイント

http://oshiete.eibi.co.jp/kotaeru.php3?q=1045534

教えて進路Q&A 輝度対比(コントラスト)の計算公式

さきほどの回答の追加です。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ