ゆめみのアクセシビリティの現在地と今後

Transcript

1. ゆめみのアクセシビリティ の現在地と今後 YUMEMI.grow アクセシビリティLT会 2024/07/16
2. 自己紹介 X Infixer(Ryo Katsuse5 X 株式会社ゆめ8 X フロントエンドエンジニW X 放送大学3年 X アウトプッ% X X（Twitter X Cosense(旧scrapbox5 X ブロÅ X GitHub
3. お品書き $ ゆめみについ' $ これまでのゆめみのアクセシビリティの取り組 $ 今後のアクセシビリティ活動について
4. ゆめみについて 国内にとどまらずグローバルに展開するWebサービスに必要な、 サービスデザイン・システム構築・運用・改善など様々な課題解決をサポートしています。
5. ゆめみオープンハンドブック R 詳しくはゆめみオープンハンドブックをご確認 くださいQ R ゆめみの制度やどういう環境なのかを公開して います。 ゆめみオープンハンドブック
6. 結論からいうと まだまだ社内的にも対外的に アクセシビリティやっていきとは言えません
7. これまでのアクセシビリティの取り組み a 時を遡ること4年前...W a Webアクセシビリティ勉強会が行われていG a スクリーンリーダー体験な# a WCAG2.１を読む輪読会が開催された
8. その後ここ最近まで目立ったアクセシビリティ活動は なかったような
9. いやそんなことはない！！！ ` 最近また活発化してきP ` アクセシビリティへの第一歩〜JISを読も2 ` ゆるアクセシビリティ雑談' ` デジタル庁のアクセシビリティガイドライン輪読' ` Webアプリケーションアクセシビリティ輪読' ` あなたの知らないアクセシビリティの世界
10. 「ゆるアクセシビリティ雑談会」を社内開催した話 ゆるアクセシビリティ雑談会
11. デジタル庁のアクセシビリティガイドライン輪読会 デジタル庁『ウェブアクセシビリティ導入ガイドブック』の輪読会を完走しました！
12. 書籍『Webアプリケーションアクセシビリティ』輪読会の完走とその効果 Webアプリケーションアクセシビリティ輪読会
13. あなたの知らないアクセシビリティの世界 g フロントエンドエンジニア、デザイナー、広報、営業、PMを交えてアクセシビリ ティに関して徹底討論す4 g アクセシビリティを伝えたい人とアクセシビリティに興味ある人に別れて議論す4 g エンジニア以外の職種と議論することでとても有意義な議論ができた
14. 話をしたテーマ
15. ここまでみてきて 8 ゆめみは、元々アクセシビリティに興味ある人が何かしら活動していV 8 内部的には各々アクセシビリティをやっていき！をしているようにみえD 8 しかし全体に浸透しているとは言い難A 8 各々で行っていることで情報共有ができていない なので社内的にも対外的にはアクセシビリティを取り組んでいますと言えない。言いたい
16. ゆめみはクライアントワークではあるものの、作って終わりの集団ではない q 作って終わりではなく、そのまま作ったアプリケーションを運用までしてい} q エンジニア、デザイナー、PMなどそれぞれの職位ごとで作るアプリケーションに対して、最高の価値 提供・品質にしたいと思っている（ユーザビリティa q これって世に出してしまうとまずいよねという認識力はあ€ q しかし胸を張ってアクセシビリティ対応しますと、お客様に提案できていない状況になってい€ q アクセシビリティとの向き合い方が分からない
17. 何故できていないのか 6 ゆめみの中で言語化できていな 6 言語化できていないということは当然説明できな 6 言語化できていないということは当然で社内で浸透しな 6 スキル不足（一部の人への偏り 6 平準化できていな 6 ということを伝えていきたい。 「アクセシビリティがすべての土台・基盤であり、ユーザビリティはその基盤の上に成り立つもの だ！」
18. 今後やっていくこと
19. ステップごとに小さく少しずつ始めたい STEP1 浸透・学習 STEP2 行動 STEP3 実践
20. STEP1:浸透・学習 t アクセシビリティを自分ごとに捉えることのできる人を増やしていx t 先人の知恵を借りる t ディーゼロさ8 t SmartHRさ8 t freeeさ8 t トルクさ8 t サイバーエージェントさ8 t 困った！を解決するデザインをタネ本にして浸透活d t 普段の仕事内で取り組めるガイドラインを策3 t Slackに画像を投稿するときのaltの付け( t オンライン会議では字幕をオンにすE t 提案スライドをアクセシビリティにすE t 怪我したときなど一時的に身体の一部が使えなくなったときどうするか
21. STEP2:行動 d ゆめみではユーザビリティに関して気をつけていることや意識しないといけないこと（満足や安心な ど）に関しては浸透している… d でもアクセシビリティ（アクセスのしやすさ）について奥深くまで追求できていな& d アクセスできないことがどういうことなのかを体現してもらg d VoiceOverの体験な d 職位関係なくアクセシビリティに関して行動できるように仕組み d チェック項目の導 d オンボーディングプログラムに組み込む
22. STEP2:行動 H プロジェクトの要件定義書などにアクセシビリティのチェック項目を追加す% H 「アクセシビリティに関する勉強会に参加する」をオンボーディングプログラムに追加する オンボーディングシート
23. STEP3:実践 F 今まではアクセシビリティ対応って何かメリットがあるの？追加で工数掛かるんでしょのような状況 だっu F 提案時にアクセシビリティの開発方針を見積もりとセットで提案できるようにす’ F 各フェーズでのアクセシビリティ対応項目を説明す’ F 要件定義、デザイン、開発、テスト、運用フェーズなどでどのような対応が行われているか説明し ていく。
24. 要件定義フェーズ D プロジェクトにおけるアクセシビリティ基準（例：WCAG 2.1、JISなど）を確認し、具体的な目標を 設定す‰ D 法規制やガイドラインを確認し、要件に反映させ‰ D 関係者全員(ステークホルダーと)にアクセシビリティの重要性を説明し、共通認識を持ってもらう
25. デザインフェーズ c 色のコントラスト、フォントサイズ、ナビゲーションの使いやすさなどを定めたデザインガイドライ ン作成すB c 初期段階のプロトタイプでアクセシビリティのテストを行い、フィードバックを反映させB c スクリーンリーダーやキーボードナビゲーション（フォーカス）など、補助技術に対応したデザイン を設計すB c 要件定義で決めたWCAGの方針に基づく適合レベルの基準に従う u ※エンジニアも可能限りデザインフェーズから入れるとよh
26. 開発フェーズ D 代替テキストの設F D キーボードナビゲーショ@ D フォームの操作` D 正しいHTMLでのコーディン2 D ARIA属性を正しく付与するな D スクリーンリーダーの読み上げ
27. テストフェーズ p axeなどを使用したアクセシビリティチェックを行W p 極力自動化できるものは自動化してい# p CIに組み込T p 障害者によるユーザーテストの実施（可能であれば）
28. 運用フェーズ • エンドユーザーからのフィードバックを受けて対応方針を選定す“ • 障害者が何かしらの理由で、代替機能が用意されておらずアプリケーションが使えないなどがあった 場合に対応す“ • 障害者差別解消法に基づいて対応してい% • 「環境の整備」は努力義務だが必要性は高くなるので、アクセシビリティ向上に向けて改善する セミナー「改正障害者差別解消法とWebアクセシビリティ」の録画を公開
29. 情報発信 ( 引き続き継続的なアウトプットを続けÈ ( 職位に縛られないアウトプットを目指す
30. 課題点 g 熱量冷めずに継続していく方法を考えないといけなQ g 職位ごとにアクセシビリティの認識が違うB g お互い歩み寄る、妥協点をみつける姿勢を根付かせるのが重要B g スキルの平準à “ 思い切って外部で著名なアクセシビリティスペシャリストにご協力いただき取り組んでいきたい！
31. 本当にやっていくの？
32. アクセシビリティタスクフォース結成の宣言をしました！
33. ご清聴ありがとうございました！