みどりのさるのエンジニア

アクセシビリティカンファレンス福岡 参加メモ

2023年11月11日

アクセシビリティカンファレンス福岡 に現地参加してきました。
カンファレンスの発表内容のメモ書きで。

伝わるを拡張するアクセシビリティ

発表者: 間嶋沙知さん

アクセシビリティとは?

  • Access + ability
  • アクセシビリティは0か100ではなく高めるもの
  • 使えるレベルと満たしてから、使える状況の幅を広げる
  • Web Accessibility Perspective Video
    • 色々な状況でのa11yのメリットを紹介したビデオ
  • a11yは障害者のためのものではない
    • 怪我をして一時的に片手を使えない場合などもある
    • すべての人に意味がある
  • 障害のある人は既にニーズを知っているリードユーザーと見ることができる

「伝わる」を阻む壁を知る

  • 5cmの壁があっても車椅子などでは超えるのが困難
  • 壁が取り除かれるとみんなが便利になる
  • なにか壁を作るのか?
    • **「知らなかった」**が壁をつくる
  • デザインをする時は「だれに」「何を」「どうやって」を考えるのが大事
    • アクセシビリティは新しい「知る」を教えてくれる。

ここから始めるアクセシビリティ

  • a11yはコストがかかるんでしょう?
    • 上流から考慮すればコストを抑えれる
    • 後から対応はコストが高い
  • エンジニアが頑張るもの?デザイナーやディレクターができることはある?
    • 企画・設計、デザイン、コンテンツ制作で取り組めることはたくさんある
  • 色覚特性をシミュレーションできるモバイルアプリ
    • 色のシミュレータ
    • 実際にそう見えている色ではないことに注意(あくまでシミュレーション)
  • コントラストが低い問題は世界のサイトの80%で見受けられる
    • WCAGの1.4.11でコンストラスト比のガイドラインが決められている
    • 使いたい色の役割を意識して配色をすると、コンストラストを適切に保てる
  • WCAGを噛み砕いてアクセシビリティガイドラインを作成している国内企業のドキュメントを読むのがおすすめ
    • Freeee, Ameba, Liful, SmartHR
  • コンテンツ制作
    • 見出しをつけよう
    • ノンデザイナーズ、ガイドブック
    • 情報を整理して内容ごとにまとめる
    • 内容を予測できる見出しをつける
  • 代替テキストをつけよう
  • a11yギャラリーはアクセシビリティ対応されたサイトが掲載されている
  • アクセシビリティに取り組むとデザインの視点や伝わる可能性が広がる
    • より良いデザイン
    • これまでのデザインを拡張する
  • 今日からできること
    • SNSの画像に代替テキストに入れてみる
    • 今日のイベントについて周りの人と話してみる
    • 気づいたこと、取り組んだことを発信してみる

ウェブアクセシビリティ社内教育のすゝめ 〜品質か、営業か〜

発表者: 柴田宏仙さん伊原力也さん

テーマについて

  • アクセシビリティに取り組む課題
    • 知見がある人がいない/最適な人材がいない
    • 何から手をつければ良いか分からない
    • リソースが足りない
    • 開発予算がない
    • ビジネス上のインパクトが示しづらい
    • ユーザーからの要望がない

品質について

  • div要素だけでHTMLが作られていたりスクリーンリーダーに対応できていない時に「もやもや」する人で溢れるチームになる
  • クリエイターは人が喜ぶサイトを作りたい
  • ステップ: 伝える => 見せる => やってもらう => 評価する
  • 伝える
    • アクセシビリティやろうよ!と言っても共感は難しい
    • Webのすごさ(誰でも情報にアクセスできること)を伝えることで共感をしてもらう
    • 耳で情報を得ている人でも自分たちのマークアップによって情報の収集をサポートできる
    • 「武器になるHTML」に書いてあるよ
  • 見せる
    • 自分たちのやっていることを他の人に見せる
    • サイトの拘りや競合サイトとの比較を見せる
    • フォント拡大への対応
  • やってもらう
    • 簡単にできることから
    • pxで文字サイズ指定されているモノをremに直したり
  • 評価する
    • やってもらった事に対して「うれしい」と感じれられるFBをする

営業について

  • 手元でひとりでやる => 仕事としてチームでやる
  • ポイント
    • 3人以上でやろう
    • 「やってみた」マインドでやってみる
    • 表に出す(表に出すと中の人が見て、既成事実になる)
  • 社内でやってみる => 社内向けにまとめる => 社外向けになおす => 社外に出す => 中の人がみる
  • ステップ1 学んでみた
    • 会社とアクセシビリティを紐付ける準備をする
    • 勉強会レポートなどを社のブログ等で発信する
  • ステップ2 調べてまとめてみた
    • アクセシビリティを調べて発信する
    • 自治体サイトのa11y対応状況とか
  • ステップ3 自分のところ直してみた
    • 自分の裁量で触れるところを改善してみる
  • ステップ4 仕事で一部やってみた
    • 小さい、しかし意味のある単位で改善する
  • ステップ5 仕事に組み込んでみた
  • ステップ6 仕事でまるっとやってみた
    • 特定の機能をスクリーンリーダーでも使えるようにするとか

まとめ

ウェブにあるだけで圧倒的にアクセシブル

ヌーラボのウェブサイト課におけるアクセシビリティ関連の取組み

発表者: 松永知典さん

ヌーラボのミッション
「"このチームで一緒に仕事できてよかった"を世界中に生み出していく。」

ミッションの作成

  • ワークショップでメンバーの相互理解をうかめてからミッションを作成
    • 人生において大事な価値観を共有
  • ミッション作成で実現したいこと
    • 優先度を決める際の判断規準になる
    • 自分のやっていることに誇りが持てる
    • 困難にぶち当たった時にポジティブになれる
  • 気をつけたこと
    • 会社の方向性や、ウェブサイト課、個人のwillの重なりを意識した
    • ミッションステートメントを一文で作成

フロントエンドエンジニアの求人票を変更

  • フロントエンドエンジニアからマークアップエンジニアに名称に変更
  • 「セマンティックなマークアップを意識してWebサイトの開発に取り組める方」を記載
    • Webアプリの開発を主とした方々からの応募は減少傾向
    • マークアップからアクセシビリティの改善を意識して求職する方の応募が増えた

社内へのアクセシビリティの浸透

  • 社内の全体チャットへの投稿
    • 「こちら」のリンクを止めましょうという話
  • 何が問題なのかハッキリしていて、分かりやすい

LINEヤフーにおけるこれからのアクセシビリティ

発表者: 岡崎晶彦さん・富田梓さん

  • a11yのタスクフォースのスタート
  • 所属部署の年次の取り組みとして「アクセシビリティ」

TFの取り組み

  • 障害当事者へのヒアリング
    • 実際の理解が圧倒的に足りない
    • 社内の視覚障害当事者を対象にしたヒアリング
    • 視覚障害というもののグラデーションや、環境の多様性
  • MeetUP 開催
    • 社内イベント
    • 頻度は2,3ヶ月に一回
    • 当事者インタビュー、プロジェクトでの改善事情、色覚等区政
    • 「アクセシビリティをやっている人間がいること」が見える
  • ガイドラインの作成
    • WCAGはハードルが高い
    • 他社のガイドラインをそのまま利用する?
      • 社内向けにする場合に限界がある
    • 他社のガイドラインを参考に自社用のガイドラインを作成
  • チェックリストと運用方法までドキュメント化

ドキュメントの浸透

  • a11yブートキャンプを実施
  • 完全な対応は諦める
    • ガイドラインを全部読んで理解する
    • 読み合わせのガイドラインの項目を絞る
  • 最初の目標は、チェックを完了するところまでにした
    • 見つかった問題はチケット作成

a11yブートキャンプの実施

  • 全体スケジュール
    • 2023/3~10月で全8回

「違う人生を生きる人と一緒に働く」ということ

株式会社方角の設立の経緯

  • コロナ影響で就職が難しくフリーランスを初めて、そのまま仕事で会社として設立
  • エキマトペを制作
  • 初期デザインへの対応
    • 聴覚障がいの人が見慣れている横組み字幕を組むべき
    • 手話をもっと大きく
    • 情報の上にオノマトペを被せない方が良い
  • 世間の反応
    • 聴覚障がいの人から色々な意見をもらえた
    • 自分たちの言語が手話が大きく表示されていて嬉しい
  • 当事者が身近にいてもっと色々と知りたい
    • 自社で雇用することにした

コミュニケーションの仕方

  • 対面では手話や筆談
  • リモートではテキストコミュニケーションを主としている
  • 聴覚障がい者にも様々
    • 手話を第一言語として日本語に苦手意識がある人とは、手話でコミュニケーション
    • 唇を読み取れる人は口話で会話
    • 盲ろうの人とは、テキストで会話
    • 人によってコミュニケーションの手段を変えている

デジタル庁でのアクセシビリティへの取り組み ―誰一人取り残されない、人にやさしいデジタル化をの実現に向けて―

アーカイブ禁止のためスキップ

今後やりたいと思ったこと

  • 業務で定期的に開催をしてくれているa11y勉強会で、半年・1年で達成したいことを洗い出してマイルストーンを作成
    • インプットが多くなっていると感じるので、プロダクトの改善という形でアウトプットを増やしていきたい
  • 業務でのa11yでの改善をブログなど何かしらの形で発信する
  • デジタル庁のデザインシステムを読む
  • デジタル庁のサイトのマークアップを読んでみる

感想

セッションの感想

アクセシビリティの社内への浸透など各社や各々の取り組みを色々と学べた。共通点として小さな改善を繰り返して共有していく事があり、継続して進めていける体制や仕組みづくりが大事なのかなと感じられ、a11yという話に限らない全てのことにおいて共通で適用される話だなと感じました。

片山さんのセッションでは、自分が想像している以上に障がい者と一緒に働くことの大変さや工夫が知れて、そこについて自分が全く考えたことがなかった事に気づけました。

デジタル庁のセッションでは、改めてデジタル庁がアクセシビリティへの対応として何をしていて、どのように進めているか聞けて非常に楽しかった。具体的な取り組みとして単に達成基準を満たせば良いということでも無いという話もあり、機械的に対応せずにちゃんと自分たちのプロダクトのことを考えていくことが大事。
業務でのデザインシステムのライブラリ開発を進めているのに、困ったときにデジタル庁のデザインシステムも参考にした方が良いな!という事に改めて気づけました。

参加しての感想

コロナの関係もあり数年ぶりにカンファレンスに現地でオフライン参加できたが、会場独特の熱量や雰囲気はオフラインで参加しないと得られないものがあり、改めてオフラインの良さを実感できて非常に楽しかったです!