Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
LY Accessibility Guidelines @fukuoka_a11yconf_前夜祭
Search
LINEヤフーTech (LY Corporation Tech)
PRO
November 29, 2024
Technology
2k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
LY Accessibility Guidelines @fukuoka_a11yconf_前夜祭
2024年11月29日に行われたアクセシビリティカンファレンス福岡 前夜祭で使用した資料です。
LINEヤフーTech (LY Corporation Tech)
PRO
November 29, 2024
More Decks by LINEヤフーTech (LY Corporation Tech)
See All by LINEヤフーTech (LY Corporation Tech)
Scaling Beyond the Exabyte: Lessons from Hadoop Integration and Operations at LY Corporation
lycorptech_jp
PRO
0
120
多層防御と最⼩権限で実現する、安全なAIエージェント設計パターン
lycorptech_jp
PRO
1
360
PM領域でのAI Agentの活用
lycorptech_jp
PRO
0
350
AI駆動開発を組織で促すために
lycorptech_jp
PRO
7
10k
検索技術知識0のエンジニアが広告検索システムを内製化して運用するまで
lycorptech_jp
PRO
1
450
No More Log Digging 〜AIを一次調査係にする アラートレビュー改善〜
lycorptech_jp
PRO
0
290
実践!既存 Project への AI-Driven Development 適用〜一ヶ月で Project 唯一のフロントエンドエンジニアを作り出せ〜
lycorptech_jp
PRO
1
550
AIが実装を自走する時代の認知負債との戦い
lycorptech_jp
PRO
3
1.3k
AIと1000本ノックしてたどり着いた、最速のプロダクト開発 ~toC向けAIエージェントUXを、動く選択肢とAIキャパシティで設計する~
lycorptech_jp
PRO
1
290
Other Decks in Technology
See All in Technology
AWS Continuum for Penetration Testing に Deep Dive してみる
asanoharuki
0
190
Optunaの最新リリースv5.0について
pfn
PRO
0
140
AI時代のGraphQL
joere
3
360
AI駆動で「他アプリの音を加工できる」アプリを作った
satomasahiro2005
0
190
Gemini Intelligence 入門 ― AppFunctions と Gemini Nano
takuroabe
0
350
契約で守るコンパウンドプロダクトのデザインシステム
yug1224
1
190
古い指輪から広がった JAVA コミュニティ とのつながり
yamad
0
140
日本語に強いオープンな大規模言語モデル「LLM-jp」
odashi
5
1.2k
コンテナ運用におけるネットワーク・コンテナコストの削減方法/How to Reduce Network and Container Costs in Container Operations
masakiokuda
2
390
Browser Spec: Testing Hotwire with Ruby
takahashim
1
160
freeeにおけるSoftware Factory
freee
PRO
0
340
Turning Repos into the Product Second Brain with an LLM Wiki
linedevth
0
140
Featured
See All Featured
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
203
77k
Imperfection Machines: The Place of Print at Facebook
scottboms
270
14k
Visualization
eitanlees
153
17k
Side Projects
sachag
456
43k
<Decoding/> the Language of Devs - We Love SEO 2024
nikkihalliwell
1
360
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
3
1.4k
SEO for Brand Visibility & Recognition
aleyda
0
4.8k
For a Future-Friendly Web
brad_frost
184
10k
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.8k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
33
5.3k
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
1
640
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
530
Transcript
© LY Corporation © LY Corporation 中野 信 プロダクト開発本部 LY
Accessibility Guidelines
© LY Corporation 2 中野 信 (なかの まこと) • プロダクトのアクセシビリティの向上とUIガイドラインの策定・運⽤に関わっています
• デジタル庁 アクセシビリティアナリスト (⺠間登⽤ ⾮常勤) • ウェブアクセシビリティ基盤委員会 (WAIC) 作業部会1 主査 ⾃⼰紹介
© LY Corporation 3 • ガイドラインの話をします • 今回話す内容は、明⽇出展するブースのボード・配布物と連動しています • 中野もブースにいますので、ぜひ⽴ち寄ってください!
今⽇のお話
© LY Corporation 4 • 2023年10⽉に、LINEとヤフーがひとつの会社になりました • それに伴い、それぞれの組織にあったものも整理や統合をすることになりました 今⽇のお話
© LY Corporation 5 組織統合前のガイドライン
© LY Corporation 6 • ウェブとスマホアプリのアクセシビリティを確保するための基準 • ウェブはWCAG (Web Content
Accessibility Guidelines) 2.0 Aと⼀部のAAの達成基準 • スマホアプリは加えてWCAG 2.1の⼀部の達成基準を使⽤ • 達成基準の⽂章をプロダクト開発者が解釈しやすい表現に編集 • 対応範囲と程度は各プロダクトで判断 • ガイドラインからチェックリストを作成して定期的なチェックを実施 Yahoo! JAPAN Accessibility Guidelines
© LY Corporation 7 • ウェブアクセシビリティを確保するための基準 • WCAG 2.1をベースに、誰でも理解しやすい・使いやすい内容とすることを主眼に置いて作成 •
freeeのアクセシビリティガイドラインなども参考にした • 項⽬をMUSTとSHOULDの優先度に分類 • 対応範囲と程度は各プロダクトで判断 LINE Accessibility Guidelines
© LY Corporation 8 LY Accessibility Guidelines
© LY Corporation 9 • Yahoo! JAPAN Accessibility GuidelinesとLINE Accessibility
Guidelinesを 1つの⽂書体系に整理したガイドライン • 両⽅の特徴を活かしてほぼすべての⽂章を利⽤ • 項⽬ごとに「重⼤」「修正コスト:⾼」「修正コスト:低」というラベルを設けることで、 部分的・段階的な対応が可能 LY Accessibility Guidelinesとは
© LY Corporation 10 サポート⽂書 • LINE Accessibility Guidelinesを元に構成 •
ガイドラインの具体的な設計⽅法や実装⽅法を記載 LINE Accessibility Guidelines ガイドライン • Yahoo! JAPAN UI Guidelinesを元に構成 • WCAG 2.1のAとAAの達成基準をプロダクト開発 者が解釈しやすい表現に編集 Yahoo! JAPAN Accessibility Guidelines LY Accessibility Guidelines LY Accessibility Guidelinesの構成
© LY Corporation 11 • ガイドラインを1本化することで、開発時の参照箇所を減らすため • 似たガイドラインを参照することによる認識のズレをなくす • LINE、Yahoo!
JAPANにおけるガイドラインのどちらもWCAGを参考元にしていたため • 「UIデザイン寄り」「実装寄り」と、ガイドラインの形態は違ったが根幹は⼀緒だった なぜガイドラインを統合したのか?
© LY Corporation 12 なぜWCAGをベースにしたのか? • WCAGの関連ドキュメントとチェックツールを使えるため • WCAGには「解説書」「達成⽅法集」など、セットになっている⽂書がある •
加えて「代替テキストの書き⽅」「実装パターン集」「ウェブ以外の媒体への適⽤ガイダン ス」など多様な⽂書がある • Lighthouseの「ユーザー補助」など国内・国外の多くの⾃動チェックツールを使える • ウェブアクセシビリティの国内規格 JIS X 8341-3:2016への準拠を表明しやすいため • 社外のアクセシビリティの程度を⽰す時に使われる規格の適⽤を簡単にできる
© LY Corporation 13 ガイドラインの強制度 • 内規相当の⽂書である • 遵守義務がある •
LY Accessibility Guidelinesは、確認項⽬が多く⼯数がかかることが想定されるため 「対応の保留」という猶予条件をつけている
© LY Corporation 14 LY Accessibility Guidelines の特徴
© LY Corporation 15 • 視覚(⾒えない、⾒えづらい)、聴覚、上肢、知的、精神など、様々な障害の状態を網羅している • → WCAGの特徴と同じである •
アクセシビリティの検証や向上で難しいことの⼀つに「ユーザーによるテスト」があるが、ガイド ラインを使うことで多くを補える 障害、障害の状況の網羅性が⾼い
© LY Corporation 16 職域を横断した項⽬で構成されている • WCAGは「ウェブコンテンツのアクセシビリティガイドライン」である • 実装⽅法、UIデザイン、情報(コンテンツ)などを網羅的にチェックできる •
実装⽅法: 要素のマークアップ、WAI-ARIAを使って⽀援技術に情報を伝える⽅法 など • UIデザイン: 情報設計、⽂字や記号のコントラスト、⾊の使った情報区分 など • コンテンツ: キャプション(字幕)の作成、 など
© LY Corporation 17 客観的な評価ができる • ガイドラインの内容は項⽬ごとに評価できるような構成と内容になっている • ⼈が⽬視で確認する項⽬が多いため、評価が分かれる場合があるが、サポート⽂書で設計⽅法や実 装⽅法を提⽰することで、ブレを⽣じにくくしている
© LY Corporation 18 今後の予定と展望
© LY Corporation 19 • ガイドラインの社内浸透のための説明会の実施 • チェック⽅法の実演 • チェックリストの作成と展開
• 勉強会の実施 今後の予定
© LY Corporation 20 • アクセシビリティの検証と改善を⾏うプロダクトを増やす • ガイドラインを満たしたプロダクトをひとつでも多く増やす • ガイドラインの対応⽅法、実装⽅法などのサポートはチームで対応する
今後の展望
© LY Corporation © LY Corporation 21