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

ブロックエディターではじめるアクセシビリティ / start accessibility with block editor

73239a63bba7e11d6f2621caceef76d1?s=47 majimasachi
January 29, 2021
Design
1
440

ブロックエディターではじめるアクセシビリティ / start accessibility with block editor

2021年1月29日に開催された WP Zoom UP #57 新春LT大会2021！で発表したスライドです。
テキスト版はこちら

73239a63bba7e11d6f2621caceef76d1?s=128

majimasachi

January 29, 2021
Tweet

More Decks by majimasachi

See All by majimasachi
あかるいブランドカラーと コントラストの話 / bright brand colors and contrast
73239a63bba7e11d6f2621caceef76d1?s=48 majimasachi
2
100
ウェブ制作に活かすユニバーサルデザインの視点 / Universal design for web design
73239a63bba7e11d6f2621caceef76d1?s=48 majimasachi
10
1.2k
認知心理学に学ぶ 伝わる情報デザイン / Cognitive psychological information design
73239a63bba7e11d6f2621caceef76d1?s=48 majimasachi
8
2.5k
スライド作成のチェックポイント / WordCamp Ogijima 2018 slideguide_jp
73239a63bba7e11d6f2621caceef76d1?s=48 majimasachi
12
27k
Checkpoints for Creating Slides / WordCamp Ogijima 2018 slideguide-en
73239a63bba7e11d6f2621caceef76d1?s=48 majimasachi
1
810
明日からできるデザイン・コンテンツのアクセシビリティ入門2018 / A11y in Design and Contents
73239a63bba7e11d6f2621caceef76d1?s=48 majimasachi
7
2k
インクルーシブに楽しむアクセシビリティ
73239a63bba7e11d6f2621caceef76d1?s=48 majimasachi
4
600

Other Decks in Design

See All in Design
u1w_未知のゲームを制作する時に考えたこと
05301e1170c62df84521684c17f96278?s=48 tobusaoi
0
110
Fairest of Them All
5968fa9a81cf1cf77a919996b8ed1bc9?s=48 pandemonay
1
610
ダークモード対応に困ったときの便利な処方箋 / Color scheme for dark mode
6e6c7132d99fd8febb2193fd21809d20?s=48 featherplain
2
450
アンドパッドのデザインシステムの今までとこれから
98616aa6b83a1cd3f1c7d22e2e1ad526?s=48 sizucca
2
1.2k
幸せなパーパス経営の実現に欠かせない、社員の「個人理念」の重要性と活用法
6581d0d2debbc8be5e4808cf46b4f104?s=48 kakukoki
PRO
0
120
NCDC_UXSession_20220120
6e51a472cea0c9d058d830eca153cb0f?s=48 ncdc
0
620
Designing Mobile Apps For Bharat
Ad94879495e21b7362d0d2c845f44bc0?s=48 soham
3
140
A Designer’s Guide to Documenting Accessibility & User Interactions
F383c6a4dc55e331bbe2987b622cee6b?s=48 stephaniewalter
0
7.3k
Monster in the Closet
E9842b8acc7107a783648a6274dd9a10?s=48 laineyru
1
160
Public映えのための7つのテクニック
C14831f939ef3b287f9b33dd14d38d80?s=48 cielo1985
0
160
FULLPAGEJUNGLECHASE.pdf
8b7fb938172b8a20d480306981f68eae?s=48 anran99
2
420
Figmaを学ぶ会Vol.2プロジェクトメンバー全員が幸せになるFigmaプロジェクト管理術
31959fb2d8d72f6cbf96a13e17107ff8?s=48 kuritagit
0
220

Featured

See All Featured
Robots, Beer and Maslow
9375a9529679f1b42b567a640d775e7d?s=48 schacon
152
7.1k
What the flash - Photography Introduction
5ce91fa49a613cbc3e20d5f96856473f?s=48 edds
61
9.8k
A Tale of Four Properties
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
149
20k
Learning to Love Humans: Emotional Interface Design
5f50f94346fbcb23706f0707169317a4?s=48 aarron
261
37k
The MySQL Ecosystem @ GitHub 2015
Be9caeb9d4ef9944d151af909063ed6e?s=48 samlambert
238
11k
The World Runs on Bad Software
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
PRO
56
5.2k
Rebuilding a faster, lazier Slack
C0b42577cfc2b321be3474618107e933?s=48 samanthasiow
62
7.2k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
B3d6434763caa0ef5dc4b792662c49f7?s=48 smashingmag
237
19k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
D8fc2580cfaca035f666d9e4ee79a7f7?s=48 mongodb
29
4.3k
The Brand Is Dead. Long Live the Brand.
A415db3ac9e9668acbc1fb36eead84ac?s=48 mthomps
45
2.7k
Designing on Purpose - Digital PM Summit 2013
7653c7c449918ff6542880a8c284f5e7?s=48 jponch
106
5.6k
Designing Experiences People Love
1b75d89772b7eea1f6c89fbf362607d9?s=48 moore
130
22k

Transcript

  1. 2021.1.29 WP Zoom UP #57 @mjmjsachi ϒϩοΫΤσΟλʔͰ ͸͡ΊΔΞΫηγϏϦςΟ

  2. ߴ஌ࡏॅ ϑϦʔϥϯεσβΠφʔ ҹ࡮෺ʴ΢Σϒ @mjmjsachi ؒౢࠫ஌

  3. ͸͡Ίʹ

  4. ϒϩοΫΤσΟλʔ ࢖ͬͯ·͔͢ʁ 2

  5. *OUSPEVDJOH8PSE1SFTT#FCP

  6. Ͳ͏ͯ͠΢ΣϒͰ ൃ৴͢Δͷʁ 2

  7. ΑΓଟ͘ͷਓʹ ৘ใΛಧ͚ΔͨΊ "

  8. ୭Ͱ΋ੈքʹ޲͚ͯൃ৴Ͱ͖Δ ϒϩοΫΤσΟλʔͰ͞Βʹࣗ༝ʹ Power of WEB ൃ৴͢ΔՄೳੑ

  9. ୭Ͱ΋޷͖ͳ࣌ʹ޷͖ͳ৔ॴͰ ޷͖ͳܗࣜͰ৘ใΛಘΒΕΔ Power of WEB ड͚औΔՄೳੑ

  10. εΫϦʔϯϦʔμʔ ఺ࣈσΟεϓϨΠ  ֦େπʔϧ ϋΠίϯτϥετදࣔ ࣈນ ΩʔϘʔυૢ࡞ ຋༁πʔϧ Ϣʔβʔʷར༻؀ڥ

  11. ୭΋͕৘ใʹΞΫηεͰ͖Δ ΞΫηγϏϦςΟ Access + ability ՄೳੑΛ࠷େԽ͢ΔͨΊʹ

  12. WordPress ͱ ΞΫηγϏϦςΟ

  13. IUUQTNBLFXPSEQSFTTPSHBDDFTTJCJMJUZIBOECPPL

  14. All new or updated code released in WordPress must conform

    with the Web Content Accessibility Guidelines 2.1 at level AA. ʠ ʡ

  15. *OUSPEVDJOH5XFOUZ5XFOUZ0OFc.BLF8PSE1SFTT$PSF

  16. None

  17. 8PSE1SFTTຊମ ςʔϚ ίϯςϯπ

  18. ϒϩοΫΤσΟλʔ ʷ ΞΫηγϏϦςΟ

  19. ݟग़͠Λ͚ͭΑ͏ ϙΠϯτ⁞

  20. ৽͍͠ηΫγϣϯΛ঺հ͠ ίϯςϯπΛ੔ཧ͢Δ͜ͱͰɺ ๚໰ऀ ʢ͓ΑͼݕࡧΤϯδϯʣ ͷ ίϯςϯπߏ଄ཧղͷखॿ͚Λ ͠·͠ΐ͏ɻ

  21. None

  22. H1ɹಈ෺ʢλΠτϧʣ H2ɹ੸௣ಈ෺ H3ɹڕྨ H3ɹ྆ੜྨ H3ɹᗡ஬ྨ H3ɹௗྨ H3ɹᄡೕྨ H4ɹώτ H4ɹͿͨ (H1)

    H2 H3 H4 H5 H6

  23. ݟग़͠ͱ จॻߏ଄

  24. None
  25. None

  26. ୅ସςΩετΛ͚ͭΑ͏ ϙΠϯτ 

  27. None

  28. ୅ସςΩετʹ͸ ը૾ͱ౳Ձͳ಺༰Λ ը૾ͱஔ͖׵͑ͯ΋աෆ଍͕ͳ͍

  29. ͜;ͨͷҭͯํ ͜Ϳͨͷҭͯํ ྫɿը૾ͷதʹจࣈ͕͋Δ

  30. ద੾ͳ୅ସςΩετ͸ ը૾͕࢖ΘΕ͍ͯΔจ຺΍ ໨తʹΑͬͯมΘΔ

  31. Ϳͨͷஔ෺ ྫɿྡ઀͢ΔςΩετ͕͋Δ Ϳͨͷஔ෺

  32. ྫɿྡ઀͢ΔςΩετ͕͋Δ Ϳͨͷஔ෺ ਖ਼໘ͷࣸਅɿϐϯΫͷ ؙ͍ମʹͭͿΒͳಏͱ ୹͍଍ɻ

  33. "OBMU%FDJTJPO5SFFc8"*8FC"DDFTTJCJMJUZ5VUPSJBMT

  34. ୅ସςΩετܾఆπϦʔʛ4"8"%"45"/%"3%%&4*(/

  35. จࣈͱഎܠͷ৭ʹ ؾΛ͚ͭΑ͏ ϙΠϯτ⁠

  36. None

  37. ίϯτϥετΛ֬อ͠Α͏ Ϣʔβʔͷࢹྗ΍Ӿཡ؀ڥ͸༷ʑ จࣈ৭ͱഎܠ৭ͷ໌Δ͞ͷࠩ

  38. 1.ݟग़͠Λ͚ͭΑ͏ 2.୅ସςΩετΛ͚ͭΑ͏ 3.จࣈͱഎܠͷ৭ʹؾΛ͚ͭΑ͏

  39. ͍͞͝ʹ

  40. ΞΫηγϏϦςΟ͸ ʮରԠ͢Δʯ ΋ͷͰ͸ͳ͘ ߴΊΔ΋ͷ ʠ ʡ גࣜձࣾίϯηϯτɹ⁋উར͞Μ

  41. ϒϩοΫΛੵΈ্͛ΔΑ͏ʹ

  42. ͋Γ͕ͱ͏͍͟͝·ͨ͠ Enjoy Block Editor & Accessibility!