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
資料作りのアクセシビリティ s-dev#11 LT
Search
earlgrayMK
May 20, 2019
0
3.7k
資料作りのアクセシビリティ s-dev#11 LT
2019年5月20日 s-dev talks #11「定量データ分析」の5分LTでお話した資料です。
earlgrayMK
May 20, 2019
Tweet
Share
More Decks by earlgrayMK
See All by earlgrayMK
アクセシビリティを向上していくために出来ることから進めてみた! ~2019まとめ~
mikimhk
1
630
Atomic Designと付き合うコツ♡
mikimhk
1
1.7k
Featured
See All Featured
KATA
mclloyd
29
14k
[RailsConf 2023] Rails as a piece of cake
palkan
53
5.1k
The Invisible Side of Design
smashingmag
299
50k
Into the Great Unknown - MozCon
thekraken
34
1.6k
Done Done
chrislema
182
16k
Scaling GitHub
holman
459
140k
The Cult of Friendly URLs
andyhume
78
6.1k
A Tale of Four Properties
chriscoyier
157
23k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
25k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.8k
GraphQLの誤解/rethinking-graphql
sonatard
68
10k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
Transcript
ࢿྉ࡞ΓͷΞΫηγϏϦςΟ s-dev talks ʙαʔϏε։ൃษڧձʙ#11 5LT $SPXE8PSLT*OD 69&OHJOFFS ྛ ඒل FBSMHSBZ.,
Έʔͨ $SPXE8PSLT *OD69&OHJOFFS TEFWUBMLTӡӦ FBSMHSBZ., ࠷ۙɺΠϕϯτࢀՃ͢Δͱʮ͋ɺ͜ͷΞΠίϯ5XJUUFSͰΈͨ͜ͱ͋Γ·͢ʔʂʯͱݴΘΕΔ΄ͲͷπΠഇͰ͢ɻ
69ΤϯδχΞͰ͕͢ࠓٕज़ͷ͠·ͤΜɻ ͑ΔͨΊͷΞΫηγϏϦςΟʹ͍͓͍ͭͯͨ͠ͱࢥ͍·͢ɻ FBSMHSBZ.,
FBSMHSBZ., օ͞ΜʮΞΫηγϏϦςΟʯͱฉ͍ͯ Ͳ͏͍͏ΠϝʔδΛ͍࣋ͬͯ·͔͢ʁ ಥવͰ͕͢
FBSMHSBZ., ো͕͍ऀͷͨΊʁ ܾͯ͠ো͕͍ऀͷΑ͏ͳಛघͳ͍ํΛ͢ΔਓͷͨΊ͚ͩͰ͋Γ·ͤΜɻ ΞΫηγϏϦςΟʹ͍ͭͯ
FBSMHSBZ., αʔϏεʹରͯ͠ͳΒ ΈΜͳ͕αʔϏεΛ ͍͍͢Α͏ʹ͢ΔͨΊ Ͱ͋Γ·͢ɻ 今はモバイルデバイスや遅いネットワークを利⽤している⼈々のためのものでもあると 考えられています。 ΞΫηγϏϦςΟʹ͍ͭͯ
⽉末で通信制限!! 3Gでしか⾒れない&電⾞の中でサイトが全然表⽰されない! • ⽂字だけ表⽰したら情報は得られる • safariには標準で「リーダー表⽰」機能がある FBSMHSBZ., 俺はキーボードでサクサク画⾯操作するtab使いさ • h7ps://yossense.com/tab-key/
サイト運営側から⾒てもマシンリーダブル =検索クローラーが⾛りやすい=SEOの対策にもなる
FBSMHSBZ., アクセシビリティとは... 能⼒や環境にかかわらずユーザー全員が、同じ情報を得られ ること ちなみによく対等に使われるユーザビリティとは... リーチできるユーザーに対する「使いやすいか使いづらいか」 Έʔͨͷղऍ
FBSMHSBZ., ຊདྷͳΒ͜ͷྲྀΕͩͱαʔϏεʹམͱ͠ࠐΉٕज़Λ ͢ͱ͜ΖͳΜͰ͕͢ɺΞφϦετ͕ଟ͍͔ͳʔͱ ࢥ͏ͷͰɺࠓճࢿྉ࡞Γʹؔͯ͠͠·͢ɻ
FBSMHSBZ., ࢿྉΛ࡞Δͱ͖ʹҙ͍ࣝ͢͠ ΞΫηγϏϦςΟରԠͬͯͳΜͩΖ͏
FBSMHSBZ., ৭ऑোͷਓ உੑͰਓʹਓɺঁੑͰਓʹਓͱݴΘΕ͍ͯ·͢ɻ ৭͔͍ͭʹؾΛ͚ͭͯΈΔ
FBSMHSBZ., ৭͔͍ͭʹؾΛ͚ͭͯΈΔ ྫ͑ɺࢿྉ࡞Γͷࡍʹ ͜ͷத͔ΒબΜͰΈΔ https://jfly.uni-koeln.de/colorset/CUD_color_set_GuideBook_2018.pdf カラーユニバーサルデザイン推奨配⾊セット ガイドブック
FBSMHSBZ., ଟ͗͢Δʂͱײͨ͡ͳΒ ͪ͜ΒͷύϨοτΛ ࢀߟʹ͍͍͔ͯ͠ https://note.mu/oremega/n/n6a20a4459a6b チャートでイイ感じな⾊を模索した話 ৭͔͍ͭʹؾΛ͚ͭͯΈΔ
FBSMHSBZ., ৭ʹཔΒͳ͍ • ⽂章中なら太字や「かぎかっこ」下線などの装飾で強調 • グラフなどは⾯に柄を付けたり、折り線の点を記号にする モノクロに印刷しても分かりやすい 0 1 2
3 4 5 hoge fuga 系列 3 系列 2 系列 1 ৭͔͍ͭʹؾΛ͚ͭͯΈΔ
FBSMHSBZ., ͜ΕΒΛؾΛ͚ͭΔ͚ͩͰΘΔਓ͕૿͑Δ͔ὑ
5IBOLZPV FBSMHSBZ.,