(レポート) [CMS大阪夏祭り2016] オーサリングツールとしてのCMSとWebアクセシビリティ #cmsfes
はじめに
本記事は2016年9月3日(土)に開催されたイベント「CMS大阪夏祭り2016」のセッション「オーサリングツールとしてのCMSとWebアクセシビリティ」のレポートです。スピーカーはアルファサード株式会社の野田 純生氏。
レポート
自己紹介
・野田さん。@junnama。
・Movable Typeエバンジェリスト。
・Webアクセシビリティエバンジェリスト。
・ソフトウェア開発者。Perl、PHP、JavaScript、Swift。
・Movable Typeのプラグインを世界で一番書いてる。
会社紹介
・アルファサード株式会社。大阪本社、東京にもオフィスがある。
・最近、Webアクセシビリティ向上支援の問い合わせがすごく増えている。
・ColorQuest。Macで配布しているアプリ。何色なのかを表示してくれるもの。
・Facebookがなぜ青いか?色弱にも識別できるから。
・青は判別つきやすいが、赤や緑は識別しづらい。
・ColorTester。WIndowsとMacで配布している。
・画像ファイルをドラッグアンドドロップすると、背景と文字が何色かを判別。
・コントラスト比を確認して、JIS規格に則っているか判断してくれる。
・Movable Typeに対して深くコミットしている。
・2015年からW3Cのメンバー。
Webアクセシビリティ
・高齢者や障害者であったり、異なる情報端末でも情報を取得あるいは発信できること。
・利用者の状態、端末、障害の有無に関わらずwebが利用出来る。
・Web Contents Accessilibity Guidelines 2.0が国際標準。
・日本ではJIS X8341-3:2016が規格。
・公共サイトではAAに準拠することが必須。
・シドニーオリンピックで、Flashで作成されたページが視覚障害者が表示できずに訴訟になったことがある。
・4つの原則。知覚可能、操作可能、理解可能、堅牢。
・画像にaltタグを付ける、など。
・Googleなどでは画像を機械学習で判別しているが、現時点ではコンテンツ制作者がちゃんとaltタグを付ける必要がある。
・障害者差別解消法。
・官公庁や自治体が導入したCMSが、視覚障害者が使えないとアウト。
・サイトをアクセシブルにするだけでなく、CMS側もアクセシブルにしないといけない。
Authoring Tool Accessilibity Guidelines(ATAG) 2.0
・対象。
・オーサリングツールの開発者。
・CMSの開発者。
・ワープロソフトのHTMLエクスポート機能の開発者。
・マルチメディアオーサリングツール(動画の字幕)の開発者。
・それらのツールを使うコンテンツ制作者。
・パートAは、オーサリングツール自体をアクセシブルにすること。
・CMSの管理画面がアクセシブルかを見るのがパートA。
・パートBは、オーサリングツールがアクセシブルなコンテンツ作成を手助けすること
・CMSで作られたコンテンツがアクセシブルかを見るのがパートB。
オーサリングツールのアクセシビリティ
・オーサリングツール自身をアクセシブルにする。
・入札要件では出力されるコンテンツのことしか書いてないことが多い。
・今後はCMS自身も入札要件になっていくかも知れない。
・CMSはフォームのかたまり。
・テキストはあんまり問題が発生しないが、動画やフォームをコントロールするのは結構大変。
・そこまで手が回っていないことが多い。
最近のWebシステム
・Web上でドラッグアンドドロップでコンテンツを入れ替えできる。
・マウスなどのポインティングが使えない場合は?
・チェックボックスとボタンによる代替え手段の提供。
・代替え手段が用意されていないと操作できない。
・余談。読み上げツールは読み上げスピードを早くしている人が多い。読み上げの時間が勿体無いから。
・肢体不自由者はポイントデバイスが使えない場合がある。
・キーボード操作でコントロールできることは重要。
・altでは読み上げで明確な操作がわかるように。矢印、みたいな形を書いても伝わらない。
・CMSのアクセシビリティはWebサイトのアクセシビリティと同じ。検索の用意など。
今時のCMSをアクセシブルにするには?
・障害者差別解消法で、サービスやアプリも対象になる可能性がある。
・障害者のIT活用はすごく進んでる。iPhoneにもVoiceOverがある。Windowsにもある。
・開発者が、知って意識すること。
・小さいところから始める。最初に全部やるのは無理。必要なところから少しずつ。
・それがそのCMSの優位性になる。
オーサリングツールがアクセシブルなコンテンツ作成の手助けをする
・WordPress。ドラッグアンドドロップで画像アップロードすると、代替えテキストの入力欄がある。
・Movable Type。ドラッグアンドドロップでの画像アップロードが可能。
・そのまま代替えテキストの入力がない。一度戻る必要がある。
・WYSIWYGエディタの問題点。編集画面でaltが確認できない。
・PowerCMSはWYSIWYGエディタ上でaltタグが見えるように昨日修正した。
・WTAGにおける非テキストコンテンツの代替えテキスト
・代替えテキストが適切に設定されているのは望ましくない。
・コンテンツは出さないと意味がない。出した後でも修正できるようにすること。
・PowerCMSではファイル名が代替えテキストになっているとチェックする。
・PowerCMSではコンテンツの検証や画像のチェックが出来る機能がある。
・コンテンツがAAに適合しているかをチェックして検証レポートを出力。
・コンテンツチェックは記事のみ。
・テンプレートでアウトプットされる共通エリアはコンテンツとしてはチェックしない。
・テンプレート側でチェックする。
・人の手で確認が必要なものは常にチェック。
・位置に依存した文章はダメだけど機械ではチェックできない。
・参考: セッション後に野田さんにお聞きしたところ、PowerCMS用として作成したWebアクセシビリティ向上のプラグインはMovable Typeでも動くとのこと。
まとめ
・各CMSコミュニティで共有してほしい。
・できるところ、小さなところから取り組むと良い。
・最初は画像管理、画像挿入機能から。
・アクセシブルなテーマを同梱するのも良い。
さいごに
このセッションにはたくさんの人が参加しており、Webアクセシビリティへの要求がとても高まっているんだなと感じました。アクセシビリティについて改めて考える良い機会になりました。