これから取り組むWebアクセシビリティ 2018 春

これでわかる！
Webアクセシビリティって？
JIS X 8341-3って？
2018年5月24日（木曜日）植木 真（ウェブアクセシビリティ基盤委員会 委員長）

ウェブアクセシビリティって？
ウェブにおけるアクセシビリティの考えかた

ウェブアクセシビリティとはウェブのアクセシビリティを言い表す言葉がウェブアクセシビリティです。ウェブコンテンツ、より具体的にはウェブページにある情報や機能の利用しやすさを意味します。
さまざまな利用者が、さまざまなデバイスを使い、さまざまな状況でウェブを使うようになった今、あらゆるウェブコンテンツにとって、ウェブアクセシビリティは必要不可欠な品質と言えます。
https://waic.jp/knowledge/accessibility/誰もがアクセスできるのが “Web”“The power of the Web is in its universality. Access by
everyone regardless of disability is an essential aspect.”— Tim Berners-LeeW3C Director and inventor of the World Wide Web

視覚障害者（全盲）のウェブページ利用方法

http://www.soumu.go.jp/menu_news/s-news/2005/051215_1_wmv.html

disability = ○○できない、○○しづらい
見ることができない• 全盲の視覚障害

コンテンツの問題• 画像の代替テキスト• 文書構造のマークアップ• リンクテキスト• キーボード操作など視覚障害者（弱視）のウェブページ利用方法

http://www.soumu.go.jp/menu_news/s-news/2005/051215_1_wmv.html

disability = ○○できない、○○しづらい
見えづらい• 弱視、ロービジョン• 加齢による衰え• 老眼、近眼• 視力が弱い• 屋外で見ているコンテンツの問題• 色のコントラスト• 動きのあるコンテンツ• 変化するコンテンツ• 表示サイズの可変性• 制限時間 / タイミング など

disability = ○○できない、○○しづらい
聴くことができない• 聴覚障害• オフィスや図書館• 公共交通手段• イヤホンを忘れたコンテンツの問題• 音声付き動画• 音声コンテンツなど

disability = ○○できない、○○しづらい
聴こえづらい• 難聴• 突発性の難聴• 加齢による衰え• 周囲が騒がしい

コンテンツの問題• 音声付き動画• 音声コンテンツなど

動画のキャプション

https://www.w3.org/WAI/perspective-videos/disability = ○○できない、○○しづらい
マウス操作• 運動障害 / 上肢不自由• マウスの調子が悪い• 利き腕をケガした• 端末にマウスがない

コンテンツの問題• マウスでしか操作できない• マウスオーバーで変化などdisability = ○○できない、○○しづらい
キーボード操作• 運動障害 / 上肢不自由• 指先が震えてしまう• 入力に時間がかかる• 腱鞘炎で入力しづらい• 端末にキーボードがない

コンテンツの問題• キーボード操作対応• フォーカス順序• フォーカスインジケータ• 制限時間など

disability = ○○できない、○○しづらい
タッチ操作• 運動障害 / 上肢不自由• 加齢による衰え• 指先が乾燥しているコンテンツの問題• タッチ操作対応• ボタンやリンクのサイズなど

disability = ○○できない、○○しづらい
認知・理解・学習• 認知・言語・学習障害• ディスレクシア（読字障害）• 加齢による衰え• 急いでいる• 慌てているコンテンツの問題• 見出しやラベルの文言• UIに一貫性がない• 1行の文字数、行間• エラーメッセージなど

利用者体験（UX）の土台となるもの

http://www.bookslope.jp/blog/2012/07/evaluationuxhoneycomb.html

もし○○できない、○○しづらいと…
公的機関のWeb

企業のWeb• 住民に行政サービスを平等に提供できない• ビジネスの目標達成から遠のく• 災害などの緊急時に必要な情報提供ができない• ビジネス機会を損失する• 法的責任を問われる可能性もある• イメージダウンのリスクが生じる• 顧客満足度が低下する

障害者差別解消法

http://www8.cao.go.jp/shougai/suishin/sabekai.html

Webアクセシビリティによくある誤解 障害者のためだけに特別なコトをする ウチのWebサイト、高齢者や障害者は使わない いろいろなボタン/機能を提供する必要がある▲ 文字サイズ変更ボタン▲ 文字色 / 背景色変更ボタン▲ 音声読み上げ機能
 デザインの見た目がつまらなくなる
 莫大なコストと時間がかかる

では、何をどこまでやればよいのか？
 その目安になるのがガイドライン▲ 諸外国では「WCAG 2.0」を技術基準として採用▲ 「WCAG 2.0」は、ISO/IEC規格として承認（2012年）▲ JIS規格は、ISO/IECと一致した内容に改訂（2016年）
WCAG 2.0 ＝

ISO/IEC 40500:2012＝

JIS X 8341-3:2016

JIS X 8341-3って？
ウェブコンテンツの品質基準

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

2004年6月「JIS X 8341-3」が初めて制定
JIS X 8341-3:2004


国内外の既存ガイドラインなどを参考に、日本語特有と思われる事項も網羅した 独自の指針

2008年12月「WCAG 2.0」がW3C勧告にWCAG 2.0
 Web Content Accessibility Guidelines
 法整備が進む諸外国で技術基準として採用される

2010年8月「JIS X 8341-3」を改定
JIS X 8341-3:2010
 W3C勧告「WCAG 2.0」を包含する形で改定▲ 61の同じ達成基準を採用
 3つのレベル（A、AA、AAA）も同じく採用

 プロセス（企画、設計～運用まで）および試験方法の要求事項を独自の規定として作成

2012年10月「WCAG 2.0」がISO/IEC規格にISO/IEC 40500:2012
 W3C勧告「WCAG 2.0」をそのまま国際規格として承認

2016年3月「JIS X 8341-3」2回目の改定
JIS X 8341-3:2016
 対応国際規格となった「ISO/IEC 40500:2012」の一致規格とすべく改定

 WCAG 2.0の訳語を見直し
 附属書JAと附属書JBを独自に作成して追加▲ いずれも「参考」であり、規定ではない

61の達成基準、3つのレベル
 レベル A25の達成基準▲ アクセシビリティ確保に最低限必要なレベル
 レベル AA13の達成基準▲ 諸外国で公的機関に要求されているレベル▲ 日本では総務省が公的機関に推奨している レベル AAA23の達成基準▲ 特定のコンテンツにしか適用できない事項を含む▲ レベルAAAを目標とすることは推奨されていない

達成基準とは？
 あらゆる障害のニーズをふまえて、ウェブコンテンツが満たすべき品質基準を定めている

Web Content Accessibility Guidelines（WCAG）
2.0 は，ウェブコンテンツを障害者にとってよりアクセシブルにする方法を定義している。
アクセシビリティは，視覚，聴覚，身体，発話，認知，言語，学習及び神経の障害を含む，広範な障害に関係している。
JIS X 8341-3:2016「0B イントロダクション」

達成基準を満たす方法の具体的な例


ページの内容が分かるページタイトルを記述する

見出しやリストなどの文書構造をマークアップする

リンク先が分かるリンクテキストにする



情報を伝えている画像の代替テキストを提供する



文字色と背景色のコントラストを十分に確保する

キーボードだけで操作できるようにする

フォーム・コントロールのラベルをマークアップする

色の違いが分からなくても理解できるように情報を提供する



エラーメッセージではエラー箇所とその修正方法を説明する



動画にはキャプションを提供する

達成基準を満たすメリット より多くの利用者が使用できるようになる さまざまな利用環境をサポートできる 利用者の多様化するコンテキストに対応できる
 利用者全般のユーザビリティが向上する
 より良い利用者体験（UX）を提供できる
 検索エンジン最適化にもプラスになる 将来の新しいデバイスへの対応も容易になる

JIS対応の基本的な進めかた
 方針を決める▲ 対象範囲、目標とするレベルと対応度

 対象範囲での対応を進める
 試験を実施する▲ 特定のページのみ対応＝ウェブページ単位▲ Webサイト全体などで対応＝ウェブページ一式単位

 試験結果を公開する

JIS X 8341-3:2016の「附属書 JA（参考）」ウェブアクセシビリティの確保・維持・向上のプロセスに関する推奨事項 企画、設計、制作・開発、確認、保守・運用に至る各プロセスにおける推奨事項

 「ウェブアクセシビリティ方針」の文書化 など
 PDCAサイクルによるアクセシビリティの確保・維持・向上

「適合」＝「供給者適合宣言」を行うこと
 当規格の基準を満たしていることを示す一つの方法として「供給者適合宣言」がある▲ 「JIS Q 17050-1 適合性評価 供給者適合宣言 第1部：一般要求事項」▲ 「JIS Q 17050-2 適合性評価 供給者適合宣言 第2部：支援文書」
 特定の認証機関等は存在しないため、試験は誰でも実施可能▲ Webサイトの運営者、Webサービスの提供者▲ 受託している制作・開発会社など▲ どちらでもない第三者＊ ただし、規格の要求事項を理解している必要がある＊ いずれの場合も「供給者適合宣言」を行う

多くの場合、「供給者適合宣言」は困難 WAICの「対応度表記ガイドライン」を用いることが可能▲ 総務省「みんなの公共サイト運用ガイドライン」でも採用

https://waic.jp/docs/jis2016/compliance-guidelines/201603/

JIS X 8341-3:2016の「附属書 JB（参考）」
試験方法
 「ウェブページ単位」▲ 特定のURLだけが対応している場合
 「ウェブページ一式単位」▲ Webサイト全体やディレクトリ全体で対応した場合▲ 試験は対象範囲内から「ランダム選択25ページ以上」＋「任意選択15ページ以上」を選定して実施
 総ページ数に関係なく、計40～50ページ程度

JISに対応するメリットは？
 より多くのユーザーが利用できるようになる▲ 多様化する利用環境（デバイス、場所）▲ 多様化するコンテキスト（場面、状況、制約）
 Webコンテンツの品質基準が明確になる▲ JIS規格 = ISO/IEC規格 ＝ W3Cのガイドライン▲ 世界共通の品質基準
 社会からの要請に応えることができる▲ 障害者差別解消法の施行▲ 諸外国で進む法制化、法律による義務化

参考ウェブアクセシビリティ基盤委員会の資料

WAICが作成・公開している各種ガイドライン

ウェブコンテンツのJIS X 8341-3:2016 対応度表記ガイドライン
https://waic.jp/docs/jis2016/compliance-guidelines/201603/



ウェブアクセシビリティ方針策定ガイドライン
https://waic.jp/docs/jis2016/accessibility-plan-guidelines/201604/



JIS X 8341-3:2016 対応発注ガイドライン
https://waic.jp/docs/jis2016/order-guidelines/201604/



JIS X 8341-3:2016 試験実施ガイドライン
https://waic.jp/docs/jis2016/test-guidelines/201604/

これから取り組むWebアクセシビリティ 2018 春

これでわかる！
Webアクセシビリティって？
JIS X 8341-3って？
2018年5月24日（木曜日）