僕は僕でだれかじゃない

ビジネスとテクノロジーと健康についてあれこれ

MENU

【レポート】これから取り組むWebアクセシビリティ Vol.2

2017年2月15日(水)、アクセシビリティ基盤委員会 主宰の「これから取り組むWebアクセシビリティ Vol.2」に参加してきました。

その時のレポートになります。

伊原さん講演

アクセシビリティの定義

様々な能力を持つ幅広い層の人々に対する、製品、サービス、環境または施設のユーザビリティ

  • アクセシビリティはユーザビリティ?

ユーザビリティの定義

特定の目的を達成するために、 特定の利用者が、特定の利用状況で、 有効性、効率性、そして満足とともに ある製品を利用することができる度合い。

  • ユーザビリティは度合いを計るもの

スライドでは、ユーザビリティとアクセシビリティについて、下記のような表現をされておりました。

ユーザビリティとアクセシビリティ

  • ユーザビリティは、特定のケースでの「使える度」
  • アクセシビリティは、「使える度」を束ねた「幅広さ」

なぜ、アクセシビリティが必要か?

  • 加齢
  • 周囲の状況変化
  • 一時的な障害への対応

が挙げられる。身体障害者だけではなく、誰もがこのような事態に遭遇することを意識しておく。

ユニバーサルデザイン

  • アプローチの方法
  • 特定の人のためのデザインではない、 普遍的なデザイン
  • ある一つのものが普遍的に使える
  • さまざまな状況の人が同じものを使える

例)駅のホーム

ピンク本にも出てきてますが、講演の中でも説明がありました。

例:駅のホームへのアクセス手段

これを見ると、ユニバーサルデザインの理解が深まりますね。

Webアクセシビリティとは

Webアクセシビリティの間違った認識とは?

ガイドラインには、注意点として掲載されている。

guideline_gokai

注意点!
ホームページ等において、音声読み上げ、文字拡大、文字色変更等の支援機能を提供する事例がありますが、これだけでは、ウェブアクセシビリティに対応しているとは言えません。

例:文字サイズ変更ボタン

fontsize_change

  • 文字サイズ変更については、本来であればブラウザ側で対応するべき
  • 実際に弱視の方のブラウジングの仕方を見ると、この機能はムダだと思った

視覚障害者の実際のブラウジング映像

イメージを掴んでいただくには、総務省が出している動画を見ていただくのが早いかと思います。

視覚障害者(全盲)

  • Webサイト側で実装されている、音声読み上げ機能は使わない
  • OSやブラウザなりで実装されている支援機能を使っている(スクリーンリーダーなど)
  • 一度、全盲の中根さんとお会いさせていただきましたが、iPhoneの使い方が神ががってた
  • 僕らより使いこなされている感あり
  • 視覚障害者の中でも、リテラシーの差があるということをこの時に知った

視覚障害者(弱視)

  • 弱視の方は、OSの機能で画面を500%くらいに拡大して見ている
  • 色は反転させて利用
  • こちらもWebサイトで実装された文字サイズ変更機能は使ってない
  • というか、使い物にならない

なぜWebはアクセシブルなのか

Webの本質

The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.

Webの力はその普遍性にあります。 障害の有無にかかわらず誰もがアクセスできる というのがWebの本質的な側面なのです。

Webアクセシビリティの根幹

  • Webアクセシビリティの根幹は、マシンリーダブルなテキスト
  • HTMLで書くことによって構造化される
  • ブラウザや支援技術でカスタマイズできる
  • つまり、人でも機械でも読める
  • これがWebの本質にも繋がる

Webアクセシビリティのガイドライン

Web Content Accessibility Guidelines (WCAG) 2.0

  • 原文(英語)
  • 日本語訳
  • W3Cが勧告している標準企画
  • Web技術を使ったコンテンツはすべて対象となる
  • JIS X 8341-3:2016 と一致
  • 3つのレベルがある

レベルA(シングルA)

  • どんなサイトでも充たすべき最低限の水準
  • キーボードで操作できるようにするなど

レベルAA(ダブルA)

  • 目で見てわかりやすい
  • カラーコントラスト、文字サイズなど
  • マシンリーダブルであること

レベルAAA(トリプルA)

  • レベルA〜AAの基準を満たすこと
  • わかり易い言葉を使うなど
  • 目標とすることは推奨しない
  • ヒューマンリーダブルであること

どこから取り組むべきか

方針を立てる

方針を立てないと、、、

  • 配慮がまったく行われない
  • 適切な判断ができない

自分事として、考える事ができなくなってしまう。

ただし、方針があっても、、、

  • 曖昧な方針はダメ
  • 誤解に基づいた方針はダメ
  • 手段が目的になってしまうのはダメ

方針の立て方

決めるべき内容

  • 対応範囲
  • 適合レベル
  • 対応期限

適合レベルは最適か?はサイトを見て決める

対応表記ガイドライン を参考に。

方針を立てるタイミング

  1. 発注側で先に考えるパターン
  2. 受注側に提案を求めるパターン
  3. 要件定義時に考えるパターン

目的を明文化することが必要。
Yahoo!の「ウェブアクセシビリティ方針」が参考になる。

コスト

シングルAだと、そんなに負担はない。
シングルAに対応する場合は、基本下記5つだけである程度網羅できる。

  1. テキストだけで分かるように書く
  2. 適切にマークアップをする
  3. 勝手に動かさない
  4. チカチカさせない
  5. 動画や音声の代替テキストを書く

1,2だけでもマシンリーダブルになる。

JSによるUI

  • スクリーンリーダーには状態が伝わらない
  • WAI-ARIAを使う

まとめ

できることから始めよう!

増井さん講演

取り組むべき理由

  • 取り組むべき理由に目を向ける
  • 各法律の歴史を知る
  • 企業のあるべき姿
  • マーケティング3.1 = 社会的価値、社会(人間)視点
  • 理由はいくらでも見いだせるはず

アクセシビリティはいつ必要?

  • 今、必要としている人がいる
  • 今後更に増える
  • 2020年東京オリンピック
  • 利用できる度合いを高めていく→誰もが読むことができるetc

キヤノンの取り組み

基本理念

  • 機会→機械可読性
  • 保証→アクセシビリティ
  • 共感→マーケティング、品質向上

キヤノン ウェブアクセシビリティーについてを参考に。

どうやって準拠のページを増やしたか

  • サイトリニューアル時に対応
  • 計画を立てる→いつかやろう、ではダメ
  • アクセシビリティは障害者だけのものではない
  • 原稿フォーマットの統一(wordで文書構造を明文化)
  • テンプレートの活用

docomo ウェブアクセシビリティ方針YAMAHA ウェブアクセシビリティ方針も参考に。

まとめ

  • アクセシビリティは、文書構造を正しく書くことで大きく変わる
  • アクセシビリティは、今から始めれる
  • とりあえず、始めて見る
  • Webの本質を知ると、アクセシビリティは無くてはならないモノであると思い知らされる
  • 指針はあるが、正解がない(というと語弊になるかな、、、診断する人によって解釈が変わるという意)
  • アクセシビリティは、障害者だけのものではない
  • 実際に当事者を目の当たりにすると、考えさせられる
  • アクセシビリティは、表面的なところ(フォントサイズが、、、とか、コントラストが、、、とか)が取り上げられがちだが、Webの本質をもっと啓蒙していくべき
  • アクセシビリティをなんとなく知ってるが、きちんと勉強している人が少ない印象

ということで、アクセシビリティについては、引き続き勉強していきます。

アクセシビリティ学ぶなら、伊原さんのピンク本は必読。(ていうか、いつのまにかKindle版出てるしーーー!!!)

コーディングWebアクセシビリティ - WAI-ARIAで実現するマルチデバイス環境のWebアプリケーション」も併せて読むと良いでしょう。

この2冊は、いつでもすぐに読めるように、デスクの横に置いてます(積読じゃないですよ)。

おわり。