Webアクセシビリティの現状ダイジェスト 2014

Webアクセシビリティの現状ダイジェスト 2014

株式会社ミツエーリンクス木達一仁

2014年12月4日

アクセシビリティやるぞ！祭りby Yahoo! JAPAN・ミツエーリンクス・BA

アジェンダ

• 自己紹介• Webアクセシビリティ確保の現状

• 各種標準化の現状• まとめと提言

※ ユーザーエージェントや支援技術の現状については本セッションでは取り扱いません

自己紹介

木達一仁• 取締役CTO 兼第二本部長

• 制作本部技術統括担当

• 主にマークアップやスタイルシートの設計、関連ガイドラインの策定・運用に従事

• ウェブアクセシビリティ基盤委員会（WAIC）副委員長

http://html5experts.jp/shumpei-shiraishi/11532/



























































Webアクセシビリティ確保の現状

海外

http://www.slideshare.net/waic_jp/web-40002957



























































http://webguide.gov.au/accessibility-usability/accessibility/




















































https://webtoolkit.govt.nz/guidance/about-the-standards/about-the-web-accessibility-standard/



























































http://www.section508.gov/



























































http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

http://www.ada.gov/

https://www.ssbbartgroup.com/blog/2013/12/02/air-carrier-access-act-final-rule-and-web-accessibility-requirements/




























































海外で進む法制化（例）• オーストラリアの政府系Webサイトは2012年末までに

WCAG 2.0 A、2014年末までにAA準拠

• ニュージーランドの政府系Webサイトは4つのフェーズに分けて段階的にWCAG 2.0 AA準拠を進行

• 米国ではリハビリテーション法508条（改正作業中）やADA法によりWebアクセシビリティへの対応が進む

• ACAAの影響は日本の航空会社にも及んでいる

国内

公的機関

http://www.soumu.go.jp/main_sosiki/joho_tsusin/w_access/index_02.html






















































運用モデルで示された目安• 既に提供しているホームページ等

• 2014 年度末まで JIS X 8341-3:2010 の等級 AA に準拠（試験結果の公開）

• ホームページ等を新規構築する場合

• 構築前に「ウェブアクセシビリティ方針」策定

• 構築時に JIS X 8341-3:2010 の等級 AA に準拠（試験結果の公開）

http://waic.jp/docs/survey/public_institutions/201405.html



























































方針策定・公開済試験結果公開済

47都道府県（47団体） 26 520政令指定都市（20団体） 18 8

府省等（41団体） 13 6

方針策定と試験結果表示の実態調査（2014年5月）

JIS対応は進んでいるものの目安からすると遅れている

• 「みんなの公共サイト運用モデル」の強制力は必ずしも強くはない

• JIS X 8341-3への正しい理解（対応方針や試験結果の出し方など）の普及・啓発も不可欠

一般企業

http://waic.jp/docs/survey/corporations/201408.html




























































方針策定と試験結果表示の実態調査（2014年8月）

Web広告研究会会員社（広告主、メディア・媒体社）190社中

• Webアクセシビリティに関する配慮事項の記載：24社

• JIS X 8341-3に基づくWebアクセシビリティ方針策定・公開済：7社

• JIS X 8341-3に基づく試験結果公開済：6社

http://www.takeda.co.jp/accessibility/




























































http://www.toshiba.co.jp/accessibility/index_j.htm




















































http://www.eisai.co.jp/acguide.html




























































http://www.kewpie.co.jp/accessibility/index.html




























































http://www.denso.co.jp/ja/accessibilitypolicy/index.html



























































http://www.fujifilmholdings.com/ja/accessibility/index.html





















































http://canon.jp/notice/accessibility.html



























































http://www.konicaminolta.jp/siteinfo/accessibility.html




























































http://www.softbank.jp/help/sitepolicy/accessibility/




















































https://www.nttdocomo.co.jp/utility/term/web_accessibility/index.html




















































http://jpn.nec.com/design/accessibility/index.html



























































http://www.hitachi.co.jp/utility/accessibility/index.html





















































http://jp.fujitsu.com/accessibility/



























































http://docs.yahoo.co.jp/info/accessibility/



























































アクセシビリティに積極的な企業はまだ多くない印象• 費用対効果（ROI）が測りにくい

• ポリシー作成者層に Web アクセシビリティの重要性や必要性が正しく理解されていない

• アクセシビリティを確保し続けるための体制が構築できていない

• ランキングの類がない

http://www.mofa.go.jp/mofaj/gaiko/jinken/index_shogaisha.html






















































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




























































http://waic.jp/news/20140804.html



























































障害者差別解消法の今後には要注目

• Webも差別を禁止する分野に入るはず

• 「情報アクセシビリティの向上」• 「情報の取得・利用・発信におけるアクセシビリティ向上のための施策」

• 基本方針（原案）に関する意見を募集中（～12/25）

• 2016年施行予定

各種標準化の現状

WCAG 2.0

http://www.w3.org/TR/WCAG20/






















































http://www.iso.org/iso/iso_catalogue/catalogue_tc/catalogue_detail.htm?csnumber=58625



























































http://waic.jp/docs/WCAG20/Overview.html




















































WCAG 2.0

• 2008年12月勧告

• 日本でiPhoneが発売された年

• 4つの原則（知覚可能、操作可能、理解可能、堅牢性）

• 12のガイドライン

• 61の達成基準（達成等級：A / AA / AAA）

• 技術非依存

http://www.bbc.co.uk/guidelines/futuremedia/accessibility/mobile_access.shtml



























































https://w3c.github.io/wai-tutorials/




























































http://www.w3.org/TR/UNDERSTANDING-WCAG20/




























































http://waic.jp/docs/UNDERSTANDING-WCAG20/Overview.html



























































http://www.w3.org/TR/WCAG20-TECHS/




























































http://waic.jp/docs/WCAG-TECHS/Overview.html



























































https://momdo.github.io/WCAG20-TECHS_aria.html




























































WCAG-EM

http://www.w3.org/TR/WCAG-EM/



























































WCAG-EM

• WCAG 2.0の関連文書の一つ

• WCAG 2.0に適合するうえで必要とされる評価のプロセスについてまとめたもの

• JIS X 8341-3：2010の試験やWAICの試験実施ガイドラインと関連

• 将来的には両者の整合を検討

http://waic.jp/docs/jis2010/test-guidelines.html

WAI-ARIA

http://www.slideshare.net/mlca11y/waiaria
























































http://www.w3.org/TR/wai-aria/




























































https://momdo.github.io/wai-aria/






















































WAI-ARIA

• セマンティクスとフォーカス制御を強化• role 属性 / aria-* 属性

• HTML5で使うのであれば、Using WAI-ARIA in HTML

を参考に

• 1.0が2014年、勧告

• 1.1の策定が進行中

http://www.w3.org/TR/aria-in-html/






















































https://imagedrive.github.io/spec/aria-in-html.xhtml




























































HTML5

http://www.w3.org/2014/10/html5-rec.html.ja



























































http://www.w3.org/TR/html5/



























































https://momdo.github.io/html5/Overview.html



























































http://www.html5accessibility.com/















































































































































































http://www.w3.org/2014/10/modularity-slides/




















































http://www.w3.org/TR/html-alt-techniques/






















































http://www.w3.org/TR/html-longdesc/

























































http://dev.w3.org/csswg/css-pseudo/#alt-property
























































IndieUI

http://www.w3.org/TR/indie-ui-events/






















































http://www.w3.org/TR/2014/WD-indie-ui-context-20140626/




























































IndieUI

• Events：デバイスに依存することなく共通のインタラクションを実現可能にする

• 解決困難な問題に直面（例：スライダー）• User Context：ユーザーの設定を取得可能にする

• プライバシーとの兼ね合いをどうするか？• メディアクエリーで実現できないか？

WebVTT

http://dev.w3.org/html5/webvtt/

























































http://www.w3.org/TR/webvtt1/



























































WebVTT

• Web Video Text Tracks Format

• テキストベースのデータフォーマット• HTML5のvideo要素に字幕を追加

• track要素とともに使用

• エンコードはUTF-8

• mimeタイプはtext/vtt

http://caniuse.com/#search=webvtt



























































JIS X 8341-3

http://www.webstore.jsa.or.jp/webstore/Com/FlowControl.jsp?lang=jp&bunsyoId=JIS+X+8341-3%3A2010&dantaiCd=JIS&status=1&pageNo=0



























































http://www.jisc.go.jp/app/pager?id=964743






















































JIS X 8341-3

• 2004年6月公示

• 高齢者・障害者等配慮設計指針−情報通信における機器，ソフトウェア及びサービス− 第３部：ウェブコンテンツ

• 2010年8月改正、WCAG 2.0 と整合（JIS X 8341-3:2010）

• 2015年の改正に向けた作業を進行中























































http://www.jsa.or.jp/domestic/domestic.asp



























































まとめと提言

• 公的機関、一般企業ともにWebアクセシビリティ確保の取り組みはまだまだこれから

• 海外の法制化の動向に留意しつつ、障害者差別解消法の施行に向けた動きも要注意

• そもそもWebアクセシビリティは障害者のためだけに必要なわけではない、ということを踏まえて「できることから」実践を

• WCAG 2.0やJIS X 8341-3は手段であって目的ではない

• 多様化するユーザー、デバイス、コンテキストに対応するための各種標準化が進行中

• Techniques for WCAG 2.0（実装方法集）にあるテクニックだけが、達成基準を満たす方法というわけではない

• 安定度や実装状況などに配慮しつつ、グレースフルデグラデーションの考え方をもって、新しい仕様は積極的に採用していきたい

http://www.csun.edu/cod/conference/2015/sessions/index.php/public/website_pages/view/1
























































http://www.w4a.info/2015/



























































http://www.webaxe.org/announcing-gaads-new-date-for-2015-and-beyond/



























































アクセシビリティやるぞ！！！

ご清聴ありがとうございました

株式会社ミツエーリンクスTEL：03-5937-2891

E-mail：[email protected]

mailto:[email protected]

Technology

Webアクセシビリティの現状ダイジェスト 2014