(メモ)WCAG2のコントラスト比4.5:1とその周辺の話

色のこと、思い出してはわからんってなっているんだよなあ…。

なおAPCAの話はしない。いくつかGitHubのissueを参照してるけれども、@Myndexが書いていることは長ったらしいので基本的に無視している。

あと書き散らしているので、まとまっているようで実はまとまっていない。メモだから仕方ない。

に「 WCAG2までの議論(2022-07-23追記)」を追記した。
これは、2018年版のWCAG 2.1をもとにしていた。2023年版のWCAG 2.1では修正されている箇所がある(が、このメモは特に加筆等はせず、当時のママとしている)

コントラスト比の定義(WCAG2による)

WCAG 2.1達成基準1.4.3コントラスト比(最低限)では、コントラスト比4.5:1という数値が提示されている。コントラスト比の定義は、以下のとおり:

 \displaystyle
\frac {(L_1 + 0.5)} {(L_2 + 0.5)}

ここで、 L_1 は明るい方の相対輝度、 L_2 は暗い方の相対輝度である。

相対輝度の定義は、最も暗い黒を0に、最も明るい白を1に正規化した色空間内の任意の点の相対的な明るさ。である。

ここでsRGB色空間においては、色の相対輝度は、

 \displaystyle
L = 0.2126 \pmb{R} + 0.7152 \pmb{G} + 0.0722 \pmb{B}

と定義されており、\pmb{R}\pmb{G}\pmb{B}は以下のように定義される。

 R_{sRGB} \leqq 0.03928の場合、\pmb{R} = R_{sRGB}/12.92、そうでなければ \pmb{R} = [\frac{(R_{sRGB} + 0.055)}{1.055}] ^ {2.4}

G_{sRGB} \leqq 0.03928の場合、\pmb{G} = G_{sRGB}/12.92、そうでなければ \pmb{G} = [\frac{(G_{sRGB} + 0.055)}{1.055}] ^ {2.4}

B_{sRGB} \leqq 0.03928の場合、\pmb{B} = B_{sRGB}/12.92、そうでなければ \pmb{B} = [\frac{(B_{sRGB} + 0.055)}{1.055} ]^{2.4}

 R_{sRGB}G_{sRGB}B_{sRGB}は以下のように定義される。

 R_{sRGB} = R_{8bit} /255

 G_{sRGB} = G_{8bit} /255

 B_{sRGB} = B_{8bit} /255

この計算式は、[sRGB]及び[IEC-4WD]を参考にしているとされるが、正確にはIEC 61966-2-1:1999を引く必要があるはず。現に、CSS Color Module Level 4参考日本語訳1のReferenceでは、[sRGB]としている(が、WCAGではそうはなっていない)。

さておき、手計算すればCCAと同じ結果が得られるのでこれはわかる。

sRGBの定義([css-color-4]による)

ところで、[css-color-4]ではしきい値は0.03928ではなく、0.04045を用いている。w3c/wcag#360にそのあたりのことが書いてあると思っているけど、ちゃんと追いかけていない。

CCAとChromeコントラスト比の計算結果がたまに違うのは、数式が原因なのか、四捨五入が違うせいなのか…は、手計算してないので確かめられていない。

本当にWCAG2の計算式でよいのか?という疑問も少しあるが、とはいえしきい値が変わるだけなので、大勢に影響するわけではないだろう。

sRGBの色域外の色

WCAG2の相対輝度では、

コンテンツを処理して表示するのに別の色空間が用いられている事が分かっているのでない限り、コンテンツ制作者は sRGB 色空間を用いて検証するべきである。もしその他の色空間を用いるのであれば、Understanding Success Criterion 1.4.3 を参照。

と、いかにもそれっぽいことが書いてあるものの、sRGB以外のことの詳細がWCAG 2.1解説書 達成基準 1.4.3: コントラスト (最低限)を理解するには書かれていないと理解している。

色域外(out of gamut)2というか、定義済み色空間では、sRGB以外の色空間がCSS Color Level 4で定義されている。

  • display-p3 [Display-P3] — 現在の広色域モニタに典型的な,広色域空間。
  • prophoto-rgb — 写真家たちから広く利用されている
  • rec2020 [Rec.2020] — 現実のほぼすべての可視色を表現できる超広色域空間であり、 普及している工業規格である。

まあこのあたりから筆者の理解がものすごく怪しくなってくるわけなんだけども、WCAG2はsRGBより外の色のことを考えられていない。

4.5:1のコントラスト比の根拠を追う

WCAG 2.1解説書 達成基準 1.4.3: コントラスト (最低限)を理解するでは、コントラスト比を定めた論理的根拠が記載されている。いわく、

3:1 のコントラスト比は、標準的なテキスト及び視力における [ISO-9241-3] 及び [ANSI-HFES-100-1988] によって推奨されている最低限のレベルである。4.5:1 のコントラスト比は、中度の弱い視力、先天的又は後天的な色覚異常、もしくは典型的な加齢に伴うコントラスト感度の衰えに起因する、コントラスト感度の低下を考慮するためにこの規定で使用される。

論理的根拠は、a) ANSI 標準規格 (American National Standards Institute: 米国の国家規格) における正常な観察者に対する最低限の許容可能なコントラストとして、コントラスト比 3:1 の採用、及びb)集団内では、20/40 (0.5) の視力は、おおよそ 1.5 のコントラスト感度低下と関連付けられているという経験的事実 [ARDITI-FAYE] に基いている。したがって、視力が 20/40 (0.5) の利用者は、「3 * 1.5 = 4.5:1」のコントラスト比を必要とするであろう。類似した実証的事実及び同じ論理に沿うと、視力が 20/80 (0.25) の利用者は、約 7:1 のコントラスト比を必要とすることになる。

4.5:1 のコントラスト比は、約 20/40 (0.5) の視力に等しい視覚損失をもつ利用者によって通常経験されるコントラスト感度の低下を埋め合わせをするため、レベル AA に対して選択された。20/40 (0.5) は、80 歳前後の高齢者の典型的な視力として、よく報告される視力である。[GITTINGS-FOZARD]

Understanding WCAG 2.1(WCAG 2.1解説書)ではReferenceが削除されているので、Understanding WCAG 2.0のAppendix Eも見る必要がある。

[ISO-9241-3]と[ANSI-HFES-100-1988]

ここでいう[ISO-9241-3]は、

ISO 9241-3, Ergonomic requirements for office work with visual display terminals (VDTs) - Part 3: Visual display requirements. Amendment 1.

であり、ISO 9241-3:1992/AMD 1:2000のことであるが、すでにこの規格は廃止されている。ISO 9241-304:2008を当たる必要がある。

また、ここでいう[ANSI-HFES-100-1988]は、

ANSI/HFS 100-1988, American National Standard for Human Factors Engineering of Visual Display Terminal Workstations, Section 6, pp. 17-20.

であるが、https://www.hfes.org/publications/technical-standardsいわく、

In November 2007, the American National Standards Institute approved ANSI/HFES 100-2007, Human Factors Engineering of Computer Workstations as an American National Standard. This document replaces BSR/HFES 100-2002 and ANSI/HFS 100-1988.

となっており、同じく廃止されている。

参考までに、2016年に書かれた修論ロービジョン者に見やすいディスプレイのコントラスト比に関する研究ではJIS Z 8513:2006を改良している

計算式に関する注記いわく、

RGB 値の非線形から線形への変換は、IEC/4WD 61966-2-1 [IEC-4WD] 及び "A Standard Default Color Space for the Internet - sRGB" [sRGB] に基づいている。

コントラストの計算式 (L1/L2) は、[ISO-9241-3] 及び [ANSI-HFES-100-1988] 規格に基づいている。

ANSI/HFS 100-1988 規格では、L1 及び L2 の計算を含むために、周辺光からの寄与を必要とする。用いている 0.05 という値は、[IEC-4WD] の Typical Viewing Flare 及び M.Stokes et al の論文 [sRGB] に基づいている。

[ARDITI-FAYE]

[ARDITI-FAYE]は、

Arditi, A. and Faye, E. (2004). Monocular and binocular letter contrast sensitivity and letter acuity in a diverse ophthalmologic practice. Supplement to Optometry and Vision Science, 81 (12S), 287.

[GITTINGS-FOZARD]

[GITTINGS-FOZARD]は、

Gittings, NS and Fozard, JL (1986). Age related changes in visual acuity. Experimental Gerontology, 21(4-5), 423-433.

これは、https://doi.org/10.1016/0531-5565(86)90047-1からダウンロードできる。

WCAG2までの議論(追記)

WCAG 2.0のメーリングリストのログを面倒くさがって追いかけてなかったわけだけども、 A11YJのSlackでThe Web KANZAKIコントラスト比の話が取り上げられている話が出されるまで、すっかりその存在を失念してたよ…

上記の記事からは、Techniques For Accessibility Evaluation And Repair Toolsという文書が参照されているけれども、これはW3C Working Draft, 26 April 2000というステータスで、概要としては

This document describes techniques that Web accessibility validation tools may use to evaluate the conformance of HTML documents to the Web Content Accessibility Guidelines 1.0 (WCAG 1.0).

という塩梅でWCAG 1.0に関連する文書なわけなんだけども、20世紀の遺物がDraftのまま放置されているのはまあW3C WAIの悪いところですね…。

とりあえずのまとめ

今回調べた範囲では、

  • WCAG2のsRGBの計算式の厳密性に怪しさがある。少なくとも、CSS Color 4と異なる計算をしていることになる
  • WCAG2は(当然だが)sRGBしか考えていない
  • 3:1とした元文献は少なくともISOを見ないといけないので、この目で確かめられていない
  • 4.5:1とした根拠となる、1.5という乗数の元文献がウェブ上では見つけられなかった

おまけ

また、CSS Color 4には深く突っ込んでいかなかった(というか突っ込めなかった)けれども、以下のページがきっと参考になるはず。

読んでないけれども、2011年の年代別分光視感効率に基づくWCAG 2.0輝度コントラスト比達成基準の評価は類似の研究になるかもしれない。


  1. 2022-07-05付けでCRになり、CSSの定義の一部になる(ことになる、csswg-drafts/7455)ので、いい加減読み込まないと…と思って何もできてないという。
  2. 訳語は日本語参考訳によるhttps://triple-underscore.github.io/css-color-ja.html#out-of-gamut
  3. https://code.visualstudio.com/updates/v1_58