どんなエンジニアになろうか決めかねていた自分が、ある日突然「私はウェブをやるために生まれてきた」と思うに至った、アクセシビリティの話です。
「アクセシビリティって何？」という人から、「大事なのはわかっているけどいつも後回しにしてしまう」という人まで、明日からアクセシブルな実装をせずにはいられない、ウェブの本質に迫ります。
View Slide
Σϒ ͬͯԿͩͱࢥͬͯ·͔͢ʁ
http://mysite.com
Σϒ͡Όͳ͍ͷͬͯʁ
@mirkaAccessibilityWeb
@mirkaѭͻݟͯͷͷͪͷ৺ʹ͘ΒͿΕੲͷΛࢥ͟Γ͚ΓΞΫηγ
Who am I?
@mirkaLena Morita! ݩσβΠφʔ! Women Who Code Tokyo ӡӦελοϑ! ͍Ζ͍Ζ͕Μͬͯݱࡏ ถAutomatticࣾͰ JavaScript Engineer
We’re hiring!NEW!
ΞΫηγϏϦςΟͱͷग़ձ͍
@mirka2016
@mirkaͦ͏͍͑ΞΫηγϏϦςΟͬͯͳΜ͔͋ͬͨͳ
@mirkaϢʔβϏϦςΟͳΒͤͯʂ
@mirkaΞΫηγϏϦςΟௐͨ
ΞΫηγϏϦςΟۀք
@mirka2017ͷWebΞΫηγϏϦςΟಈΛ͏
@mirka2017ͷWebΞΫηγϏϦςΟಈΛ͏ΞΫηγϏϦςΟ Ψν
@mirkaΞΫηγϏϦςΟ Ψν! ΞΫηγͷઐՈ! ࣾ֎ͰΞΫηγͷਪਐΛͯ͠Δਓ! Twitter bio ʹ “ΞΫηγϏϦςΟ” “a11y” ͳͲͷݴ༿͕͋Δ
@mirkaΦϥΘ͘Θ͘͢Δͧ
@mirka ͑ͬ
@mirkaΞΫηγʹΓؾ͡Όͳ͍ਓΛ͍͔ʹઆಘ͢Δ͔
@mirkaোऀࠩผ ղফ๏⚖
@mirkaػձଛࣦ
@mirka ࣭
@mirka ྙཧ
@mirkaݱ࣮ͦΜͳʹ͘ͳ͍Α
ݱ࣮
@mirkaΞΫηγϏϦςΟ͕㚽Ζʹ͞ΕΔཧ༝
@mirkaӦۀதअຐͳ͜ͱʹؾ͍ͮͯͳ͍
@mirkaӦۀத·͔͞ंҜࢠͷਓ͕௨Δͱࢥͬͯͳ͍
@mirkaυʔύϛϯ͕ग़ͯͳ͍ʂ✨Ӧۀத
υʔύϛϯͷਖ਼ମ
υʔύϛϯͷਖ਼ମ 1ର͕ҙ֎ʹ͍
@mirkaোऀରԠ
@mirka݈ৗऀ োऀ
@mirkadisabilitydis-ability
@mirkaΞϏϦςΟଟछଟ༷ঢ়گʹΑͬͯมԽ͢Δೳ ྗ
@mirkaInclusiveDesign
@mirka“োਓͰͳ͘ڥʹ͋Δ”
@mirkaInclusive 101 by Microsoft Design (CC BY-NC-ND)
@mirkaPermanentTemporarySituational߃ٱతҰ࣌తঢ়گత
@mirka“͏ͪͷϓϩμΫτোऀ͕λʔήοτ͡Όͳ͍͔Β”
υʔύϛϯͷਖ਼ମ 2͜ΜͳʹͰ͖ΔͷΣϒ͚ͩͰʁ
@mirkaWeb
@mirkaHTMLߏͷҙຯ͚ͮ
@mirkaػցMachines
υʔύϛϯͷਖ਼ମ 3ٛͷΞΫηγϏϦςΟ
@mirkaݪٛͷΞΫηγϏϦςΟোɺোऀʹযΛͯͨͷ
@mirkaSteve Yegge ͷ͓͠
@mirkaϕκεͷ͓ୡͯ͢͠ͷνʔϜσʔλͱػೳΛαʔϏεɾΠϯλʔϑΣʔεΛ௨ͯ͠ެ։ͤΑ
@mirkaαʔϏεɾΠϯλʔϑΣʔεͬͯʁ
@mirkaϕκεͷ͓ୡ͠ଞνʔϜͷσʔλΛʹಡΈग़ͨ͠ΓཪޱΛઃ͚Δͷېࢭ
@mirkaϕκεͷ͓ୡͯ͢͠ͷαʔϏεɾ ΠϯλʔϑΣʔε ࠷ऴతʹ֎෦ͷ։ൃऀʹ ެ։͢Δ͜ͱΛલఏʹઃܭͤΑ
@mirkaϕκεͷ͓ୡ͜͠ͷ໋ྩʹैΘͳ͍ͭΫϏʂ
@mirkaWordPress Ͱ͍͏ͱʁ
@mirkaใνʔϜDTPνʔϜ
@mirka
@mirkaWordPressREST API
@mirka— Steve Yegge“It’s called Accessibility,and it’s themost important thingin the computing world.”
@mirkaΠϯλʔϑΣʔε
@mirkaDisability AbilityMachine HumanAccessibility Usability
Σϒͱ
@mirkaExtensionsUserscripts
@mirkaReader modeVoiceOverFont size
@mirka?
Open &Standardized
Σϒͷຊྖൃش
@mirkaӦۀதӦۀதӦۀத
@mirkaWCAGWeb Content Accessibility Guidelines
@mirka͍ͮΒ͍ ͍͍͢AccessibilityUsability ͍͍͔͢ͳʁ͑ͳ͍ਓ͍Δ͔ͳʁ
͑ʂ ΞΫηγϏϦςΟ
@mirkaجຊͷ͍1. ݟ͑ʹ͍͘ঢ়گͰ͑Δʁ2. ΩʔϘʔυ͚ͩͰ͑Δʁ3. ԻಡΈ্͛Ͱ͑Δʁ
@mirkaશ͑͘ͳ͍ ͍͍͢Afterશ͑͘ͳ͍ ͍͍͑͢ΔϥΠϯBefore
@mirkaجຊͷ͍1. ݟ͑ʹ͍͘ਓͰ͑Δʁ2. ΩʔϘʔυ͚ͩͰ͑Δʁ3. ԻಡΈ্͛Ͱ͑Δʁ
͍ 1ݟ͑ʹ͍͘ਓͰ͑Δʁ
͍ 2ΩʔϘʔυ͚ͩͰ͑Δʁ
͍ 3ԻಡΈ্͛Ͱ͑Δʁ
@mirkaalt
@mirkaSave changes×
Σϒɺ͘͢͝ͳ͍ʁ
@mirkaࢠͲͷ༧छೕ༮ࣇ݈߁ࠪͷ͝Ҋҭࣇֶڃɾ࠙ஊձͷ͝ҊࢠͲͷ݈߁ڭࣨ࢈්ɾ৽ੜࣇͷ๚ࢦಋ
@mirkaਖ਼͘͠ઃܭˍ࣮͞Εͨใࣗ༝Ͱ͋Δ
ࣗ༝Λ࠷େԽ͍ͨ͠
@mirka͋ΒΏΔਓؒ • ػցʹͱͬͯΞΫηεՄೳͱͳΔ
@mirkaΣϒͷຊ࣭ͱΞΫηγϏϦςΟ
@mirkaΣϒ͞Μᴷᴷ͋ͬ
ʪΞΫηγϏϦςΟʫͰݕࡧৄ͘͠ΣϒͰ—
mirka
line_developers_tw
daikimori
eiki
opeonikute
brainpadpr
line_developers
emgsilva
yokawasa
kentosuzuki
riru
ikezoemakoto
gawa
pauljervisheath
aki_iinuma
stephaniewalter
cromwellryan
garrettdimon
aarron
tanoku
jonyablonski
tenderlove
jensimmons
jmmastey
sonatard