Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
アクセシビリティ in 令和
Search
defunty
December 04, 2019
Programming
0
30
アクセシビリティ in 令和
2019/12/4に開催した社内向けLT会資料を社外向けに編集したものです。
defunty
December 04, 2019
Tweet
Share
More Decks by defunty
See All by defunty
プライベートコンテンツのHLS配信 with CloudFront
defunty
0
320
SPAでの認証方法に関するマサカリぶん投げ会場はこちらです
defunty
0
950
CSS Module・CSS in JS抗争の過去と現在
defunty
1
180
Other Decks in Programming
See All in Programming
Pythonではじめるオープンデータ分析〜書籍の紹介と書籍で紹介しきれなかった事例の紹介〜
welliving
3
600
公共交通オープンデータ × モバイルUX 複雑な運行情報を 『直感』に変換する技術
tinykitten
PRO
0
160
著者と進める!『AIと個人開発したくなったらまずCursorで要件定義だ!』
yasunacoffee
0
160
「コードは上から下へ読むのが一番」と思った時に、思い出してほしい話
panda728
PRO
39
26k
Cap'n Webについて
yusukebe
0
150
ローカルLLMを⽤いてコード補完を⾏う VSCode拡張機能を作ってみた
nearme_tech
PRO
0
170
AI前提で考えるiOSアプリのモダナイズ設計
yuukiw00w
0
190
Go コードベースの構成と AI コンテキスト定義
andpad
0
140
Kotlin Multiplatform Meetup - Compose Multiplatform 외부 의존성 아키텍처 설계부터 운영까지
wisemuji
0
130
フルサイクルエンジニアリングをAI Agentで全自動化したい 〜構想と現在地〜
kamina_zzz
0
290
tparseでgo testの出力を見やすくする
utgwkk
2
280
Canon EOS R50 V と R5 Mark II 購入でみえてきた最近のデジイチ VR180 事情、そして VR180 静止画に活路を見出すまで
karad
0
140
Featured
See All Featured
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
65
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
190
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
1
29
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
1
260
<Decoding/> the Language of Devs - We Love SEO 2024
nikkihalliwell
0
100
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
74
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
100
The #1 spot is gone: here's how to win anyway
tamaranovitovic
1
870
Building Flexible Design Systems
yeseniaperezcruz
330
39k
Transcript
アクセシビリティ in 令和
アクセシビリティについてどう思ってますか? 『アクセシビリティとか聞いたことないんだけど?』 『知ってる、古代のSEO対策でしょ(笑)』 『うちのサービスはターゲットが違うから必要ない』
Webアクセシビリティとは?(1) W3Cの創始者 ティム・バーナーズ=リー氏いわく...... The power of the Web is in
its universality. Access by everyone regardless of disability is an essential aspect. Tim Berners-Lee, W3C Director and inventor of the World Wide Web Webのパワーは、その普遍性にある。障害の有無に関係なく、誰もが使えることが、そ の本質である。
Webアクセシビリティとは?(2) W3CはHTMLをセマンティックに書くことを推奨している。 セマンティックに書くことで、Botがコンテンツの内容を正しく認識し、検索エンジンの検索 結果に反映される。 HTMLがセマンティックに書かれていなければ、スクリーンリーダー(読み上げブラウザ) での利用が困難になる。
Webアクセシビリティとは?(3) 例えば...... buttonの代わりにdivタグを利用した場合、プログラムにはそのdivタグが「押せる」という ことを認識できない どうすれば良い? Web標準で(セマンティックに)書けば良い。 それで解決できない問題は科学が悪い。科学の発展を待つ。
近年のアクセシビリティの考え方(1) ・小さめのタブレットでもPC表示でサイトを見る人(PC用サイト表示機能) ・横になりながらスマホを使っている人(画面方向の固定機能) ・ランニング中で手がふさがっている人(読み上げ機能) ・小さな子供(簡単な文章) ・トラックパッドやマウスが使えない環境(キーボードでのブラウザ操作) ・静かな場所で動画を見たい人(ライブキャプション)
近年のアクセシビリティの考え方(2) 「障害者向け・高齢者向けのための対策」という考え方は古い アクセシビリティとは、 利用背景に関わらず、 ユーザーがベストな形で、 コンテンツを公平に受けとるための、 UXの根本的な考え方
アクセシビリティは全人類のためにある
近年のアクセシビリティの考え方(3) モバイルではメニューを画面下に表示すべき理由 人事労務freee、年末調整をスクリーンリーダーで利用可能。画面内の項目を音声で読 み上げて操作が可能に Google I/Oはアクセシビリティ強化に全力、聴覚障害者にも電車でYouTubeを見るにも 便利 Auditing Web Content
with Web Inspector - WWDC 2019 - Videos - Apple Developer
あとがき 乱視の人には「黒背景・白文字」よりも「白背景・黒文字」の方が見やすい、という研究結 果が出ています。 UIデザインで白背景にするか黒背景にするかを決める時に参考になる科学的事実
あとがき デザイン的に引き締まって見えるから良いよね? アクセシビリティは一つの考え方。 何も考えずに「アクセシビリティ絶対に守る!」は失敗のもと。 アクセシビリティのエッセンスを有効活用して、みんなが使いやすいサービスを作ってい こう!