ウェブアクセシビリティへの対応

WebサイトやWebサービスが、どんな人やどんな利用環境でもなるべく同じように閲覧・利用できること、また、そのような状態が実現されている度合いをいいます。

世界のウェブ技術の標準化団体であるW3Cが、WCAG(Web Content Accessibility Guidelines)というガイドラインを発行しているほか、日本工業規格(JIS)がウェブアクセシビリティの国内標準としてJIS X 8341-3を発行しており、近年では政府や自治体がサイト制作を発注する際にこうした規格への対応を必須とする事例も増えています。

日本工業規格(JIS)：JIS X 8341-3:2010 「高齢者・障害者等配慮設計指針－情報通信における機器、ソフトウェア及びサービス－第3部：ウェブコンテンツ」

7.1知覚可能に関する原則

7.1.1 代替テキストに関するガイドライン

7.1.2 時間の経過に伴って変化するメディアに関するガイドライン

7.1.3 適応可能に関するガイドライン

7.1.4 識別可能に関するガイドライン

7.2操作可能に関する原則

7.2.1 キーボード操作可能に関するガイドライン

7.2.2 十分な時間に関するガイドライン

7.2.3 発作の防止に関するガイドライン

7.2.4 ナビゲーション可能に関するガイドライン

7.3理解可能に関する原則

7.3.1 読みやすさに関するガイドライン

7.3.2 予測可能に関するガイドライン

7.3.3 入力支援に関するガイドライン

2013年前後から、ホームページデザインの傾向が大きく変化し、日本を代表するサイトでも明確な変化を感じ取ることができるようになりました。
共通の変化として、ホームページのレイアウトの定型化・シンプル化、メニューデザインのシンプル化、白・グレー・青をベースとしたカラー選択などが見られます。
分かりやすい配置や特別な飾り等を使用しないシンプルなデザインで、メニュー文字などが見やすくなっているのが特徴といえます。

また、ウェブデザイン変化の大きな理由として社会的要求と発信効果の重視があげられます。
簡単に表現すると「アクセシビリティ」と「ユーザビリティ」を考慮した結果と考えられます。アクセシビリティは、高齢者・障害者を含む誰でも利用できることへの対応であり、ユーザビリティは使いやすく効果的であるということです。

色の使用（配色）について
基本配色は、3色系で　白黒系（白～灰色・黒）、青系（紺・青～水色）、茶系（濃い茶色～薄い・明るい茶色）です。
基本背景は、白又は薄い灰色で濃い灰色・黒の細い枠線の使用、プレートやアイコン等は、白黒系、青系、茶系の3色系の利用、赤や緑を使用する場合には必ず白背景又は白文字と合わせて利用されています。

この理由として、第一に考えられることは「カラーバリアフリー」です。
第二の理由として、「色の特性（効果）によるウェブカラーの対応」が考えられます。

操作時間が長くなると目に影響すること、また、視力への影響や色覚異常者の利用に対応していると考えられます。欧米の訴訟事情を考慮すると視力の悪化や色覚異常者の誤操作によるビジネス損失等の訴えにも万全を期しているように思えます。

「カラーバリアフリー」とは、標識や信号等の色の利用において色覚障害者に対応した色使いや識別できる対応をすることをいいます。
また、人間の目の網膜には３種類の錐体（すいたい）細胞があり、それぞれ赤、緑、青を感じる視物質を持っています。このうちどれかの機能が損なわれた状態を「色覚障害」といいます。

色の三原色には、「光の三原色」と「絵の具の三原色」とがあり、光の三原色は、以下のように赤・緑・青です。参考までに絵の具の三原色（CMY）は、印刷機に利用されているシアン（C）・マゼンダ（M）・イエロー（Y）です。

赤(R)と
緑(G)と
青(B)の光を「光の三原色」といいます。

テレビやパソコンのディスプレイのように発光によって色を表現しているものは、波長の違うR（赤）G（緑）B（青）の三色（光の三原色）の色光の組み合わせで色を表現します（加法混色）。光が全くない場合に“黒”になり、すべての波長が合成された時に“白”になります。太陽の光は、様々な波長の光が混ざっているため、白っぽく見えます。

「色覚障害」は、赤・緑・青のいずれかを感知できない障害で、色覚障害の人の大多数は、赤感受性の視物質の遺伝子に変異を生じた「第1色覚障害」（色覚障害全体の約25％）か、緑感受性の視物質の遺伝子に変異を生じた「第2色覚障害」（色覚障害全体の約75％）です。赤と緑の視物質はどちらが失われても似た症状になり、赤～緑の波長域で色の差を感じにくくなるため「赤緑色覚障害」と総称されています。 なお、「第3色覚障害」は、0.02％ということで稀ということです。

日本人の場合、大体、男性の20人に1人、フランスや北欧の男性ではもっと多く10人に1人、逆にアフリカ系の人では2～4％と少なくなっています。女性でも、日本では500人に1人、欧米では200人に1人くらいの割合で存在します。全世界の人口を65億人と仮定すると色覚障害をもつ人は約2億人、ＡＢ型の血液型の男性が世界では約２億人で大体その数に匹敵します。また、小中学校の40人学級（男子20人）の各クラスに必ず1人、男女100人の講演会場では2～3人、色覚障害の方がいるという計算になるため、ウェブアクセシビリティのJIS規格も制定されていることから無視できないと判断されます。

図１と図２は、視覚障害者の識別色に関するイメージです。
図１の①は「色覚障害でない」、②は「第1色覚障害」（赤）、③は「第2色覚障害」（緑）を表示しています。図１の①の各色が色覚障害者では②や③の各色に見えることを表しています。
図２では、④の地下鉄の路線図が色覚障害者では⑤のように見えることを表しています。ちなみに、全色覚障害の場合、⑤は、白・黒になります。
つまり、色覚障害者においては、白～灰色・黒、紺・青～水色、濃い茶～薄い・明るい茶の色が識別できることになります。

ここで、色覚障害者が識別可能な色を利用すること自体がカラーバリアフリーとい うことではありません。前記のカラーの地下鉄路線図④は、カラーバリアフリーに対応した事例であり、⑤になっても白・黒になっても分かるように類似色のルートは、数字とアルファベットで区別できるようにルート上に記載する等工夫がされています。また、例えば、緑字に赤字で書くと見えなくなるため白地に色のついた字を書くか、色背景に白丸や白字を書くなどして最悪白黒になっても確認できるように工夫されています。カラーバリアフリーとは、色覚障害の場合でも内容が確認できるよう対応することを言います。前記ウェブサイトの事例をみると背景やメニュー等の基本色は、色覚障害者でも障害者でない場合でも同様に見えるように配色されているようです。

図３において、「ピンク」の黒字テキストの下に水色の四角が表示されています。これは、視覚障害の場合にピンクは水色に見えることを表示しています。視覚障害の場合、濃淡はありますが四角で表示されている色が識別色となります。 図４の⑥はマイクロソフト社のBing検索、⑦はamazonの検索、⑧はGoogleの表紙検索で、⑨はGoogleの内部検索、⑩はYahooの表紙検索です。ほとんどの検索ボタンや文字・検索枠は、色覚障害における識別色を利用していることになります。

もともとコーポレートカラーが赤等の暖色系の色を使用している場合は別として、全体的に白の背景にプレートやメニューにおいて寒色系（青系・灰色・黒色等）を配置するデザインが主流となっています。
色には、色の三属性（色相・明度・彩度）の特性に基づいて「寒色・暖色」、「進出色・後退色」、「興奮色・沈静色」、「軽量色・重量色」といった分類があります。
色を12色の色相環で表示した場合における寒色・暖色・中間色の配置イメージが以下のイメージです。色の効果は、食欲や新鮮さ、時間・温度・重量・性別・遠近・心情等様々に表現されます。

色は、時間の感覚にも影響し、赤、オレンジなどの暖色系は、人を興奮させ時間が過ぎるのが速く感じる効果があり、飲食店などの内装に使うと、客の回転がよくなるといわれています。 逆に、寒色系は、時間が遅く感じるので、理容室・美容室や銀行など人を待たせる場所に適しています。
これは、「ウェブユーザビリティ」にも関連しますが、寒色系のページ配色は落ち着いて見ることができ、滞在率を上げ多くのページを見てもらう効果があるということです。また、高齢者等視力が低下している人にも見やすいという効果があります。

今後のホームページのデザインは以下のような傾向になると判断されます。

初期作成におけるシンプルなデザインやカラーバリアフリーについての色の採用は、企画設計の問題であり本項には記載しませんが、今回大幅なシステム改良を実施しており、アクセシビリティとユーザビリティの観点から、特に「新スマートフォン版システム」の本格的な導入をしました。
また、今後、パソコン版及びスマートフォン版のホームページの必須コンテンツ技術となるスライドショーを独自に「スライドアニメーション（簡易版）」と「スライドアニメーション（プロフェッショナル版）」として開発し、クラウドシステムとして@PAGE/@WEBに搭載しました。
今回、「新スマートフォン版システム」と「スライドアニメーションシステム」は、現時点で他に例を見ないレベルで作成されていますが、地域事業者様においても高度な技術を容易に利用できるようにシステム構築されています。

※アクセシビリティ（英: accessibility）
高齢者・障害者を含む誰もが、さまざまな製品や建物やサービスなどを支障なく利用できるかどうか、あるいはその度合い。

※ユーザビリティ　(英: usability)
特定の利用状況において、特定のユーザによって、ある製品が指定された目標を達成するために用いられる際の有効さ、効率、ユーザの満足度の度合い。（ISO 9241-11での定義）

※ユニバーサルデザイン（英: Universal Design、UD）
文化・言語・国籍の違い、老若男女といった差異、障害・能力の如何を問わずに利用することができる施設・製品・情報の設計（デザイン）をいう。 カリフォルニア州立大学のユニバーサルデザインセンター所長であったロナルド・メイス（1941-1998）が1985年に公式に提唱した概念。「できるだけ多くの人が利用可能であるようなデザインにすること」が基本コンセプトで、デザイン対象を障害者に限定していない点が、一般に言われる「バリアフリー」とは異なる。

※バリアフリー（Barrier free）
対象者である障害者を含む高齢者等の社会的弱者が、社会生活に参加する上で生活の支障となる物理的な障害や、精神的な障壁を取り除くための施策、若しくは具体的に障害を取り除いた事物および状態を指す用語である。

※ノーマライゼーション（英: normalization）
1960年代に北欧諸国から始まった社会福祉をめぐる社会理念の一つ。障害者と健常者とは、お互いが特別に区別されることなく、社会生活を共にするのが正常なことであり、本来の望ましい姿であるとする考え方。またそれに向けた運動や施策なども含まれる。