1.Webサイト・スマホアプリの カラーで意識すべきポイント

2.Webサイト・スマホアプリ におけるカラーユニバーサルデザインの重要性

3.サイト・スマホアプリ のチェックにおすすめのツール「Remote TestKit」

多くのユーザーに使ってもらえるWebサイト、アプリにするために踏まえるべき考え方として、「カラーユニバーサルデザイン」があります。

カラーユニバーサルデザインは、色覚の多様性に配慮し、多くの人に利用しやすい製品・環境・サービス・情報を提供することです。

カラーユニバーサルデザイン機構では、下記の3点をポイントとして挙げています。

a .できるだけ多くの人に見分けやすい配色を選ぶ。

b.色を見分けにくい人（場合）でも情報が伝わるようにする。

c.色の名前を用いたコミュニケーションを可能にする。

【出典】NPO法人カラーユニバーサルデザイン機構『「カラーユニバーサルデザイン3つのポイント」とは？』

より一般的な裏付けとして、Webの標準化団体World Wide Web Consortium（W3C）の定めるガイドラインWeb Content Accessibility Guidelines（WCAG）においても言及があります。「色の使用」において、「色覚の多様性へ配慮し、色だけで情報を伝えないこと」を達成すべき基準としています。【出典】WCAG21『色の使用を理解する』

色覚の多様性については色に関する個々の感覚が異なるのは珍しくないことを示すデータがあります。

先天赤緑色覚異常の発生頻度は、日本人では男性の5%、女性の0.2%です。つまり、男性では20人に1人、女性では500人に1人の割合です。

【出典】公益社団法人日本眼科医会『冊子「色覚異常を正しく理解するために」』

日本の人口を1.2億人とすると、このデータから先天的色覚異常を持つ人はおよそ420 万人と算出されます。目の病気などによる後天的なケースも考慮すれば、より多くの人が該当するでしょう。

多くのユーザーが利用するWebサイト・アプリには、カラーユニバーサルデザインを用いて配色と色覚の多様性に配慮した制作、シミュレーションの必要性があります。

しかし、Webサイトやアプリの設計者にとって、色に関する個々の感覚が異なる方々にどのように見えているかを意識することは簡単ではありません。自分の認識とは違うことまでは理解できても、どのように見られているか、どう作れば利用しやすいかは、色に関する感覚が異なる方々に直接確認しなければ分からないためです。

利用者の声 

ユーザーインタフェース設計とデザインを業務とするB氏にとっても、カラーユニバーサルデザインへの対応は業務上の課題となっていました。B氏の従事するプロジェクトでは、Webサイトとスマホアプリの複数のインターフェースを持つサービスを開発・運営しており、多くのユーザーに使ってもらえるサービスを目指しています。

「多様性に配慮しようとしても、自分で確認できないと対応は難しいものです。どのように見えているかがわからなければ、デザインの直しようがないためです。

そこで出会ったのが、RemoteTestKitを用いて、色に関する感覚が異なる方々の見え方を再現する確認方法です。Remote TestKit（Web版）であれば、スマホの端末をブラウザ上からリモートで利用できます。

PC上のGoogleChromeにaddin『Colorblindly』を追加し、そのChrome上でRemortTestKit（Web版）によりスマホの表示を確認することで、色に関する感覚が異なる方々に対して、Webサイト、アプリがどのように見えているのかを再現できるのです。Colorblindlyではさまざまなイメージを見ることができ、初めてカラーユニバーサルデザインを考慮することが可能となりました。」（B氏）