今こそ取り組むウェブアクセシビリティ参加報告

2015年2月2日（月）に大阪産業創造館で行われた「今こそ取り組むウェブアクセシビリティ」というセミナーに参加してきました。
色々と考えさせられる内容でしたので、聞いて思ったことをまとめていきます。

目次

• アクセシブルなウェブサイト構築とCMSの活用
• アクセシビリティチェック 基本の「キ」
• PowerCMS 8341 のご紹介
• デザインから取り組むWebアクセシビリティ
• まとめ

アクセシブルなウェブサイト構築とCMSの活用

最初のセッションはシックス・アパート株式会社のMovableTypeエバンジェリストの長内さんのお話でした。
今回のセッション中に共通項として語られた「アクセシビリティは障害者のためだけのものではない」という部分をはじめとして、アクセシビリティの基礎的な考え方や、CMSについてすごく分かりやすく説明してくれました。
セッションは最初が肝心だと僕は思っていて、最初に「アクセシビリティとはそもそもどういう事なのか」という部分を紹介されていたのが印象的でした。
アクセシブルというのは、「だれもが情報へのアクセスが可能」ということで、必ずしも障害者や高齢者向けの施策ではないということを改めておっしゃってました。
世間一般でアクセシビリティがどの程度浸透しているのかわからないんですが、Webの世界の人達は比較的アクセシビリティという言葉を知っているかと思います。
でも、その認識が「障害者・高齢者」向けの施策で、「付加価値としてやっておく」ものであると考えている人が多いと思います。
でも、アクセシビリティはそういう限定的なものではなく、「だれもが情報へのアクセスが可能」なもので、しておかなければいけないと考えても差し支えないくらい基本的なことだということを再認識しました。
CMSについては、CMSの基本的な考え方として「コンテンツとデザインの分離」について説明されてました。
コンテンツについては、「積み重ねることで重要性が増す」という事を総務省の情報通信白書を例にとって説明していました。
毎年更新される膨大な量の詳細な情報が長年蓄積されていくことで他とは比較にならない価値を生んでいるという説明はとてもわかりやすかったかなと思います。
その後はのMovableTypeのエバンジェリストらしく新しいMTの機能紹介などをされてました。
気になったのはDataAPIの活用とか、プラグインの「MoreAnalytics」とか。
他には初期テンプレート3つが、全てMITライセンスで公開されていることなどがちょっと新鮮で、MTがオープンソースだった事とかも考えてオープンな文化が出来ているなーと思って聞いてました。
あと、MTとAWSのイメージMovableType for AWSとかもオープンでいいですね。
最近MTから離れがちでしたが、元々僕はけっこうMTが好きな方なのでまた久々に触ってみようかなと思いました。

アクセシビリティチェック 基本の「キ」

株式会社インフォアクシアの植木さんのセッションは基本的な部分のチェック項目などを中心とした内容でした。
長内さん同様、アクセシブルは土台となる考え方で、全てのスタートであるということ、それが出来ていないということは「機会損失」だし、行政などで行う緊急時の情報配信とかが正しく行われない危険性に繋がるという表現がうまいなと思ってました。
YahooのWebアクセシビリティ方針といったガイドラインを確認したり、WCAG 2.0などの仕様を確認するという癖は付けておきたいなと思います。
あと、今回のお話のメインキーワードともいえる「マシンリーダブル」の部分はすごく面白くて、Googleの「Google検索エンジン最適化スターターガイド」がまさにマシンリーダブルであるという事と、SEOを意識したサイトの制作が結果としてアクセシビリティを確保するという事に繋がるという話は目から鱗でした。
SEOとアクセシビリティの共通項が多いという事は、サイトのSEOをする事でアクセシビリティも両立できるという点で非常に活用の幅が広がりますし、多くの方が導入する理由付けにもなると思います。
細かいチェックポイントは以下のような感じでした。
とても基本的な事なので、これくらいはきちんとしてないとおかしい内容かなとは思います。

ページタイトル

ページの内容がわかるタイトルを付ける。ページタイトル＋サイト名

見出し

見出しは各セクションの主題がわかるように。
文書構造で判断する事を徹底する

リスト

リスト項目はリストタグでマークアップする。文字で「・」と表現しない

リンクテキスト

リンクテキストだでけリンク先がわかるように。
「こちら」というリンクテキストはNG
また、リンクテキストとリンク先の情報が一致している方が望ましい。

画像の代替テキスト

画像に文字が乗っている場合は、その文字を設定する。
写真の場合は、写真であることを記載。
顔写真の時は顔写真と記載。
グラフの場合はグラフ内のデータを記載。（情報量が多い場合はデータテーブルと併記）
フロー図は流れを説明。
画像の代替テキストについては、それだけでけっこう色々考える事がある深いテーマになるんですが、基本的には「電話で友達に説明する」という風に考えてみると分かりやすいという説明がしっくり来ました。
あと、変に丁寧にしすぎてもよくないので「無駄に丁寧にしない」という事や、親切心からやってしまいがちな「画像にない説明は記述しない」という事も大切ですね。
アイコンなどの視覚表現に使用する画像のaltは空にするか、CSSで背景画像として設定するというのも重要です。
あと、今回僕の中で一番勉強になったのはランドマークロールのrole属性について。
これまで特に積極的に入れていませんでしたが、使った方がいいなという事と仕様をきちんと確認しようと思います。
HTML5が勧告になった今であれば「role=”main”」は必須といっても過言ではないのかなと思います。

キーボード操作

キーボード操作に関しては、

• キーボードのみで操作できるか
• キーボードフォーカス（Tabキー）で表示されるか
• フォーカスの移動順序
• ページの最初から最後までキーボードフォーカスできるか？

といった点を確認する必要があります。

色のコントラスト

色のコントラストについては「4.5:1」という基準値があるので、そこは確保しておく必要があります。
以前このブログでも紹介したColorTesterとかのツールを使えば確認は簡単にできるので、ツールを活用して対応していこうと思います。
アクセシビリティのチェックに。コントラスト比を手軽にチェックできる「ColorTester」

色の違い

色の違いだけで判別させないようにするという事も大切で、色だけではなく他の要素で違いを持たせる事も意識しないといけないなと思います。
フォームとかで使う必須の＊は見落とされがちなので、「必須」という表記にしたり、円グラフの中とかも要素毎に異なる斜線を入れるなど、出来る事からしていこうかなと思いました。
植木さんの話はすごく基本的な部分を押さえつつ、その重要性と理由をきちんと説明されておられて非常に分かりやすかったです。
スライドの途中でプロレスの小ネタを入れてリラックスさせたりとか、聞く人が疲れないような細やかな配りも素敵なセッションでした。

PowerCMS 8341 のご紹介

アルファサード株式会社の野田さんのセッションは自社で開発しているMovableTypeのプラグイン「POWER CMS」の紹介でした。
野田さんの話はすごく特徴があるので聞いてて面白い感じでした。
気になった機能としては、「画像のアップロード時にコントラストの適合チェック」を行うとか、アクセシビリティをチェックやワークフローを自動化する取り組みをしている部分はおもしろいなと思いました。
ソフトウェアからアクセシビリティをサポートしていくというか、誰もが知らない間にきちんと出来ている環境を作るというか、そういう気概のようなものを勝手に感じていました。おっしゃってたわけではないので僕の憶測なんですけど（笑）

デザインから取り組むWebアクセシビリティ

長谷川恭久さんのセッションはデザインという視点からアクセシビリティを考えるというアプローチだったんですが、冒頭に話されていた部分が印象的でした。
アメリカに住んでいたころ通っていたという学校の建物のエピソードであったり、車椅子の友人のエピソードなど、実際の話を通して考え方はどうするといいのかという問題提議があって非常に分かりやすかったです。
やっぱりストーリーに乗せて説明があるとスッと入ってきます。
車椅子の友人の「特別扱いされたくない」という言葉とか、「必要以上の配慮」とかは本当に大切で、ユーザーに優しくするという事と尊重するという事の違いについて改めて考える必要があるなと思って聞いていました。
実務的な部分では、コンテンツを設計する時にシングルカラムで考える事によって「本当にそれは必要なのか？」という部分を突き詰めて考えたり、あえてエクセルやGoogleのSpreadsheetに内容を書き出して全体を俯瞰してみるという視点を持つことだったリは明日からでも使える考え方だなと思います。

まとめ

普段アクセシビリティの事を考えているつもりでしたが、まだまだ脇が甘いというか、ちょっと認識不足な点があって反省しきりです。
アクセシビリティの事はあまり取り上げられる機会も僕の周りではないので、これからも積極的に追いかけていかないといけないなと思いました。
あと、こうやって記事を書く事で「アクセシビリティは特別な事」じゃないという事も伝えていかないといけないなと。
まずは自分のまわりから。
長谷川恭久さんが最後のセッション中におっしゃっていた「今の時代はみんなが独自のユーザー」という部分とかは、本当にそうだと思います。
まず自分に出来る事として、今しているお仕事からアクセシビリティのチェックを行いながらやっていこうと思います。