html5j アクセシビリティ部 第0回勉強会 #html5ja11y

公開

昨日東京にて開催された「html5j アクセシビリティ部 第0回勉強会」に、自称アクセシビリティ部部員としてオンライン参加しました(現在録画が視聴できます)。地方ではアクセシビリティに関する勉強会などはなかなかなく、オンラインでも参加できて情報を得ることが出来たのは大変有意義でした。部長補佐の木達さん配信ありがとうございました。

序盤で配信が途切れたり、僕のマシンがなぜか高負荷となりハングアップしそうになったり(Early 2011のMacBook Proなのですが...)などで全てを聞き取ることが出来なかったのですが、気になったところをメモとして残しておきたいと思います。

矢倉さんのお話(Web標準化動向に関する見識を踏まえたアクセシビリティ論?)

IndieUI

IndieUI: Events 1.0というものを初めて知りました。現在モーダルダイアログを閉じる際は、ダイアログ上のボタンやダイアログ周辺の空白エリア(透過の黒だったりするところ)、またブラウザやデバイスの戻るボタンなど様々なイベントをハンドルしなければならなかったものが、「ダイアログを閉じる」--'dismissrequest'イベントを監視するだけで閉じられるようになるのだとか。IndieUIは「何をしたいか」に対してイベントを定義するようです。これならば、例えばキーボード操作に対して何もハンドルされておらずコンテンツの操作ができないということが無くなり、アクセシブルになるという感じでしょうか?

今後「IndieUI: Events 1.0の最初の草案が公開される | アクセシビリティBlog | ミツエーリンクス」等を読んで勉強してみたいと思います。

CSS Flexible Box

flex アイテムの表示上の順序を変える機能の話も印象に残りました。CSS Flexible Boxは安定していない印象があってあまりチェックしていなかったもので...。

例として次のようなhtml5jサイト内の部活動セクションのマークアップが取り上げられました。

このようなデザインを見た際、僕も矢倉さんが話されていたように「見出し+画像」の順でマークアップし、絶対配置を利用して画像を上に持ってきたりしていたのですが、CSS Flexible Box Layout Moduleのorderプロパティを利用すれば、簡単に表示順を入れ替えることが出来るようです。「文書の構造と視覚表現を今までより分離させやすくなったのかな」と矢倉さんはおっしゃられていました。

プロジェクトにどうWebアクセシビリティを組み込むか(伊原さん)

Webアクセシビリティの勉強会などではWAI-ARIAなどの技術の話が多いので、どういう風にWebアクセシビリティに取り組むかというプロセスの話は大変興味深かったです。目下、実装に関して僕個人で出来ることを可能な限りやっている状況ですが、「方針を立てないと問題が起きがち」ということでドキッとしました。

プロジェクトの中での認識の合わせ方のお話で、UXハニカムから、UXピラミッドへ « IA Spectrumの記事(※2015年6月17日現在、記事の掲載がなくなっているようです。UXについて理解が深まる!ユーザーエクスペリエンス概念図まとめ【更新版】を参考にしてみてください。)でも紹介されているUXハニカム・UXピラミッドが紹介されました。この図は初めて見たのですが、「アクセシビリティ」の重要性がよく分かる資料だと感じました。「アクセスできないのは最悪の状況」「アクセシビリティは品質。必ず満たしておかなければならないもの。」ということを肝に銘じておきたいものです(上手くまとめられなくてすみません)。

html5j アクセシビリティ部今後の活動について

実装例を作っていくハッカソンは私も興味を持ちました。技術や環境は常に進化していくので、アーカイブするとしたら随時アップデートしたりする必要はあるのかなと思いますが...。

私が昨年旧ブログに書いた「今年Webアクセシビリティで実践したり考えたりしたこと」の中で問題提起した地図のアクセシビリティについてや(伊原さんのセッションでも歯医者の話が出ていましたね)、Single Page Application(SPA)ってアクセシブルなのかなとかも気になるので、情報を得たいなと個人的に思ったりもしています。

地方在住なのでなかなか会場参加は出来ないと思いますが、今後もアクセシビリティの活動には積極的に参加していきたいなと思っています。

当日のスライドへのリンク