web-dev-qa-db-ja.com

単色の塗りのコントラストの基準と測定

UXにはいくつかの疑問点があります(例: hereherehere ))。ただし、これらはすべてテキストに関するものであり、テキストと背景のコントラストで、ほとんどの場合、ある時点で このW3ビット を参照しています。私の質問は少し異なります。知りたいのですが。

  • 2つの無地の塗りつぶしの間のコントラストのために標準はありますか?
  • 方法測定 2つの無地の塗りつぶしの間のこのコントラスト(およびおそらく:色の違い)

より具体的には、Webページ上の2つの隣接するブロック(テキスト付き)の背景色が異なる単色であるというシナリオの後でです。例えば:

#EEEE33            > #FFFFCC           > #FFFFDD

example of background-color differences

さらに具体的には、私は this SOメタ質問 について教育を受けた回答を得るのに役立つ回答を探していますSEネットワーク上のタグ付けされた興味深い質問の背景色のコントラスト。たとえば、UXとSEのお気に入りの質問の背景色:

UX.StackExchange                         StackOverflow.com

UX vs SO contrast of favorites

編集:上の画像では、お気に入りの質問とお気に入りではない質問の背景の違いに興味があります(UXの場合はわずかな違いですが、SOの場合は問題ありません)。

要約すると:Webサイト上の隣接するブロックの塗りつぶしの背景色の違いに使用できる方法(標準?測定手法?)は何ですか?

5
Jeroen

this from W を見てください。

私が常に使用するより この簡単なツール は、前景色と背景色の間の適切な組み合わせをすばやく見つけます。お役に立てば幸いです。

3
Andrea Turri

単色の塗りつぶしの基準はあり、ありません。場合によります。

原則として、最も重要な情報には最高のコントラストを使用し、最低のコントラストで最も重要でない情報に戻ることができます。このようにして、情報のレイヤーを作成します。したがって、コントラストの量は、コントラストが伝えるべき情報をどの程度重要であるとみなすかに依存します。 これは件名のNASAカラー使用法のページです。

実際、UX.StackExchangeとStackoverflow.comの例では、Stackoverflowの場合、関連する項目よりも回答数がはるかに多いことが示されています。回答数の背景のコントラストがはるかに高いからです。これが賢明な選択かどうか疑問に思うかもしれません...

0
Igor Asselbergs