多くのWEBサイトが本文の文字色に黒か白を使っている。見出しやキャッチコピーでは黒白以外の色が使われることもあるが、こと本文の色にいたっては黒か白がほとんどだ。多くのWEBデザイナーは「本文の色は黒か（背景色に応じて）白であるべき」と無意識に思い込んではいないだろうか。筆者はそう思い込んでいた。
しかし、アクセシビリティを損なわないのであれば、本文の色はもっと自由でよい。今はそう考えている。そう考えるようになったきっかけは『MOGA モダンガール クラブ化粧品・プラトン社のデザイン』という1冊の本だった。
本書は、明治末期に創業された化粧品メーカー中山太陽堂（現・クラブコスメチックス社）が大正から昭和初期にかけて発信していた広告デザイン・イラストレーションをふんだんに紹介している。また、その子会社であったプラトン社が大正11年に創刊した広報雑誌『女性』の誌面紹介もされている。『女性』はすぐに広報誌の枠を超えた総合文芸誌となった。
多様な配色でカラフルな誌面
筆者の目に留まったのは『女性』誌面の配色だ。緑地に黄色、淡い水色に赤色、など、本文の背景色と文字色が、黒白にこだわらない自由な配色になっている。
また、この雑誌の配色の影響を受けてか、本書『MOGA モダンガール クラブ化粧品・プラトン社のデザイン』自身も文字色は黒白2択にこだわらず、コラムページでは薄紫色の背景に濃い紫色の本文にするなど、カラフルなデザインになっている。
本書を手に取り『女性』誌面の鮮やかさを目にしたとき、いかに多くのWEBサイトの本文が黒白2択になっているかに気がついた。同時に、もっと多様な色使いをしたWEBサイトがあってもよいのではないかと感じた。
アクセスビリティは担保されているか
WEBアクセシビリティの観点から、文字色は黒か（背景色に応じて）白にすべきだと考えるWEBデザイナーも多くいるだろう。
WEBアクセシビリティのガイドラインWeb Content Accessibility Guidelines (WCAG) 2.0は最低限4.5:1 のコントラスト比を求めている。
1.4.3 コントラスト (最低限) : テキスト及び文字画像の視覚的提示に、少なくとも 4.5:1 のコントラスト比がある。
https://waic.jp/translations/WCAG20/Overview.html#visual-audio-contrast-contrast
しかし、文字色を黒か白にすることまではガイドラインでは求めていない。ということは、背景色と文字色のコントラスト比に問題がなければ、本文の文字色は黒か白にこだわる必要はないということだ。
『女性』誌面で使われている背景色と文字色のコントラスト比を知らべてみたが、ガイドラインの基準は満たしていないかった。しかし、色味を微調整すれば基準を満たすことは可能だろう。
ちなみにコントラスト比のチェックには以下のツールを使用した。
黒か白という思い込みを捨てて考える
背景色と本文の文字色はWEBサイト全体のデザインに影響する。その点、本文は黒か白で済ませるのが無難かもしれないし、そうならざるをえないケースもあるだろう。しかし背景と本文をカラフルな配色にすることは、場合によってはブランディングに貢献するし、サイト全体への適用は無理でも、たとえばモーダル画面の中では文字色をカラフルにするという手もある。
もし「本文の色は黒か（背景色に応じて）白」でなければいけないと思い込んでいるなら、その考えは捨てたほうがよい。
※この枠内の背景色と文字色のコントラスト比は4.925:1（WCAG基準はクリアしている）
