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

LINEヤフーのウェブアクセシビリティ

 LINEヤフーのウェブアクセシビリティ

イベント「アクセシビリティの祭典 2024」のセッション「スポンサースペシャルセッション「現在の取り組みと、10年後のアクセシビリティについて」で使用するスライドです。
https://accfes.com/2024/

More Decks by LINEヤフーTech (LY Corporation Tech)

Other Decks in Technology

Transcript

  1. © LY Corporation 2 自己紹介 中野 信 (なかの まこと) •

    プロダクトのUIガイドラインの策定・運用とアクセシビリティの向上に関わっています • デジタル庁 アクセシビリティアナリスト(民間登用 非常勤) • ウェブアクセシビリティ基盤委員会(WAIC) 作業部会1
  2. © LY Corporation © LY Corporation 4 LINEの体制 • プロダクトUI開発本部

    テクノロジーエンハンスメント部 Webアクセシビリティチーム • ウェブアクセシビリティに特化したチーム • サービス統括本部 Product Experience室 Accessibility UX チーム • LINEアプリ(メッセンジャーアプリ)のアクセシビリティに特化したチーム
  3. © LY Corporation © LY Corporation 5 Webアクセシビリティチームの主な取り組み • ガイドライン

    • Accessibility Guidelines • セミナー・イベント • A11y Meetup • 情報共有・情報発信
  4. © LY Corporation © LY Corporation 6 ウェブアクセシビリティ Accessibility Guidelines

    • LINEのプロダクト、サービスのウェブアクセシビリティを確保するための基準 • WCAG 2.1をベースに、誰でも理解しやすい・使いやすい内容とすることを主眼に作成した • 12カテゴリ、67項目 • 項目を「MUST/SHOULD」の2つの優先度に分類した • 対応の程度と内容はサービス・プロダクトで判断する WCAG: Web Accessibility Content Guidelines。W3Cが勧告しているウェブアクセシビリティの国際的なガイドライン
  5. © LY Corporation © LY Corporation 7 スマホアプリのアクセシビリティ(1/2) • WCAGとOSのアクセシビリティガイドラインを元にしたチェックリストを作成した

    • チェックリストは12カテゴリ25項目 • 評価、改善、レポートをプロジェクトで推進している • プロジェクトは年間計画を立てて推進している
  6. © LY Corporation © LY Corporation スマホアプリのアクセシビリティ(2/2) • テスト →

    改修 → 標準化してガイドラインに反映 のサイクルを回している 1. スマホアプリに対してアクセシビリティテストを実施 2. 見つかった課題をUIコンポーネントごとに分類 3. 改善された内容を元に標準化 • テスト状況・改善進捗はダッシュボード形式で可視化 • 4半期ごとに報告している 8
  7. © LY Corporation © LY Corporation 11 Yahoo! JAPANの体制 •

    Yahoo! JAPANのプロダクトUIのガイドライン「UIガイドライン」を 運用するチームの1活動として活動 • ユーザビリティテストを行うときは、 障害当事者のプロジェクト「ノーマライゼーションプロジェクト」と協業
  8. © LY Corporation © LY Corporation 12 行っていること • WCAG

    2.1 適合レベルAAの達成基準から、各プロダクトごとにできる範囲を対応 • スマホアプリはウェブの技術に依存する達成基準を削除して対応 • iOS/Androidそれぞれの技術リファレンスを追加 • プロダクトUIのガイドライン「UIガイドライン」の中で規定 • プロダクト開発時に必ず参照して遵守するドキュメントとして規定 • 抽象的な達成基準の文章を開発者が理解しやすい内容に置き換える • 非テキストコンテンツ → 代替テキストを提供する • 感覚的な特徴 → 『右の写真』『丸いボタン』など位置関係や形に依存した表現をしない
  9. © LY Corporation © LY Corporation 13 実際のウェブアクセシビリティの程度・状況 • プロダクトによって対応度合いに濃淡がある

    • すべての達成基準を満たしている状態ではない • 色の使い方や文字の読みやすさは、主要部分はおおむね対応している • キーボードだけで操作できるようにする対応は未対応のプロダクトが多い
  10. © LY Corporation © LY Corporation 14 アクセシビリティのポリシーの決め方 • WCAGを基準にしている

    • ウェブアクセシビリティ方針を記載するときはJIS X 8341-3:2016に則っている • ウェブ、スマホアプリどちらもWCAGを基準にしている • WCAGのどのバージョンを選ぶかは勧告状況によって判断する • 現在はWCAG 2.1 を基準にしている • 2023年10月に勧告されたWCAG 2.2は、1~2年後に採用を検討する
  11. © LY Corporation © LY Corporation 15 開発フローへの組み込み(1/2) • 開発ガイドラインへの組み込み

    • プロダクトのUIガイドラインに組み込んでいる • 強制度は「原則必須」 • 対応可否はプロダクトリーダーが判断する • 事後パトロール • プロダクトをリリースした後に、ユーザビリティとアクセシビリティをチェック
  12. © LY Corporation © LY Corporation 16 開発フローへの組み込み(2/2) • 当事者によるテスト

    • アクセシビリティの水準を上げる必要のあるアプリは、ガイドラインの対応に加えて 障害当事者によるテストを実施 • 障害当事者の有志プロジェクト「ノーマライゼーションプロジェクト」のメンバーが対応 • 一般的なユーザビリティテストとほぼ同一の方法で実施
  13. © LY Corporation 18 社内ガイドラインの統合 • LINE、Yahoo! JAPANそれぞれに存在するウェブアクセシビリティのガイドラインを統合する • 基準と、基準を満たすための方法を統一する

    • ガイドラインを統合することで、チェック・改善のフローを効率的に行えるようにする Accessibility Guidelines UIガイドライン ウェブアクセシビリティ New Guidelines!
  14. © LY Corporation 23 目指す所 • ウェブアクセシビリティの担保を当たり前の品質にする 物理的な 充足度 顧客の満足感

    性能品質 魅力品質 基本品質 アクセシビリティの祭典 2017「私たち企業がアクセシビリティに取り組む理由」から再掲