はじめに
メリークリスマス✨🤶
この記事では私の所属するチームが取り組んできたアクセシビリティ関連の取り組みについて記載しよう思います。
「アクセシビリティって言葉は知っているけど、よく分からない」という状態から取り組んできたので、当時の私たちのような方の参考になれば幸いです🙌
補足として、最小チームとは、私の所属チームのことを指しており、フロントエンドエンジニアのみで構成される当時7名のチームです。（現在は人数が増えて13名）
ZOZOTOWNの開発組織では、担当する責務ごとに開発1部、2部..という形でラインを分け、そのライン毎にwebフロントエンドチーム、バックエンドチーム、ネイティブアプリチーム等々が存在しています。
詳しくはこちら
年表
やってきたこと
アクセシビリティー研修を視聴・ディスカッション（23年5月〜6月）
freeeさんのアクセシビリティー研修動画（全3本）をそれぞれ視聴し、感想を話し合う場を設けました。
所属チームのアクセシビリティにまつわる初めての取り組みです。これをきっかけにチーム全体でアクセシビリティをやんわりと意識するようになりました🔥
また後述の輪読会の走りとなりました。
参考までに当時のディスカッションで出た感想をいくつか抜粋します↓
- アクセシビリティを高めることは企業理念である「世界中をカッコよく、世界中に笑顔を」に近づくと思った
- 普段のコミュニケーションでも気をつけられることがありそう（slackとかの引用の話など）
- 周りの協力も必要だが、まずは自分たちでできるところから進めていきたい
- 読み上げによってどのような違いが出るか動画で見せてくれたのでイメージしやすかった
チーム横断の活動に参加、アクセシビリティ関連のチケットを処理（23年10月〜24年9月）
所属チームの動きとは別で、他のチームのフロントエンドエンジニア主導で行われていた活動です。
「アクセシビリティタスクアサイン会」という題で開催されており、外部のアクセシビリティに精通したエンジニアに起票していただいた課題（チケット）を解決していく会です。
2週間に一度30分ほどでMTGを開催して、アクセシビリティ改善タスクの報告やアサインをしています。参加者は有志のメンバーで構成されていました。
下記のスライドで語られている内容の続きになります↓
「Webアプリケーションアクセシビリティ」で輪読会を実施（24年5月〜9月）
前述のアクセシビリティー研修を視聴がきっかけとなり、チームのみんなでキャッチアップする習慣が根付いて、最終的には輪読会が開始されました。
輪読会のスタイルとしては、読書は各々が自由なタイミングで行い、週に1度ディスカッションの時間を設けるスタイルで運営しています。ファシリテーターは持ち回りで、その週のファシリ担当者がその週の読書範囲を決め、要約を議事録に記載しておきます。
輪読会のテーマはアクセシビリティに限っておらずその時々ですが、24年5月〜9月にかけては「Webアプリケーションアクセシビリティ」を題材にしていました。
「Webアプリケーションアクセシビリティ」の チェックリストからのタスク出し&実装（24年6月〜10月）
「Webアプリケーションアクセシビリティ」の輪読会から具体的なアウトプットに繋げるための活動として「輪読会からのタスク出し」を実施しました。
この書籍ではアクセシビリティ改善を行うにあたりチェックするべきリストを提供しています。そのチェックリストを用いてZOZOTOWN内の当てはまっている箇所を探し発表し合うMTGを実施しました。
MTG内で上がったものの中から実際にタスクとして改善を実施しても問題ないものをチケット化し、チームメンバーみんなで主業務の合間に進めました。
主には、フロントエンドだけで導入の判断が出来るWAI-ARIA関連のチケットが多かったと思います。
最終的に50近いチケットが起票され、合計で43チケットが実装/本番反映まで実施されています✨
対応したチケットの例です↓
タイトル: 〇〇ページ△△機能, ××のアイコンにアクセシブルネームを付与する
内容: △△機能の××のアイコンがスクリーンリーダーに読まれてなさそうなので情報が不足して分からなそう
対応内容: ××のアイコンにaria-labelを付与する
おわりに
これまでの活動を通じて、本当の意味でアクセシビリティの改善を行うためにはデザイナーとの密な連携が必要不可欠であるとを実感しています。
特に、見た目に関わる部分については、デザイナーがイニシアチブを持っており、フロントエンドエンジニアの判断だけで変更を加えることは難しい場面もあります。これは、安易に変更を加えることで、プロダクト全体のバランスを損ねる可能性があるためです。
デザイナーチームでもアクセシビリティ課題を認識しているものの、プロダクト全体のトーンを見直すとなると、多大な工数を要するケースもあり、思うようには進められていない現状があります。
現在、弊社ではフロントエンドのリプレイスを進めているため、このリプレイス作業と並行しつつ、こまめにデザイナー/エンジニア間で議論し、決定可能な事項については方針を明確化する形で進めています。
こうした取り組みを通じて、可能な範囲からアクセシビリティの改善を継続して進めていきたいと考えています🔥
Discussion