Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Webアクセシビリティ脳のつくりかた

 Webアクセシビリティ脳のつくりかた

kobatatakayuki

April 22, 2017
Tweet

More Decks by kobatatakayuki

Other Decks in Technology

Transcript

  1. WebΞΫηγϏϦςΟ೴ͷͭ͘Γ͔ͨ
    WCAN 2017 Spring LT / ࣗশ େࡕͷΞΫηγϏϦςΟ͓͡͞Μ

    View Slide

  2. WebΞΫηγϏϦςΟ೴ͱ͸ʁ

    View Slide

  3. ແҙࣝʹWebΞΫηγϏϦςΟΛ
    ߟྀͰ͖Δࢥߟͷ͜ͱ

    View Slide

  4. ແҙࣝ ʹ श׳Խ

    View Slide

  5. WebΞΫηγϏϦςΟ೴Λͭ͘ΔͨΊͷ
    ʮΩοΧέʯΛ࣋ͪؼΔ͜ͱ
    ࠓ೔ͷΰʔϧ

    View Slide

  6. 1. ݱঢ়Λ஌Δ
    2. HTMLΛۃΊΔ
    3. ؀ڥΛ੔͑Δ
    ΞδΣϯμ

    View Slide

  7. ݱঢ়Λ஌Δ

    View Slide

  8. ໿
    711
    ສਓ
    ୈ1ฤɹୈ1ষɹো֐ऀͷঢ়گʢجຊత౷ܭΑΓʣʛฏ੒25೥౓ো֐ऀനॻʢ֓ཁʣ - ಺ֳ෎
    ো֐ऀͷਓ਺

    View Slide

  9. ໿
    3459
    ສਓ
    ౷ܭہϗʔϜϖʔδ/ਓޱਪܭʢฏ੒28೥(2016೥)10݄֬ఆ஋ɼฏ੒29೥3݄֓ࢉ஋ʣɹʢ2017೥3݄21೔ެදʣ
    ߴྸऀͷਓ਺

    View Slide

  10. ໿
    34
    ˋ
    ೔ຊͷਓޱʹ͓͚Δߴྸऀͱো֐ऀͷׂ߹ʢ2017೥ʣ

    View Slide

  11. HTMLΛۃΊΔ

    View Slide

  12. ਖ਼͍͠จॻߏ଄ͰHTMLΛॻ͘
    POINT

    View Slide


  13. ίϯςϯπA
    ίϯςϯπB

    Example

    View Slide



  14. ίϯςϯπA
    ίϯςϯπB


    Example

    View Slide

  15. View Slide

  16. ؀ڥΛ੔͑Δ

    View Slide

  17. ʮ઀఺ʯΛ૿΍͢
    POINT

    View Slide

  18. • https://a11yj.herokuapp.com/
    • SlackϕʔεͷίϛϡχςΟ
    • ϏδωεɾΞʔΩςΫπͷҏݪ͞Μ͕ओ࠻
    • ·ͣ͸ɺROM͚ͩͰ΋OK͔ͱࢥ͍·͢
    • ඈͼࠐΜͰΈ·͠ΐ͏ʘ(^o^)ʗ
    A11YJ Team

    View Slide

  19. • https://accsell.net/
    • ༗ྉϝʔϧϚΨδϯ΍ϙουΩϟετΛ഑৴
    • தࠜ͞Μɺ২໦͞Μɺࢁຊ͞Μ͕ӡӦ
    • ΞΫηγϏϦςΟؔ࿈ͷΠϕϯτ৘ใ΋഑৴
    • ָ͠Έͳ͕Βɺ಺༰ͷೱ͍৘ใऩू͕Ͱ͖Δ
    AccSell

    View Slide

  20. ࣗݾ঺հ

    View Slide

  21. খാλΧϢΩ (37)
    @kobatatakayuki

    View Slide

  22. View Slide

  23. ϑϩϯτΤϯυ͔ΒWebͷະདྷΛߟ͑Δձ
    http://frontend-x.github.io/

    View Slide

  24. ͍͞͝ʹ

    View Slide

  25. The power of the Web is in its universality. Access by
    everyone regardless of disability is an essential
    aspect.
    Webͷύϫʔ͸ɺͦͷීวੑʹ͋Δɻো֐ͷ༗ແʹؔ܎ͳ
    ͘ɺ୭΋͕࢖͑Δ͜ͱ͕ɺͦͷຊ࣭Ͱ͋Δɻ
    Tim Berners-Lee, W3C Director and inventor of the World Wide Web

    View Slide

  26. ΞΫηγϏϦςΟ͕ͦ͜Webͷຊ࣭

    View Slide

  27. Thank you!
    http://www.kobatatakayuki.com
    @kobatatakayuki

    View Slide