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
コーポレートサイトのアクセシビリティ改善とJIS準拠への実践
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
LINEヤフーTech (LY Corporation Tech)
PRO
May 21, 2026
Technology
160
2
Share
コーポレートサイトのアクセシビリティ改善とJIS準拠への実践
GAAD Japan 2026のライトニングトーク5の発表資料です。
https://www.gaad.jp/timetable/
LINEヤフーTech (LY Corporation Tech)
PRO
May 21, 2026
More Decks by LINEヤフーTech (LY Corporation Tech)
See All by LINEヤフーTech (LY Corporation Tech)
類似画像検索モデルの開発ノウハウ
lycorptech_jp
PRO
5
1.1k
NFLコンペ2026 解法
lycorptech_jp
PRO
0
140
Kaggle未経験社員をメダリストに育てる「AIドラゴン桜」
lycorptech_jp
PRO
0
710
Yahoo!ファイナンス - 投資の「難しい・手間がかかる」を「分かる・簡単にする」-
lycorptech_jp
PRO
0
46
Slack MCPでインシデント対応とFAQ生成を加速する:社内ワークショップの実践
lycorptech_jp
PRO
0
830
SDDで⾒える、AIコーディングの"内訳"
lycorptech_jp
PRO
0
880
コーディングAIが導くリスクベースド探索的テストの実践
lycorptech_jp
PRO
1
860
Orchestration Development Workshopを半期実施して
lycorptech_jp
PRO
0
830
Agent Development Kit (ADK)で学ぶ実践Context Engineeringと社内での応用例
lycorptech_jp
PRO
0
850
Other Decks in Technology
See All in Technology
ルールやカスタム機能、どう使う?理想の出力を引き出すために今知りたいIBM Bob 5つの機能
muehara
1
300
AI駆動開発が変える、大規模開発の前提 ーHuman in the Loop から Human on the Loop へ / AIE2026
visional_engineering_and_design
2
1.8k
関西に縁あるMicrosoft MVPsが語るCopilotの未来
kasada
0
1k
Unlocking the Apps
pimterry
0
170
AIガバナンス実践 - 生成AIコネクタのデータ漏洩リスクと実務対策
knishioka
0
170
先取りMaven4 ~16年ぶりのメジャーアップデート、その進化とは?~
ogiwarat
0
130
チームで実践する AI-DLC 思考の軌跡を残すチェックポイント設計
belongadmin
0
1.9k
コードレビューを制するチームがソフトウェアデリバリーのフローを制す / Beyond Code Review: Distributing Its Responsibilities Across the SDLC
mtx2s
3
820
Claude code Orchestra
ozakiomumkj
3
910
AI フレンドリーなエラー監視を TypeScript で実現する
shinyaigeek
2
240
「速く作る」から「正しく作る」へ ─ 生成AI時代の開発フロー改革の ロードマップと実行 ─
starfish719
0
5.1k
脅威をエンジニアリングの糧にして:恐怖を乗り越えた先にあったもの / Turn threats into fuel for engineering: what lay beyond overcoming fear
nrslib
1
380
Featured
See All Featured
Getting science done with accelerated Python computing platforms
jacobtomlinson
2
220
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.3k
Making the Leap to Tech Lead
cromwellryan
135
9.9k
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
300
Statistics for Hackers
jakevdp
799
230k
Bash Introduction
62gerente
615
210k
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
200
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
We Are The Robots
honzajavorek
0
240
GitHub's CSS Performance
jonrohan
1033
470k
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
520
Transcript
© LY Corporation © LY Corporation コーポレートサイトのアクセシビリティ改善と JIS準拠への実践 GAAD Japan
スポンサーセッション LINEヤフー株式会社 中野 信
© LY Corporation 自己紹介 • 中野 信 (なかの まこと) •
主な業務 • プロダクトのアクセシビリティの向上 • Yahoo! JAPAN UIガイドラインの運用 • デジタル庁 アクセシビリティスペシャリスト (民間専門人材) • ウェブアクセシビリティ基盤委員会 (WAIC) 作業部会1 主査
© LY Corporation コーポレートサイトのアクセシビリティ改善 • 期間:2024年5月〜2025年10月 • ポイント • プレ試験
• コンテンツ改善と実装改善 • 持続可能な運用と方針公開
© LY Corporation 目的 1. 2023年の会社の経営統合時に十分対応できなかった サイトのアクセシビリティを向上する 2. 基準を満たせるまでアクセシビリティを高めて ウェブアクセシビリティ方針を再び公開する
© LY Corporation 作業プロセスとスケジュール 1. 試験対象ページ選定 2. プレ試験 3. 改善内容の精査
4. 実装改善 5. 試験 6. 最終調整 2025/1 2025/10/14 2024/5 1 2 3 4 5 6 公開
© LY Corporation プレ試験を実施 • ウェブアクセシビリティ基盤委員会(WAIC)の 「JIS X 8341-3:2016 試験実施ガイドライン」を参考に選定
• 代表ページとして多めに100ページ以上を選んだ
© LY Corporation プレ試験で見えた課題傾向 1.3.1 1.1.1 2.4.3 その他 • 課題は3つの達成基準に集中
• 1.3.1 情報及び関係性(A) • 1.1.1 非テキストコンテンツ(A) • 2.4.3 フォーカス順序(A) • 上位3つで全体の75%以上
© LY Corporation 主な課題(構造・代替テキスト) 情報構造の課題 • 見出しのないセクション • 見出しレベルのスキップ •
段落を改行で表現 • リストがHTMLで表現されていない 画像の代替テキストの課題 • 設定されていない • 内容が伝わらない代替テキスト • 説明不足のアイコン
© LY Corporation 主な課題(フォーカス・キーボード) キーボードだけで操作できない(しづらい)箇所がいくつかあった • 操作中にフォーカスが外へ抜けるメニュー(モーダルダイアログ) • フォーカスが移動しないページ内リンク •
フォーカスが移動しない「もっと見る」リンク • 操作が複雑かつ冗長なカルーセル
© LY Corporation 改善アプローチ • 毎週改善定例を実施 • 課題・進捗を継続的にレビュー(半年程度) • 企画
/ デザイン / 開発で役割分担して対応 • 個別の修正ではなく、運用可能な改善へ
© LY Corporation 共通UIの改善 カルーセル • 一時停止ボタンを追加 • フォーカス対象を整理 メガメニュー
(グローバルメニュー) • オンフォーカス → オンクリック展開 • 展開中はフォーカスはメニュー内循環
© LY Corporation 既存コンテンツのアクセシビリティ改修 • 既存コンテンツを維持しながら改修 • 「新しいウィンドウアイコン」などの共有UIは、検索・置換・確認で改修 • 作成時期や担当者などで実装差があり、確認と修正の作業が長引いた
© LY Corporation 画像の代替テキストの改善 • 画像を「イラスト」「写真」などにパターン化 • それぞれのパターンごとに代替テキストを付与するルールを作成 • 生成AIで代替テキストを半自動生成するフローを策定
代替テキスト生成用カスタムGPT Dekashibe
© LY Corporation 方針策定と公開 • アクセシビリティ改善を継続させるために方針を整備 • 会社のポリシーと方針策定ガイドラインを元に作成 • 2025年10月14日
ウェブアクセシビリティ方針と検証結果を公開
© LY Corporation 学び • ページ選定を先に行うと関係者間の認識を合わせやすい • 共通UIを優先すると効果が大きい • 既存のコンテンツは改善コストが高い
• マニュアル化すると改善は定着する
© LY Corporation 次の一手 • 他のプロダクトも試験結果を公開できるようアクセシビリティを改善したい • 公開した瞬間からアクセシビリティが低下する状況を減らしたい
© LY Corporation © LY Corporation Thank You 17