Upgrade to Pro — share decks privately, control downloads, hide ads and more …

「アクセシビリティを始めたい!」から1年、あれからどうなったのか。 〜LTバージョン〜

pastak
August 22, 2024
760

「アクセシビリティを始めたい!」から1年、あれからどうなったのか。 〜LTバージョン〜

pastak

August 22, 2024
Tweet

More Decks by pastak

Transcript

  1. ⾃⼰紹介 • Pasta-K ◦ よく呼ばれる呼び⽅: /^ぱすた(けー?)?(くん|さん)*$/ ◦ https://x.com/pastak ◦ https://blog.pastak.net/

    • 株式会社 Helpfeel Gyazoチーム エンジニア ◦ 主にフロントエンドを中⼼に担当 ◦ その他Podcastの企画運営や技術イベントの企画など • 趣味 ◦ サッカー観戦 ▪ J1 京都サンガF.C.のほぼ全試合を現地観戦 ◦ クラフトビール ◦ マンガ
  2. • 2023年6⽉にHelpfeel Tech Hour vol.3 「アクセシビリティを始めたい! 編」(*)を開催 ◦ https://nota.connpass.com/event/284361/ ◦

    CTOや⾃分を含めたエンジニアが登壇して、社内外に向けて「アクセシビリティ向上 に取り組む」ということを発信して⾃分たちにも発破をかけた • CTO akiroomのその時の発表を引⽤します ◦ https://speakerdeck.com/akiroom/2023-6-16-helpfeel-tech-hour-vol3-opening-talk 「アクセシビリティを始めたい」
  3. キーワードはボトムアップと越境 • 関⼼のあるメンバー間の取り組みから広げていく ◦ 正直に⾔うと、僕の個⼈的な熱量みたいなところと世の中の関⼼の盛り上がりのタイミング (「Webアプリケーションアクセシビリティ」の出版)が噛み合ったというのもある ◦ ということで、まずは無理のない範囲から始める • エンジニアに閉じていてはプロダクトをアクセシブルにするには限界があ

    るので、デザイナーやマーケティング、営業などと共にあらゆるアプロー チからのアクセシビリティの向上を⽬指す ◦ SaaSとしてはアプリケーションがアクセシブルでもそのアプリケーションにたどり着くまで のマーケティングなども含めてアクセシブルである必要があると考えている
  4. • アクセシビリティへの向き合い⽅などを導⼊するための資料を⽤意した • 「Webアプリケーションアクセシビリティ」(技術評論社)などの書籍を はじめ、freeeさん(*1)やSmart HRさん(*2)などの各社が公開されてい るアクセシビリティに関する各種リソースなどを参考に社内向けにまと め直したものを3パート+1に分けて作成した • 著者の皆さんや各社の関係者の皆さん、その他これまでアクセシビリ

    ティに関するあらゆる情報をオープンにしてくださっている皆さんに感 謝 アクセシビリティ勉強会 *1: 全てのメンバーにアクセシビリティー研修を実施しはじめました + 研修資料を公開します - freee Developers Hub https://developers.freee.co.jp/entry/a11y-training *2: アクセシビリティ | SmartHR Design System https://smarthr.design/accessibility/
  5. • 各サービスでeslintでは検出されないような改善を⾏うPull Requestを作成 • 元々社内のプロダクトをお互いに普段からドッグフーディングしている関係 上、軽微な変更や改善などのPull Requestは越境して送る⽂化がある • ⽇常的なドッグフーディングからアクセシビリティの改善点について、以前 から気になっていた箇所などを中⼼にPull

    Requestを作成した ◦ <a>と<button>の適切な使い分け ◦ ランドマークロールの改善 ◦ モーダル関連のフォーカスの改善 • ⾃分たちのプロダクトのアクセシビリティが改善される様⼦を実際に⾒ても らって、a11y-jsxと併せて、モチベーションのキッカケに 改善PRの提案
  6. 開発チームによる⾃律的な取り組みの例 「ウェブアクセシビリティ導⼊ガイドブック」を⽤いた「a11yチェック」 • デジタル庁の「ウェブアクセシビリティ導⼊ガイドブック」で提⽰されている項⽬を1項⽬ ずつチーム全員で確認していく活動 • 1項⽬ごとCosenseのページを作成して、定例会までに各⾃で確認したことや問題点、改善 策などを書いていく • 定例会中にページに書かれたコメントを⾒ながら、判明した課題は開発チームのタスクとし

    て扱い、Asanaに起票していく • アクセシビリティの改善だけに時間を割くことは難しいですが、1項⽬ずつ確認していくこ とでメンバー各⾃がチェックすることができていた • 現在では同ガイドブックで上がっている項⽬についてはほぼ⼀通り確認することができてい る ◦ 修正の実施などが完遂しているわけではありません https://corp.helpfeel.com/post/adventcalendar2023-day12