Webアクセシビリティの学校 【特別授業】に行ってきました。

こんにちは、まおです!6月1日に「Webアクセシビリティの学校 【特別授業】」に行ってきました。CSS Niteが主催する200人規模の大きな勉強会です。リアルタイム字幕と手話通訳もあり、アクセシブルな授業でした。

今回は特に印象に残ったセッションと感想をお届けします。

写真:Webアクセシビリティの学校 【特別授業】会場風景

印象に残ったセッション

『代替テキスト決定ツリー』の使い方

SAWADA STANDARD DESIGNのデザイナー、澤田 望さんのセッションでした。代替テキスト、つまりalt属性の話です。

代替テキストは、正直に言うと今まで直感で書いていました。しかし適切な代替テキストとは…、

画像を処理することができないまたは読み込みが無効である画像に対して、等価なコンテンツを提供する。HTML Living Standard

と書かれています。と、等価なコンテンツ?!

等価なコンテンツと書かれると急に難しく感じませんか?つまり、画像を含むコンテンツが伝えている内容(視覚から得られる情報) = 代替えテキストを含むコンテンツが伝えている内容(聴覚から得られる情報)、でなくてはいけません。
また、本文にあるテキストを2回繰り返すのは望ましくないそうです。(ぎくっ)

ちょっとしたワークショップもあり、国語の授業のようで楽しかったです。同じ画像でもサイトが違えば、代替テキストも変わってきます。代替えテキストの世界はたいへん奥深い!ということがわかりました。

アクセシビリティの基本中の基本の部分でもあるので、デザインチームの勉強会でも共有したいと思います。

サイボウズの組織的な取り組みとビジュアルデザイン

サイボウズのアクセシビリティエキスパート小林 大輔さんとUX/UIデザイナーの樋田 勇也さんのセッションです。

サイボウズのクラウドサービス「kintone」で取り組んでいる事例を元に、チームでの取り組み方とデザイン面でのアクセシビリティのお話しでした。アクセシビリティに対して独自の視点を持っており、真摯に向き合っている姿がひしひしと伝わってきました。

デザインチームは今年度の目標に「アクセシビリティの推進」を掲げているので大変参考になりました。

チーム内での取り組み方法

とにかく議論をすることが大事だなと思いました。議論をすることでガイドライン作成においても当事者意識が生まれます。サイボウズではモブデザイン・モブプログラミングも積極的に行なっているそうです。メリットとしては、「修正コストを低く抑えられる」と「現実的な解決策を議論できる」という点です。修正コストに関しては一度に大量のフィードバックをもらうより楽なので魅力的です。シス開では既にモブプロは実施済みなのでモブデザも是非やってみたいと思います。

デザイン面でのアクセシビリティ

Kintoneが7年ぶりのリニューアルということで指針や改善点の紹介がありました。アプリでは普段私たちが使用しているスマートフォンのUIを参考にしているそうです。そうすることでユーザーにとって新たな操作を覚えてもらう必要がなくならからです。

『普段のデザインとアクセシビリティ対応は地続き「特別な対応」ではない』という言葉も心に残りました。

アトラスでも現在ガイドラインを作成中なのですが、難しく頭を悩ませる部分もあります。ですが「できることから」「最初はシンプルに」というお話を聞いて、肩の力が抜けました。基本項目から無理せず継続していこうと思います。

感想 ~アクセシビリティ大事~

昨年末のCSS Niteに触発されてから、アクセシビリティの勉強や推進を少しずつ行っています。今回のブログで取り上げたのは2つのセッションでしたが、どの回も本当に刺さりました。

改めてアクセシビリティ大事だなぁと認識しました。Web自体がアクセシブルなものであるからこそ、アトラスでも様々な人がWebを通して情報やコミュニケーションをとれるきっかけになれればいいなと思いました。

Webの力は無限大!