ウェブディレクタ`のための Web A11Y 茶氏 (Season 2) #06
?
0 likes?158 views
ウェブ崙恬氏芙のディレクタ`さんを鵑砲靴拭▲▲セシビリティ茶氏です。(畠12指コ`スの及6指) 念磯で WCAG 2.0 _撹児 (レベルAA) を僥び、瘁磯で仝インクル`シブなペルソナ々シ`トを喘いた UI uワ`クショップを佩なっています。 インクル`シブなペルソナ : https://github.com/caztcha/Inclusive-Persona-Extension
![[喘Z ] _撹児 3.3.3 エラ`俐屎の戻宛
秘薦エラ`
ユ`ザ`が秘薦した秤鵑如▲轡好謄爐鞭け原けられないもの。](https://image.slidesharecdn.com/weba11yseminars206-180921131818/85/Web-A11Y-Season-2-06-9-320.jpg)
![[まとめ] _撹児 3.3.3 エラ`俐屎の戻宛
¢ユ`ザ`が秤鵑鯣訌Δ掘△修糧訌Δ鬟轡好謄爐鞭け原けられない栽、俐屎圭隈をユ`
ザ`に戻宛しましょう。
?_撹児 3.3.1 仝エラ`の蒙協々(レベル A) では、エラ`w侭 (どこに音笋あるの
か) とエラ`坪否 (どんな音笋あるのか) をアクセシブルな侘でユ`ザ`に擦
ることが箔められていますが、この_撹児 3.3.3 では、さらに匯iMんで、仝どう
俐屎すればよいか拭垢鬟罘`ザ`に戻宛することが箔められています。
? 秘薦フォ`マットの箭幣
? 秘薦､旅譴籌銅sのh苧
? 俐屎昨aの戻幣 (オ`トサジェスト)
? ´など](https://image.slidesharecdn.com/weba11yseminars206-180921131818/85/Web-A11Y-Season-2-06-10-320.jpg)
![[喘Z] _撹児 3.3.4 エラ`指閲 (隈議、署蛮、デ`タ)
秘薦エラ`
ユ`ザ`が秘薦した秤鵑如▲轡好謄爐鞭け原けられないもの。](https://image.slidesharecdn.com/weba11yseminars206-180921131818/85/Web-A11Y-Season-2-06-12-320.jpg)
![[まとめ] _撹児 3.3.4 エラ`指閲 (隈議、署蛮、デ`タ)
¢隈舵佩 (弐sのY) や署蛮函哈 (Qg)、嶷勣なデ`タのユ`ザ`によるｼなど、
嶷寄なY惚につながる辛嬬來のある秤鵑里笋蠅箸蠅砲いては、參和のいずれかを毅
隠しましょう。
?僕佚の函りし、または俐屎。
?秘薦rの、エラ`チェックと俐屎。
?僕佚念の、秘薦秤鵑隆_Jと俐屎。](https://image.slidesharecdn.com/weba11yseminars206-180921131818/85/Web-A11Y-Season-2-06-13-320.jpg)
![? WCAG 2.1 とは
? WCAG 2.1 仟_撹児覆鰌iむ
? 1.3.4 Orientation (AA) [モバイル]
? 1.3.5 Identify Input Purpose (AA) [J岑/僥]
? UI ケ`ススタディ
肝指から、WCAG 2.1 で仟た
に弖紗された_撹児
(レベル A、AA) を僥びます。](https://image.slidesharecdn.com/weba11yseminars206-180921131818/85/Web-A11Y-Season-2-06-22-320.jpg)
ウェブディレクタ`のための Web A11Y 茶氏 (Season 2) #06
- 1. ウェブディレクタ`のための? Web A11Y 茶氏? Season 2 #06 (2018-09-20)
- 2. 徭失B初 @caztcha ? ウェブユ`ザビリティ / アクセシビリティ / 秤鵐〒`キテクチャ (IA) HCD-Net J協 繁g嶄伉OT社 ウェブアクセシビリティ児P溜T氏 (WAIC) 鍬Uワ`キンググル`プ https://website-usability.info
- 3. 書晩のメニュ` ? WCAG 2.0 (Level AA) をiもう ? 3.3.3 エラ`俐屎の戻宛 ? 3.3.4 エラ`指閲 (隈議、署蛮、デ`タ) ? UI ケ`ススタディ これで、 WCAG 2.0 レベル AA の_撹児覆呂垢戮 iみKわります
- 4. WCAG 2.0 (Level AA) をiもう
- 5. WCAG (Web Content Accessibility Guidelines) の児云撹 圻t (4) ガイドライン (12) _撹児 (61) 1. 岑辛嬬 (Perceivable) 2. 荷恬辛嬬 (Operable) 3. 尖盾辛嬬 (Understandable) 4. 埓 (Robust) 3つのレベルに蛍かれている ? A (シングルエ`) ? AA (ダブルエ`) ? AAA (トリプルエ`) おさらい
- 6. 圻t 3. 尖盾辛嬬 (Understandable) 秤鷦阿咼罘`ザインタフェ`スの荷恬は尖盾辛嬬でなければならない。 おさらい
- 8. _撹児 3.3.3 ? エラ`俐屎の戻宛 秘薦エラ`が徭啜弔奮され、俐屎圭隈を戻宛できる栽、その戻宛が旋喘 宀に戻幣される。ただし、セキュリティ嗽はコンテンツの朕議をpなう栽は 茅く。(レベル AA) _撹児 3.3.3 を尖盾する | WCAG 2.0盾h https://waic.jp/docs/UNDERSTANDING-WCAG20/minimize-error-suggestions.html
- 9. [喘Z ] _撹児 3.3.3 エラ`俐屎の戻宛 秘薦エラ` ユ`ザ`が秘薦した秤鵑如▲轡好謄爐鞭け原けられないもの。
- 10. [まとめ] _撹児 3.3.3 エラ`俐屎の戻宛 ¢ユ`ザ`が秤鵑鯣訌Δ掘△修糧訌Δ鬟轡好謄爐鞭け原けられない栽、俐屎圭隈をユ` ザ`に戻宛しましょう。 ?_撹児 3.3.1 仝エラ`の蒙協々(レベル A) では、エラ`w侭 (どこに音笋あるの か) とエラ`坪否 (どんな音笋あるのか) をアクセシブルな侘でユ`ザ`に擦 ることが箔められていますが、この_撹児 3.3.3 では、さらに匯iMんで、仝どう 俐屎すればよいか拭垢鬟罘`ザ`に戻宛することが箔められています。 ? 秘薦フォ`マットの箭幣 ? 秘薦､旅譴籌銅sのh苧 ? 俐屎昨aの戻幣 (オ`トサジェスト) ? ´など
- 11. _撹児 3.3.4 ? エラ`指閲 (隈議、署蛮、デ`タ) 旋喘宀にとって隈舵佩蕕發靴は署蛮函哈が伏じる、旋喘宀が崙囮辛嬬なデ`タストレ`ジ システム貧のデ`タを筝もしくは茅する、嗽は旋喘宀がYの盾基を僕佚するウェブペ` ジでは、肝にい欧詈瀧のうち、富なくとも匯つを困燭靴討い: (レベル AA) 1. 函: 僕佚を函りすことができる。 2. チェック: 旋喘宀が秘薦したデ`タの秘薦エラ`がチェックされ、旋喘宀には俐屎する C氏が戻工される。 3. _J: 僕佚を頼阻する念に、旋喘宀が秤鵑厘岷し、_J式び俐屎をするメカニズムが 旋喘できる。 _撹児 3.3.4 を尖盾する | WCAG 2.0盾h https://waic.jp/docs/UNDERSTANDING-WCAG20/minimize-error-reversible.html
- 12. [喘Z] _撹児 3.3.4 エラ`指閲 (隈議、署蛮、デ`タ) 秘薦エラ` ユ`ザ`が秘薦した秤鵑如▲轡好謄爐鞭け原けられないもの。
- 13. [まとめ] _撹児 3.3.4 エラ`指閲 (隈議、署蛮、デ`タ) ¢隈舵佩 (弐sのY) や署蛮函哈 (Qg)、嶷勣なデ`タのユ`ザ`によるｼなど、 嶷寄なY惚につながる辛嬬來のある秤鵑里笋蠅箸蠅砲いては、參和のいずれかを毅 隠しましょう。 ?僕佚の函りし、または俐屎。 ?秘薦rの、エラ`チェックと俐屎。 ?僕佚念の、秘薦秤鵑隆_Jと俐屎。
- 14. UI ケ`ススタディ
- 16. 1. 光徭、それぞれ1旦、お挫きな仝ペルソナシ`ト々をxびます。 2. xんだシ`トのQ泣に羨って、鵐擧`ジを聞ってみましょう。 3. ひとことずつ、仝櫃鼎々をk燕してください。 ? 答登 (¢¢ができていないからアクセシビリティ議に音) ではなく。 ? こうすれば、こういう旋喘彜rを隔つユ`ザ`の悶Yが鯢呂垢襪里任錬 という徊櫃如 ? 醤悶議な個鋲圭隈がわからなくても仝なんとなくここが櫃砲覆襦垢任 OK です。
- 17. ツ`ルB初WAVE アクセシビリティ編^ツ`ルです。竃しレベルや鮫颪隆紋テキストなど、朕にえない 勣殆 (嬾墾宀にとって寄俳な勣殆) も_Jできます。https://wave.webaim.org/
- 18. ツ`ルB初NoCoffee Vision Simulator ロ`ビジョン (樋) や弼蒙來に育う仝えにくさ々を？なパラメ`タ`でシミュレ` ションできる Chrome C嬬です。 https://chrome.google.com/webstore/detail/nocoffee/jjeeggmbnhckmgdhmgdckeigabjfbddl
- 21. 肝指嚠御
- 22. ? WCAG 2.1 とは ? WCAG 2.1 仟_撹児覆鰌iむ ? 1.3.4 Orientation (AA) [モバイル] ? 1.3.5 Identify Input Purpose (AA) [J岑/僥] ? UI ケ`ススタディ 肝指から、WCAG 2.1 で仟た に弖紗された_撹児 (レベル A、AA) を僥びます。
- 23. To be continued´