Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
アクセシビリティの効果測定
Search
Rikiya Ihara / magi
March 08, 2023
Design
1
8.7k
アクセシビリティの効果測定
Rikiya Ihara / magi
March 08, 2023
Tweet
Share
More Decks by Rikiya Ihara / magi
See All by Rikiya Ihara / magi
CMS管理画面のアクセシビリティ
magi1125
6
1.8k
AIで加速するアクセシビリティのこれから
magi1125
3
530
アクセシビリティの社内浸透
magi1125
0
34
信念を持つ方法
magi1125
0
22
スマホのアクセシビリティ機能お試し大会
magi1125
0
27
『モバイルアプリアクセシビリティ入門』入門
magi1125
0
11
最速[要出典]アクセシビリティチェック
magi1125
3
310
デザインプリンシプルのつくりかた(freee技術の日)
magi1125
14
9.9k
Webアプリケーションアクセシビリティ解説ウェビナー「8章 アクセシブルなUI設計の原理を導く」
magi1125
1
8.4k
Other Decks in Design
See All in Design
デザイナーとPMの両ロール_3つのポイント
toy1618
1
320
Fem tips om ux-text • WSA-dagen 29 jan 2025
jonas_blind_hen
PRO
0
180
Saudade typeface
tiagoporto
0
320
児童相談所における養育里親委託時の親権者同意に向けたコミュニケーションの実態
trivia
0
460
1920*1080pxに設定したケース / Google Slide Size Test
arthur1
0
2.8k
業務効率化だけじゃ物足りない AIと一緒にプロトタイプ開発
shingo2000
1
1.5k
Flow, Not Stock 知識触媒としてのIA
5kaichi
1
290
【Firefly Image 4対応版】上手にFireflyにお願いしてウェブデザイン案を出すぞ!
cremacrema
0
1.3k
ビジネスアナリシスはビジネス”分析”じゃないよ!~システム人材が価値を生むための基盤スキルとしてのビジネスアナリシス~
bpstudy
0
510
“使いやすい”が生産性を変える!業務を効率化するためのUX/UI設計ポイント
ncdc
2
390
NAHO SHIMONO_Portfolio2025
nahohphp
0
840
AIの実践とコミュニケーションデザインの意義 / AI practice and the significance of communication design
bebe
0
600
Featured
See All Featured
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.8k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Code Reviewing Like a Champion
maltzj
524
40k
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.6k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
670
Designing for Performance
lara
609
69k
Making the Leap to Tech Lead
cromwellryan
134
9.3k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
20
1.3k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
Statistics for Hackers
jakevdp
799
220k
How to train your dragon (web standard)
notwaldorf
93
6.1k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
2.9k
Transcript
アクセシビリティの効果測定 〜測りにくそうなものを測る〜 2023/03/08 伊原 力也 @magi1125
伊原 力也(@magi1125) • freee株式会社 デザインマネージャー • Ubie、STUDIO、CULUMU、東京都新型コロナ対策サイト等の アクセシビリティ改善支援 • HCD-Net
評議委員、ウェブアクセシビリティ基盤委員会 委員 • アクセシビリティ関連書籍の執筆・監訳 2
サービス提供会社でのアクセシビリティ改善とは 現状把握 する 学ぶ・体験す る 対応箇所 検討する 改善する ユーザー 評価する
世間に 周知する ユーザーの 声を集める 把握・改善 ループ 啓発・広報 ループ
4 https://webapp-a11y.com
第7章 アクセシビリティの組織導入 • 7.1 本章の読み方・使い方 • 7.2 情報を共有して仲間を探す • 7.3
社内コミュニティを立ち上げる • 7.4 自身の考えを社内で発信する • 7.5 小規模な改善にトライする • 7.6 周りがチェックと改善をできるように支援する • 7.7 アクセシビリティを必要とする人に会う • 7.8 アクセシビリティの社内オーナーになる
7章の続編:本日の内容のベース 第5回 アクセシビリティを7つの視点で効果測定し、実績を証明する 6
今日の話について 話すこと • Webサービス提供会社でのアクセシビリティ効果測定の考え方 • 転じて、一見測定しにくいものを可視化する際の考え方 (例:ユーザビリティ、ブランドイメージ…) 話さないこと • アクセシビリティ改善活動の始め方、進め方
• 測定するための環境・状況の作り方 (目標設定、社内承認を得る、予算を立てる、時間を捻出する…)
アクセシビリティの効果測定とは
アクセシビリティの効果測定とは? • 「サービスを利用可能な状況が増えていること」 • でも、それって測定できるの? 9
良い影響が出てそうな、わかりやすい事例 • アクセシブルになると検索トラフィックが増える(可能性がある) ◦ 【これは注目】アクセシビリティ改善でトラフィック12%増!? 検索流入1.5倍の例も 【SEO情報まとめ】 ▪ ※アクセシビリティオーバーレイの未導入/導入の 差分の調査である点に注意
• アクセシブルになるとクリック率が改善する ◦ 広告モジュールの導線テキストのテキストサイズと カラーコントラストの改善と検証を行い、 その結果CTR、CPMともに+10%の改善 10
Does web accessibility have a positive impact on SEO?
2019年、サイバーエージェントのアクセシビリティを振り返る | CyberAgent Developers Blog
直接測れるケースは限定的 • ログイン後は検索トラフィックの話ではなくなる • アクセシビリティ「だけ」を改善する案件は少ない • Webでは支援技術ユーザーのカウントはできない ◦ How Many
People With Disabilities Use My Website? • モバイルアプリならカウントできるけどオススメしない ◦ いま少ない→優先度低と誤解 & 別バージョン提供の罠 ◦ Accessibility — Separate but Equal is Never OK | by Sheri Byrne-Haber, CPACC 13
どうすれば測定できるのか
直接測らなければ測れるのでは • 「アクセシブルにして良いことがあった!」を局所で測るのは難しい • しかし、取り組む中での「状況の変化」なら測れる • アクセシビリティは品質。品質といえば… 15
16 設計品質と利用品質(後編)
17 設計品質と利用品質(前編)
18 設計品質と利用品質(前編)
サービス提供会社でのアクセシビリティ改善とは 現状把握 する 学ぶ・体験す る 対応箇所 検討する 改善する ユーザー 評価する
世間に 周知する ユーザーの 声を集める 把握・改善 ループ 啓発・広報 ループ
20 ユーザーの 声を集める 設計品質 利用品質 ユーザー 評価する 世間に 周知する 学ぶ・体験す
る 現状把握 する 改善する 対応箇所 検討する
21 課題の数や 割合 社内の理解 度や取り組 み開始状況 改善活動の 度合い ユーザーに よる評価
会社のス テークホル ダーの反応 プロダクトへ の顕在的な ニーズ 設計品質 利用品質 1 2 3 4 5 6
測定の6つの視点
1. 社内の理解度や 取り組み開始状況を測定する 設計品質
アクセシビリティ研修の実施率 24 全てのメンバーにアクセシビリティー研修を実施しはじめました + 研修資料を公開します 第6回 アクセシビリティを必須スキルとし、採用・研修・スキルアップをする | gihyo.jp
アクセシビリティチャンネルの参加人数や活性度 25 Slack アナリティクスダッシュボードを閲覧する
アクセシビリティに関わるメンバーの理解度 26 note アクセシビリティ勉強会 〜画像編〜
手動アクセシビリティチェックの実施率 27 第3回 アクセシビリティを新規開発の「当たり前」に組み込む | gihyo.jp
2. アクセシビリティの 課題の数や割合を測定する 設計品質
手動アクセシビリティチェックによる課題発生率 29 第5回 アクセシビリティを7つの視点で効果測定し、実績を証明する | gihyo.jp
自動チェックによる課題発生率やスコア付け 30 Mabl
3. 改善活動の度合いを測定する 設計品質
QAにおける指標 • アクセシビリティ関連IssueやPull Requestの起票数・完了数 • アクセシビリティの課題解決にかかる期間の平均時間 • リリース前にアクセシビリティissueを改善できた割合 32 第4回
アクセシビリティをQA(品質保証活動)につなげる。チケットの扱いを決める | gihyo.jp
デザインシステムのコンポーネント適用率 33 SmartHR UI Storybook
34 課題の数や 割合 社内の理解 度や取り組 み開始状況 改善活動の 度合い ユーザーに よる評価
会社のス テークホル ダーの反応 プロダクトへ の顕在的な ニーズ 設計品質 利用品質 1 2 3 4 5 6
4. 会社のステークホルダーの 反応を測定する 「設計品質→利用品質」のための伝達
アクセシビリティに関する広報発信への反応 36 第2回 アクセシビリティを広報・プレスリリースによって社外へつなげる | gihyo.jp
アクセシビリティに関する技術的な発信への反応 37 2022年、freeeのアクセシビリティを振り返る freee 技術の日
38 課題の数や 割合 社内の理解 度や取り組 み開始状況 改善活動の 度合い ユーザーに よる評価
会社のス テークホル ダーの反応 プロダクトへ の顕在的な ニーズ 設計品質 利用品質 1 2 3 4 5 6
5. プロダクトへの 顕在的なニーズを測定する 利用品質
プロダクトアップデート情報への反応数 40 製品アクセシビリティ情報 | サイボウズ
サービス内で障害や利用状況に言及するユーザー数 41 note
アンケートでの障害当事者の回答数 42
アクセシビリティ関連の問い合わせの件数 43 サイボウズ製品のアクセシビリティ改善に協力
商談や導入時のアクセシビリティへの言及数 44 2019年、freeeのアクセシビリティを振り返る
インタビュー・UT時のアクセシビリティ言及の数 ※UT=ユーザビリティテスト 言及の例: • 文字の大きさや読みやすさ • スマートフォン利用時の画面の見やすさ、色の見分けやすさ • 画面が暗く感じるか・まぶしく感じるか
• エラーを起こして修正する際の手順 • キーボードで操作するときの経験 45
6. ユーザーによる評価結果を測定する 利用品質
支援技術ユーザーのUTによる問題の発生数 47 #15 【字幕あり】「ユーザーと一緒に進めるアクセシビリティ 〜1年でアクセシビリティを組織に浸透させた noteの取り組み〜」仙田 真郷(note株式会社)
まとめ
49 課題の数や 割合 社内の理解 度や取り組 み開始状況 改善活動の 度合い ユーザーに よる評価
会社のス テークホル ダーの反応 プロダクトへ の顕在的な ニーズ 設計品質 利用品質 1 2 3 4 5 6
7章の続編:本日の内容のベース 第5回 アクセシビリティを7つの視点で効果測定し、実績を証明する 50
51 https://webapp-a11y.com
ご清聴ありがとうございました @magi1125
デザイナー、複数ポジションで大募集中です! freee 採用情報 53
None