2013年12月14日、ベルサール神田 イベントホール（2F）で開催したCSS Nite LP, Disk 31: Webデザイン行く年来る年（Shift7）のフォローアップとして、植木 真（インフォアクシア）さん、山本 和泉（#fc0）さん、中根 雅文（慶應義塾大学）さんの『AccSellポッドキャスト公開録音「izuizuのアクセシビリティ（生）100本ノック！」』セッションのスライドなどをシェアします。
「アクセシビリティ」のセッションに登壇した三人それぞれから、メッセージをお届けします。
植木 真
100本ノックではコーチ役の植木です。昨年は、アクセシビリティは「あたりまえ」というメッセージが中心でした。そして、今年はカルーセルを題材にやや実装寄りの内容でお届けした公開録音でしたが、いかがでしたか？
そもそも、カルーセルには賛否両論がありますし、ユーザビリティテストの結果の多くはその効果に疑問符を投げかけています。しかし、使わざるをえないケースというのも、現実的にはあるでしょう。アンケートでも「ファッション業界のサイトでは、カルーセルが不可欠です」というようなコメントをいただきました。
カルーセルといっても、さまざまなタイプ/パターンがありますよね。ですから、もしカルーセルを採用する際には、いろいろなユーザーの利用環境を想定して、一つ一つの機能をどのように実装するのがよいかを検討することが重要です。公開録音の中では、そのヒントをいくつか提示させていただきました。
もし今後カルーセルを実装する機会があれば、是非より多くのユーザーが利用できるように工夫してみてください。あ、AccSellにお便りいただければ、皆さんの作ったカルーセルを100本ノックで取り上げさせていただきます。もしカルーセル以外でも、こういう場合にアクセシビリティを確保するにはどうしたらいいんだろう？と思うコンテンツがあれば、ぜひお気軽に！ 皆さんからのネタをizuizuが首を長くして待っているはずです。
さて、最後にお話したように、2020年の東京オリンピック＆パラリンピックの開催が決まりました。そして、障害者差別解消法という法律も2016年4月からの施行が決まりました。より多くの人が、より多くの場面で、より多くの利用環境からアクセスできるかどうか、日本のウェブの品質が問われるようになる気がします。アクセシビリティがもっと「あたりまえ」になるように、来年も皆さんと一緒に考えていけたらと思っています。
中根 雅文
今回の企画の過程から、なぜかいきなり監督にされてしまった中根です。アクセシビリティのセッション、お楽しみいただけたでしょうか。
アクセシビリティというと、障碍者のためのものという印象を持っておられる方が多いと思いますし、実際、一番大きな恩恵を受けるのも障碍者だと思います。が、本来は障碍の有無だけでなく、様々な環境で様々なブラウザを使うあらゆる人にとって正しく情報を伝えるための考え方です。
30分という限られた時間のセッションでは、既にこの分野に取り組んでおられる方にとっては物足らない、そしてあまりなじみのない方には理解しづらい内容になってしまったのではないかと思います。このセッションを、アクセシビリティについて改めて考える、あるいは新たに興味を持つきっかけにしていただけたのであれば嬉しいのですが。
興味を持っていただけた方は、ぜひAccSellのサイトを覗いてみてください。
さて、アンケートの中で、動的なページやモーダル・ウィンドウに関する注意点などを知りたいというものがありました。ケース・バイ・ケースなので一概にこうである、ということは言えないのですが、簡単に一般論を記しておきますので参考にしてください。
- ご質問：Javascriptで動的にDOMを生成するようなものやGmailのようなWebアプリケーションってどうなんですか？モーダルウィンドウなども。使う際の注意点なども知りたいです。
- セッションの中でもお話ししましたが、スクリーンリーダーで読み上げる場合、基本的にHTMLのソースやDOMツリーの中での出現順序に従って読み上げられます。ですから、例えばあるボタンをクリックした後に何らかの動的な変化が発生する場合、その変化が発生する場所とボタンの場所のDOMツリー的な位置関係が重要になってきます。もしこれらが離れすぎていると、変化したことにユーザーが気づかない可能性があります。では近ければ良いかというと、おそらくそれだけでは不十分で、多くの場合はクリックしたボタンの直後でないと気づかれない可能性が高いでしょう。
モーダル・ウィンドウの場合も、同様に気づかれない可能性について考える必要があります。この場合はさらに深刻で、気づかれなければモーダル・ウィンドウ内でアクションを起こすこともできないわけで、他のことが一切できなくなってしまうことになります。
こういった動的なコンテンツをよりアクセシブルにするための仕組みとして、WAI-ARIAという仕様が検討されていて、これを実装するスクリーンリーダーも増えてきています。今後、こういったスクリーンリーダーが増えれば、動的でアクセシブルなコンテンツを今よりも容易に実現できるようになることが期待できます。
こういった話題についても、折に触れて最新動向をAccSellのサイト上やポッドキャストの中でお届けしていきますので、ぜひ活用してください。
山本 和泉
100本ノックを受けたizuizuこと山本和泉です。去年に引き続き、公開録音でしたがいかがでしょうか？
アンケートを拝見して「カルーセルを採用しているサイトをよく見かけるから使ってもOKなのかと思っていた」「疑問に思ってなかったけど、やっぱりそうだったのか」というようなコメントをいくつかいただきました。ありがとうございます。
私もカルーセルに限らず、また、アクセシビリティに限らず「最近よく見かけるから使うほうがいいのかな」と思うことがあります。そう思ったときって、意識が制作側になっていて「ユーザー側になっていない」ときがほとんどで、いい結果をなかなか出せない場合も少なくありません。
なにかと新しい技術やトレンドに目がいってしまいがちですが、そのときに「伝えたい情報を視覚だけに頼っていないか」などを一呼吸おいて考えなおさないとだな思います。今回は私自身も改めて確認させられたテーマでした。
みなさんも中根監督と植木コーチの指導を一緒に受けて見ませんか？ セッション中にもお伝えしましたが「たとえばこれはアクセシビリティどうなの？」というテーマをお待ちしています！
ポッドキャストとイベントのお知らせ
当日の録音とそれを振り返るポッドキャストを公開しました。無料でお楽しみいただけますので、ぜひ聴いてみてください。
そして、公開録音の最後に告知させていただいたイベント「AccSell Meetup #004」のFacebookページを用意しました。正式なお申し込み開始時には、こちらでアナウンスさせていただきますので、ご興味のある方はまず「参加予定」で仮エントリーをお願いします！ iOSのVoiceOverを使ったコンテンツのチェック方法やアクセシブルなコンテンツ制作の基本などを分かりやすくレクチャーします。
CSS Nite Shift7［3］ AccSellポッドキャスト公開録音 from CSS Nite on Vimeo.
ベストセッション2019
2019年、CSS Niteでは49回の関連イベントを通して123セッションが行われました。その中からベスト・セッション＋αを選びました。
