ユーザーと一緒に進めるアクセシビリティ -1年でアクセシビリティを組織に浸透させたnoteの取り組み -

by Senda Masato / 仙田真郷

Slide 1

Slide 1 text

ϢʔβʔͱҰॹʹਐΊΔΞΫηγϏϦςΟ 1 ೥ͰΞΫηγϏϦςΟΛ ૊৫ʹਁಁͤͨ͞OPUFͷऔΓ૊Έ

Slide 2

Slide 2 text

2 69Ϧαʔνϟʔ   ઋాਅڷ ೥ʹOPUFגࣜձࣾʹ৽ଔͰೖࣾɻ ೥݄ʹ69ϦαʔννʔϜΛ্ཱͪ͛ɺ 69Ϧαʔνͷ࣮ࢪͱࣾ಺ਁಁʹऔΓ૊ΜͰ͍ Δɻ ΞΫηγϏϦςΟνʔϜͰ͸ɺো֐౰ࣄऀ΁ͷ ϢʔβʔΠϯλϏϡʔΛओಋ͍ͯ͠Δɻ OPUFDPNTFOEBNBTBUP !NBTBUPTFOEB

Slide 3

Slide 3 text

ຊ೔ͷྲྀΕ ̍.ɹnoteͷΞΫηγϏϦςΟνʔϜʹ͍ͭͯ 2.ɹϢʔβʔΠϯλϏϡʔͷนͱ৐Γӽ͑ͨํ๏ 3.ɹϢʔβʔΠϯλϏϡʔΛͯ͠Α͔ͬͨ͜ͱ 4.ɹnoteͰੜ·Εͨൃ৴ͱϑΟʔυόοΫͷαΠΫϧ 3

Slide 4

Slide 4 text

ຊ೔ͷྲྀΕ ̍.ɹnoteͷΞΫηγϏϦςΟνʔϜʹ͍ͭͯ 2.ɹϢʔβʔΠϯλϏϡʔͷนͱ৐Γӽ͑ͨํ๏ 3.ɹϢʔβʔΠϯλϏϡʔΛͯ͠Α͔ͬͨ͜ͱ 4.ɹnoteͰੜ·Εͨൃ৴ͱϑΟʔυόοΫͷαΠΫϧ 4

Slide 5

Slide 5 text

5 ΫϦΤΠλʔ͕จষ΍ը૾ɺԻ ੠ɺಈըΛ౤ߘͯ͠ɺϢʔβʔ ͕ͦͷίϯςϯπΛָ͠ΜͰԠ ԉͰ͖Δ   ϝσΟΞϓϥοτϑΥʔϜ OPUFͱ͸ʁ

Slide 6

Slide 6 text

OPUFΞΫηγϏϦςΟνʔϜʹ͍ͭͯ 6 69ΤϯδχΞ σβΠφʔ J04ΤϯδχΞ Ϧαʔνϟʔ ΧελϚʔαϙʔτ ΞυόΠβʔ ϑϩϯτΤϯυΤϯδχΞ

Slide 7

Slide 7 text

OPUFΞΫηγϏϦςΟνʔϜʹ͍ͭͯ ● ༗ࢤνʔϜʢ૊৫ਤʹ͸ͳ͍ɺશһ݉ۀʣ ● ϝϯόʔ͸໊΄Ͳ ● ೥݄͔Βຊ֨࢝ಈ ● GSFFFͷNBHJ͞Μʹ֎෦ΞυόΠβʔͱͯ͠ೖͬͯ΋Βͬͯ ͍Δ ● ຖि࣌ؒͷఆྫ ● ݱࡏظ 7

Slide 8

Slide 8 text

ͳͥOPUF͸ ΞΫηγϏϦςΟ޲্ʹ औΓ૊ΜͰ͍Δͷ͔ 8

Slide 9

Slide 9 text

ϛογϣϯʹඥ͍ͮͯΔ͔Β ୭΋͕૑࡞Λ͸͡Ίଓ͚ΒΕΔΑ͏ʹ͢Δ 9 .*44*0/

Slide 10

Slide 10 text

׆ಈͷதͰʜ ϢʔβʔΠϯλϏϡʔΛ࣮ࢪ͖ͯͨ͠ 10

Slide 11

Slide 11 text

͜Ε·Ͱ໊Ҏ্ͷো֐౰ࣄऀʹ࿩Λฉ͍͖ͯͨ 11

Slide 12

Slide 12 text

ͳͥϢʔβʔΠϯλϏϡʔΛ ͸͡Ίͨͷ͔ 12

Slide 13

Slide 13 text

NBHJ͞ΜʹݴΘΕ͔ͨΒ 13 ΞΫηγϏϦςΟͷඞཁੑ͸ɺ ͦΕΛ੾࣮ʹඞཁͱ͍ͯ͠Δ ϢʔβʔΛݟͳ͍ͱཧղͰ͖ͳ͍ʂ NBHJ͞Μ

Slide 14

Slide 14 text

ϢʔβʔΛݟͳ͍ͱཧղͰ͖ͳ͍͜ͱ͕͋ͬͨ 14 OPUFͷΞΫηγϏϦςΟ޲্ϓϩδΣΫτ͕࢝ಈ

Slide 15

Slide 15 text

ॳΊͯશ໡ͷΫϦΤΠλʔͱ࿩ͨ͠ΤϯδχΞͷݴ༿ 15

Slide 16

Slide 16 text

͜Ε·Ͱ໊Ҏ্ͷো֐౰ࣄऀʹ࿩Λฉ͍͖ͯͨ ো֐ͷঢ়گ ● શ໡ ● ऑࢹ ● ৭֮ಛੑ ● ্ࢶো֐ 16 ૢ࡞؀ڥ ● εΫϦʔϯϦʔμʔ ʢ/7%"ɺ1$5BMLFSɺ7PJDF0WFS ● ֦େ ● ৭֮ิॿ ● Ϛ΢εૢ࡞ʢεΫϦʔϯΩʔϘʔυʣ ● ࢹઢૢ࡞ʢεΫϦʔϯΩʔϘʔυʣ

Slide 17

Slide 17 text

ຊ೔ͷྲྀΕ ̍.ɹnoteͷΞΫηγϏϦςΟνʔϜʹ͍ͭͯ 2.ɹϢʔβʔΠϯλϏϡʔͷนͱ৐Γӽ͑ͨํ๏ 3.ɹϢʔβʔΠϯλϏϡʔΛͯ͠Α͔ͬͨ͜ͱ 4.ɹnoteͰੜ·Εͨൃ৴ͱϑΟʔυόοΫͷαΠΫϧ 17

Slide 18

Slide 18 text

࠷ॳʹײ͍ͯͨ͜͡ͱ 18 ো֐౰ࣄऀͱͲ͏઀ͨ͠Β͍͍͔ ෼͔Βͳ͔ͬͨɻ ա৒ʹؾΛݣͬͯ͠·͍ͬͯͨɻ

Slide 19

Slide 19 text

Ͳ͏͔ͨ͠ ৺ߏ͑ΛվΊͨɻmagi͞Μͷݴ༿↓ ɾ ૬ख͸ಛผͳਓͰ͸ͳͯ͘ɺࢲͨͪͱಉ͡ɺͻͱΓͷnoteϢʔβʔɻར༻ঢ়گ͕૬ ରతʹಛघͳ͚ͩɻ ɾ ߏ੒ͱͯ͠͸ϢʔβʔΠϯλϏϡʔͱ͍ͬ͠ΐɻجຊ͸ʰͲΜͳ;͏ʹ࢖͍ͬͯΔ ͔ฉ͘ʱʹ͗͢ͳ͍ɻߏ͑͗͢ͳ͍ ɾΠϯλϏϡʔ࣮ࠪ࣌ʹɺো֐ʹ͍ͭͯա౓ʹහײʹͳΒͳ͍ɺԕྀ͠ͳ͍(܏ௌͷ࢟ ੎Λ࣋ͯ͹େৎ෉) 19

Slide 20

Slide 20 text

20 ΠϯλϏϡʔͷ ४උͯ͠΋Β͏ͷਃ͠༁ͳ͍ʜ ࠷ॳʹײ͍ͯͨ͜͡ͱ

Slide 21

Slide 21 text

Ͳ͏͔ͨ͠ ● ࣄલʹฉ͘ɺ४උ͸ͯ͠΋Β͏ʂ ○ ͋Β͔͡Ίಈ࡞؀ڥΛฉ͍͓ͯ͘ ○ ϏσΦ௨࿩ͷ઀ଓςετΛͯ͠΋Β͏ ○ ࣄલʹnoteʹొ࿥ɺ৮͓͍ͬͯͯ΋Β͏ ○ ීஈnoteΛ࢖ͬͯΔ༷ࢠͷಈըΛૹͬͯ΋Β͏ →ԕྀͤͣ४උ͸ͯ͠΋Βͬͨํ͕͓ޓ͍༗ҙٛͳ࣌ؒʹͳΔ 21

Slide 22

Slide 22 text

࠷ॳʹࠔͬͨ͜ͱ 22 πʔϧʹ͍ͭͯ஌Βͳͯ͘ςϯύΔ

Slide 23

Slide 23 text

࠷ॳʹࠔͬͨ͜ͱ 23 ● NVDAͷϑΥʔΧεϞʔυɺϒϥ΢ζϞʔυʹ͍ͭͯ஌Βͳ ͔ͬͨ ● PC-TalkerͰ͸ಡΈ্͛ͳ͍έʔε͕ଟ͍͜ͱΛ஌Βͳ͔ͬ ͨ

Slide 24

Slide 24 text

Ͳ͏͔ͨ͠ ● ࣄલௐࠪ͸͔ͬ͠Γ͓ͯ͘͠ ○ ૬ख͸ͲΜͳ؀ڥͳͷ͔ɺͲΜͳσόΠεͳͷ͔ ○ ࣗ෼Ͱ΋৮͓ͬͯ͘ ○ Α͋͘ΔࠔΓ͝ͱ͸ͳΜͳͷ͔ωοτͰௐ΂Δ ● ஌͔ͬͨͿΓͤͣʹฉ͘ →લఏ஌ࣝ͸େࣄ 24

Slide 25

Slide 25 text

͜Ε·Ͱฉ͍͖ͯͨਓͨͪͷো֐ͷঢ়گ͝ͱʹ঺հ 25 ● શ໡ ● ऑࢹ ● ৭֮ಛੑ ● ্ࢶো֐

Slide 26

Slide 26 text

Ϳ͔ͭͬͨน ● εΫϦʔϯϦʔμʔͷιϑτɺϒϥ΢βΤϯδϯʹΑͬͯಡΈ ্͛ํ͕มΘΔ ○ ιϑτɿNVDAɺPC-TalkerɺVoiceOver ○ ϒϥ΢βɿChromeɺSafari… →͜ͷલ͸ಡΜͩͷʹɺࠓճ͸͏·͘ಡΈ্͛ͳ͍ʂʂ 26

Slide 27

Slide 27 text

͜͏৐Γӽ͑ͨ ● ࣄલʹڍಈΛௐ΂Δʂ ○ εΫϦʔϯϦʔμʔͷιϑτ͝ͱʹಡΈ্͛Δ ϥϕϧ ○ note͸ࠓͲΜͳ;͏ʹಡΈ্͍͛ͯΔ͔ 27

Slide 28

Slide 28 text

Ϳ͔ͭͬͨน ● ը໘ڞ༗͸Ͱ͖Δ͕ɺԻ੠͕ڞ༗͞Εͳ͍ɻ ● εϚϗͷԻ੠͕ڞ༗Ͱ͖ͳ͍ 28

Slide 29

Slide 29 text

͜͏৐Γӽ͑ͨᶄ ࣄલʹ઀ଓςετΛͯ͠΋Β͏Α͏ʹ͓ئ͍͢Δ 29

Slide 30

Slide 30 text

ͦͷ΄͔ϙΠϯτ ● ීஈͷಡΈ্͛଎౓ͩͱૣ͘ɺฉ͖औΕͳ͍ɻ஗ͯ͘͠ ΋Β͏ɻ ● ಡΈ্͛ͳͯ͘໎ͬͯ͠·ͬͨ࣌ɺࢹ֮৘ใΛΘ͔Γ΍ ͘͢ޱ಄Ͱઆ໌͢Δ 30

Slide 31

Slide 31 text

ੜ·Εͨࢪࡦ ΞϓϦͷϩʔλʔૢ࡞ʹରԠ 31

Slide 32

Slide 32 text

ੜ·Εͨࢪࡦ ಡΈ্͛ʹ׽ࣈґଘͷݴ༿ΛݮΒ͢ 32 ະεΩ ↓ εΩ ੾Γସ͑Ϙλϯ ԡ͞Ε͍ͯ·ͤΜ

Slide 33

Slide 33 text

͜Ε·Ͱฉ͍͖ͯͨਓͨͪ 33 ● શ໡ ● ऑࢹ ● ৭֮ಛੑ ● ্ࢶো֐

Slide 34

Slide 34 text

Ϳ͔ͭͬͨน ● ֦େදࣔΛ͍ͯ͠Δਓ͕ଟ͍͕ɺΦϯϥΠϯͰը໘ڞ༗ Λ͢Δͱݩͷഒ཰ʹิਖ਼͞Εͯ͠·͏ 34

Slide 35

Slide 35 text

Ϳ͔ͭͬͨน 35

Slide 36

Slide 36 text

͜͏৐Γӽ͑ͨ 36 ը໘֦େͯ͠Δ༷ࢠΛผͷΧϝϥͰࡱӨͯ͠΋Βͬͨ

Slide 37

Slide 37 text

Slide 38

Slide 38 text

͜Ε·Ͱฉ͍͖ͯͨਓͨͪ 38 ● શ໡ ● ऑࢹ ● ৭֮ಛੑ ● ্ࢶো֐

Slide 39

Slide 39 text

Ϳ͔ͭͬͨน ● ௨ৗ৭֮ͷݟ͑ํͱͷҧ͍͸౰ࣄऀ΋Θ͔Βͳ͍ ● ී௨ʹฉ͍ͯ΋՝୊͕ݟ͔ͭΒͳ͍ 39

Slide 40

Slide 40 text

͜͏৐Γӽ͑ͨ ● ࣄલʹγϛϡϨʔγϣϯπʔϧͰݟ͑ʹ͍͘ՕॴΛϦετ Ξοϓ͓ͯ͘͠ 40 4QFDUSVN

Slide 41

Slide 41 text

͜͏৐Γӽ͑ͨ 41 ʲ௨ৗ৭֮ʳ ʲγϛϡϨʔγϣϯπʔϧʳ

Slide 42

Slide 42 text

͜͏৐Γӽ͑ͨ 42 ʲ௨ৗ৭֮ʳ ʲγϛϡϨʔγϣϯπʔϧʳ

Slide 43

Slide 43 text

͜͏৐Γӽ͑ͨ 43

Slide 44

Slide 44 text

ͦͷ΄͔ϙΠϯτ ৭֮ಛੑͰ΋ɺਓʹΑͬͯݟ͑ํ͕ҧ͏ͷͰɺෳ਺ਓʹฉ͘ 44

Slide 45

Slide 45 text

ੜ·Εͨࢪࡦ 45 ݱࡏ஍ͷදࣔʹ ྘Λ࢖Θͳ͍ ʲมߋલʳ ʲมߋޙʳ

Slide 46

Slide 46 text

ੜ·Εͨࢪࡦ ݱࡏ஍ͷදࣔʹ ྘Λ࢖Θͳ͍ 46 https://note.com/notes ʲมߋલʳ ʲมߋޙʳ

Slide 47

Slide 47 text

Slide 48

Slide 48 text

Slide 49

Slide 49 text

͜Ε·Ͱฉ͍͖ͯͨਓͨͪ 49 ● શ໡ ● ऑࢹ ● ৭֮ಛੑ ● ্ࢶো֐

Slide 50

Slide 50 text

Ϳ͔ͭͬͨน ● ΩʔϘʔυૢ࡞ɺࢹઢૢ࡞ͷงғؾ͕෼͔Βͳ͍ 50

Slide 51

Slide 51 text

͜͏৐Γӽ͑ͨ ● ૢ࡞ํ๏Λௐ΂͓ͯ͘ ● Α͋͘Δେมͳ͜ͱʹ͍ͭͯௐ΂͓ͯ͘ ○ ࢹઢͰಈ͔ͨ͢Ίɺࡉ͔͍Χʔιϧͷૢ࡞͕೉͠ ͍ͷͰɺখ͍͞Ϙλϯ͕ԡ͠ʹ͍͘ ○ ϙοϓΞοϓ͕ด͡ʹ͍͘ ● ๯಄Ͱૢ࡞ํ๏ʹ͍ͭͯฉ͘ 51

Slide 52

Slide 52 text

͜͏৐Γӽ͑ͨ 52

Slide 53

Slide 53 text

ͦͷ΄͔ϙΠϯτ ൃ࿩͕Ͱ͖ͳ͍ํͷ৔߹ɺ৘ใͷ΍ΓͱΓʹ͕͔͔࣌ؒΔ ͷͰɺ௕ΊʹΠϯλϏϡʔͷ࣌ؒΛͱΔ 53

Slide 54

Slide 54 text

ຊ೔ͷྲྀΕ ̍.ɹnoteͷΞΫηγϏϦςΟνʔϜʹ͍ͭͯ 2.ɹϢʔβʔΠϯλϏϡʔͷนͱ৐Γӽ͑ͨํ๏ 3.ɹϢʔβʔΠϯλϏϡʔΛͯ͠Α͔ͬͨ͜ͱ 4.ɹnoteͰੜ·Εͨൃ৴ͱϑΟʔυόοΫͷαΠΫϧ 54

Slide 55

Slide 55 text

ϝϯόʔͷϞνϕʔγϣϯʹͭͳ͕ͬͨ 55

Slide 56

Slide 56 text

෭࣍తͳޮՌ ● ಧ͚Δਓͷإɺ੠͕෼͔Δ ● Ϣʔβʔ͕noteʹظ଴ͯ͘͠ΕͯΔ͜ͱ͕෼͔Δ ● ػೳΛ๙Ίͯ͘ΕΔ ● νʔϜ֎ͷਓ΋ڵຯΛ΋ͬͯ؍ͯ͘ΕΔ →νʔϜ಺ͷϞνϕʔγϣϯҡ࣋ɺࣾ಺Ͱͷೝ஌֫ಘ 56

Slide 57

Slide 57 text

ຊ೔ͷྲྀΕ ̍.ɹnoteͷΞΫηγϏϦςΟνʔϜʹ͍ͭͯ 2.ɹϢʔβʔΠϯλϏϡʔͷนͱ৐Γӽ͑ͨํ๏ 3.ɹϢʔβʔΠϯλϏϡʔΛͯ͠Α͔ͬͨ͜ͱ 4.ɹnoteͰੜ·Εͨൃ৴ͱϑΟʔυόοΫͷαΠΫϧ 57

Slide 58

Slide 58 text

OPUFͷڧΈ 1. ֎෦ͷΞυόΠβʔʢmagi͞ΜʣΛݺ΂ͨ 2. ϑΟʔυόοΫΛ͘ΕΔ೤ྔͷ͋ΔϢʔβʔ 3. ൃ৴Λॿ͚ͯ͘ΕΔࣾ಺ମ੍ 58

Slide 59

Slide 59 text

1. ֎෦ͷΞυόΠβʔʢmagi͞ΜʣΛݺ΂ͨ ● Կ͕෼͔Βͳ͍͔෼͔Βͳ͍ ● Ͳ͜ʹɺ୭ʹฉ͚͹͍͍͔෼͔Βͳ͍ →͍ͭͰ΋ͳΜͰ΋౴͑ͯ͘ΕΔϓϩϑΣογϣφϧ͕͍Δ ΠϯλϏϡʔڠྗऀ͸magi͞Μʹ঺հͯ͠΋Β͏͜ͱ΋ 59

Slide 60

Slide 60 text

2.ϑΟʔυόοΫΛ͘ΕΔ೤ྔͷ͋ΔϢʔβʔ͕͍Δ 60

Slide 61

Slide 61 text

2.ϑΟʔυόοΫΛ͘ΕΔ೤ྔͷ͋ΔϢʔβʔ͕͍Δ 61

Slide 62

Slide 62 text

3.ൃ৴Λॿ͚ͯ͘ΕΔࣾ಺ମ੍ 62 noteΞΫηγϏϦςΟࢪࡦ

Slide 63

Slide 63 text

3.ൃ৴Λॿ͚ͯ͘ΕΔࣾ಺ମ੍ 63 σΟϨΫλʔ ΤϯδχΞˍϥΠλʔ 13 هࣄͷࣥච/ߍਖ਼Λͯ͘͠ΕΔ…ʂ

Slide 64

Slide 64 text

݁Ռతʹੜ·Εͨൃ৴ͱϑΟʔυόοΫͷαΠΫϧ 64

Slide 65

Slide 65 text

݁Ռతʹੜ·Εͨൃ৴ͱϑΟʔυόοΫͷαΠΫϧ 65

Slide 66

Slide 66 text

αΠΫϧ͕ճΔΑ͏ʹͳͬͨͷ΋ΠϯλϏϡʔ͕࢝·Γͩͬͨ ΠϯλϏϡʔ΍ͬͯΈΔͷେࣄʂʂʂ ࠓ೔ͷ࿩ɺࢀߟʹͯ͠Έ͍ͯͩ͘͞ 66

Slide 67

Slide 67 text

67 ୭΋͕૑࡞Λ͸͡Ίɺଓ͚ΒΕΔΑ͏ʹ͢Δ஥ؒΛ଴ͬͯ·͢ ΧδϡΞϧ໘ஊϑΥʔϜ͸ͪ͜Β

Slide 68

Slide 68 text

No content