CSS Nite LP62「Webアクセシビリティの学校」特別授業 フォローアップ(5)小林 大輔さん、樋田 勇也さん

2019年6月1日に大崎ブライトコアホールで開催したCSS Nite LP62「Webアクセシビリティの学校」特別授業のフォローアップとして、 小林 大輔さん、樋田 勇也さん(サイボウズ)さんの『サイボウズの組織的な取り組みとビジュアルデザイン』セッションのスライドなどを公開します。

フォローアップ

コメント

ご参加頂いたみなさま、本当にありがとうございました。登壇者の小林です。アクセシビリティをいかにチームで取り組んでいくか、私自身も試行錯誤の日々です。
発表した内容がそのまますべての組織に当てはまるとは限らないかもしれません。それでも、理想を大切にするマインドや、みんなを巻き込むプロセスの考え方は、きっと多くの組織で必要になると思います。
参考になることが一つでもあれば嬉しいです。

同じく登壇者の樋田です。当日は多くの方に、都心だけでなく全国からお集まりいただき大変感謝しております。アンケートを全て拝見させていただきました。アクセシビリティが特別な対応ではなく普段のデザインの延長にあることをお伝えたしたのですが、それがちゃんと伝わっていることが感じられてとても嬉しいです。
懇親会でも話題になりましたが、どうかアクセシビリティ 対応は「できる/できない」という考え方をしないでほしいなと思います。ハードルを感じた時は「実はすでに出来ていること」を探してみるのもオススメです。

質問と回答

小林/樋田それぞれにいくつかご質問をいただいているので下記で回答いたします。

ガイドラインはどんな内容ですか?実際に見てみたいです

(小林)現在、kintone チームにはデザインガイドラインと実装ガイドラインがありますが、
例えば実装ガイドラインの場合だと、以下の項目があります。それぞれに数行の説明があるという構成です。今回の「アクセシビリティ確保の基本のキ 10 項目」に近い内容になっています。

  • マークアップ
  • 画像
  • ボタンとリンク
  • 入力フォーム
  • 見出し
  • ホバーとフォーカス

発表でもお伝えしましたが、ガイドラインそのものではなく、ガイドラインをもとにチームを支援したり、議論していくことがとても重要だと感じています。

ガイドラインで困ったことはありますか?

(小林)ガイドラインを作成すること自体はそこまで難しく感じたことはなかったです。
どちらかというと、ガイドラインから外れた実装等が見つかったとき、どんな風に交渉して修正してもらうかが難しかったです。
後から指摘するのは辛い交渉になりがちですし、修正できないことも多いので、できるだけ早いタイミングで一緒に相談しながら実装する、といった対応がおすすめです。

アクセシビリティ検証会にはデザイナーやディレクターは参加しましたか?どう巻き込んだらよいか、コツがあればききたいです。

(小林)サイボウズの場合、週 1 の検証会にはディレクターは参加していませんが、デザイナーは積極的に参加しています。
ディレクターを巻き込めた事例もいくつかあります:

  • 外部の講師の方を招いて、講演をしつつ、ワークショップとして検証会も同時に行う
  • 外部の障害当事者の方を招いて、ユーザビリティテストを行い、観察してもらう

社外の講師や社外の当事者の方が話すと、説得力が強まりますし
普段、勉強会等に参加しないメンバーにも参加してもらえたりしました。

ユーザのことを考えると、時間がかかったりコストがかさんだり・・・な印象があります。決定権のある人との交渉はどのように行なっていますか?

(小林)まずはコストをかけずにできるところからやってみてはどうでしょう。例えば HTML は、ほとんど工数に変化を与えずに、アクセシブルにすることができる場合があります。

コストがかかる場合は難しいですね。サイボウズでも試行錯誤していますし、うまくいかないことも少なからずありますが、例えば、決定権のある人にユーザビリティテストに参加してもらい、その直後に問題をまとめて、優先度の交渉をして、改善したことがあります。問題を体感してもらった直後に交渉をしていくのがいいと思っています。

業務が多くて、なかなかアクセシビリティの話をチームに共有できません。どうしたらよいですか?

(小林)今回紹介した、社内のグループウェアでの共有は、最初の活動として比較的やりやすいと思います。今回の CSSNite の感想や、アクセシビリティのニュースなどを、少しずつ共有してみてはどうでしょう。

輪講形式の勉強会は、最初の 1 回目~ 2 回目くらいは発案者が発表をする必要がありましたが、そのあとは、担当者を決めて持ち回りで発表していくことにしたので、忙しくても継続することができました。

アプリという言葉はアプリケーションをイメージしてややこしいと思ったのですが、そのような意見は出なかったのでしょうか?

(樋田)デスクトップ版、モバイル版に限らず、議論になるところです。今回は kintone において「アプリ」という言葉がすでにプロダクト内外問わず広く使われており、変えてしまうことの方の混乱が大きいだろうということでそのままになっています。

やわらかいデザイン、やさしい感じのデザインなどを求められたとき、コントラスト比の確保が難しいように思うことがあるのですが、難しくないですか、そんなことありませんか。どう対応されてますか。

(樋田)同じ疑問を持っているデザイナーの方も多いと思います。確かに難しいように感じてしまいますよね。
WCAG や JIS のコントラスト基準は「あらゆる要素」に対してコントラスト比をつけるよう求めているわけではないので、やわらかいテイストのデザインの中でもコントラスト比を確保することは可能だと思います(例えばロゴはコントラスト比を確保する必要がないです)
デザインの中で「すべての人に伝えなければいけない情報」が何かを整理した上で、柔らかい雰囲気を出すための要素と、ちゃんと情報を伝えなければいけない要素を分けてみることをオススメします。分けることが難しい場合は、代替の要素を置いてみるなど工夫をしてみてください(ヘッダーイメージ上のテキストはコントラストを確保できないけど、その下のテキストを読むことで理解できるようにする、など)。

2019年、CSS Niteでは49回の関連イベントを通して123セッションが行われました。その中からベスト・セッション+αを選びました。

2010年から2019年のベスト・セッション