july 30, 2020 - amazon web services

Designing Accessibility Curriculum: A Case StudyJuly 30, 2020

Closed captions:https://streamtext.net/player?event=Treehouse_Festival

Anwar MontasirSoftware Development Instructor, Treehouse

https://linkedin.com/in/anwarmontasir/

Anwar Montasir - Designing Accessibility Curriculum: A Case Study

https://linkedin.com/in/anwarmontasir/

Background.

I have taught web development and design since 2002.


Was web accessibility part of your formal schooling?


Was web accessibility part of your formal schooling?


Source: https://webaim.org/projects/practitionersurvey2/

https://webaim.org/projects/practitionersurvey2/

Conclusion: schools aren’t teaching accessibility.


Source: Microsoft Inclusive Design 101 Toolkit

Even though disabilitycan happen to anyoneat any time.

https://download.microsoft.com/download/b/0/d/b0d4bf87-09ce-4417-8f28-d60703d672ed/inclusive_toolkit_manual_final.pdf

Conclusion: schools aren’t teaching accessibility.


Despite one successful lawsuit

https://www.cnbc.com/2019/10/07/dominos-supreme-court.html



Conclusion: schools aren’t teaching accessibility.Despite one successful lawsuitafter another



https://www.theatlantic.com/technology/archive/2015/04/does-the-ada-apply-to-online-spaces-too/390654/



Conclusion: schools aren’t teaching accessibility.Despite one successful lawsuitafter anotherafter another





https://pitchfork.com/news/beyonces-website-violates-americans-with-disabilities-act-lawsuit-claims/



Conclusion: schools aren’t teaching accessibility.Despite one successful lawsuitafter anotherafter anotherafter another







https://www.forbes.com/sites/sarahkim/2019/11/29/harvard-university-national-assoc-of-the-deaf-lawsuit/#a0184cf66997



Conclusion: schools aren’t teaching accessibility.Despite one successful lawsuitafter anotherafter anotherafter anotherafter another









https://www.3playmedia.com/2017/09/14/take-away-fedex-targets-accessibility-lawsuit/



Conclusion: schools aren’t teaching accessibility.Despite one successful lawsuitafter anotherafter anotherafter anotherafter anotherafter another












Conclusion: schools aren’t teaching accessibility.Despite one successful lawsuitafter anotherafter anotherafter anotherafter anotherafter anotherafter another.











https://www.adatitleiii.com/2019/01/number-of-federal-website-accessibility-lawsuits-nearly-triple-exceeding-2250-in-2018/

https://www.adatitleiii.com/2019/01/number-of-federal-website-accessibility-lawsuits-nearly-triple-exceeding-2250-in-2018/


And this keeps happening:

https://slate.com/technology/2020/06/twitter-voice-tweets-accessibility.html

https://twitter.com/jaivirdi/status/1273491802532843520

How do we get better?

Empathy isn’t enough.


I based my script draft for“Accessibility For UX Designers”on empathy for disabled usersplus the WCAG guidelines.

https://www.w3.org/TR/WCAG21/

Empathy isn’t enough.


I based my script draft for“Accessibility For UX Designers”on empathy for disabled usersplus the WCAG guidelines.

But I don’t depend on assistive technology.

https://www.w3.org/TR/WCAG21/


Meet Jennifer, Ricardo, and Nina.All three use assistive technology.

https://www.linkedin.com/in/ricardo-rodriguez-8367a255/

https://www.linkedin.com/in/jnordell/

https://www.linkedin.com/in/ninaktran/


Meet Jennifer, Ricardo, and Nina.Together, they challenged what I thought I knew about accessible design.

https://teamtreehouse.com/library/accessibility-for-ux-designers-2

https://teamtreehouse.com/library/accessibility-for-ux-designers-2

Definitions.

Accessible Design, Inclusive Design, Universal Design


Are they the same?

Accessible Design


Source: The Accessible Icon Project

Accessible design

http://accessibleicon.org/



Accessible Design


The curb-cut effect means that accessible design often has universal benefits.

Inclusive Design


Inclusive design

Accessible design

Source: UX Collective

https://uxdesign.cc/some-thoughts-on-inclusive-and-responsible-design-5a9b47954f98

https://uxdesign.cc/some-thoughts-on-inclusive-and-responsible-design-5a9b47954f98

Universal Design


Source: Misumi Mech Lab

https://blog.misumiusa.com/one-for-all-universal-design/



Language.

Identity-first? Person-first?


Disabled person is identity-first language. Person with disabilities is person-first language.

“Many people have a disability but don’t identify as disabled”

–Lauren Isaacson, “Inclusive Research”

https://noti.st/curioresearch/ucoOHl

Deafness as a language minority.


Deafness is a communication barrier, not an impairment.

“Hearing-impaired” is an offensive term. Use “d/Deaf” or “hard of hearing”.

d/Deaf vs. Hard of Hearing


● Deaf: actively engaged within Deaf community,uses sign language.

● deaf: not connected to the Deaf community, communicates orally.

● Hard of hearing: mild to moderate hearing loss.Source: Gemma Matheson, “The Difference

Between d/Deaf and Hard of Hearing”

https://blog.ai-media.tv/blog/the-difference-between-deaf-and-hard-of-hearing

https://blog.ai-media.tv/blog/the-difference-between-deaf-and-hard-of-hearing

Source: Lauren Isaacson, “Inclusive Research”

https://noti.st/curioresearch/ucoOHl#sQEycXb

Use plain language.


Source: plainlanguage.gov

https://plainlanguage.gov/examples/before-and-after/fungi-hazards/

Interfaces.

WCAG covers all digital interfaces.


Not just Web Content.

Source: archive.jsonline.com

http://archive.jsonline.com/blogs/entertainment/126401353.html



Keep interface target sizes a minimum of 44 by 44 pixels.


Source: Apple Design Dos and Dont’s

This applies to more than just touchscreen interfaces.

https://developer.apple.com/design/tips/




Source: Apple Design Dos and Dont’s

Keep interface target sizes a minimum of 44 by 44 pixels.This applies to more than just touchscreen interfaces.




Design for screen magnifiers, not just screen readers.


Source: Bureau of Internet Accessibility

Is your content legible at 200% zoom?

https://www.boia.org/blog/give-yourself-an-accessibility-test-zoom-your-page-to-200

Keyboard Navigation.

Focus indicators.


Focus indicators highlight the currently selected element.

Source: Deque

https://www.deque.com/blog/give-site-focus-tips-designing-usable-focus-indicators/




Focus indicators.

Keyboard traps.


Don’t leave your keyboard-only audience stuck.

Source: Interactive Accessibility

https://interactiveaccessibility.com/education/training/ex7.1.html

Support keyboard shortcuts.


Keep shortcuts easy to learn

and documentation easy to find.

Source: Mac Accessibility Shortcuts

https://support.apple.com/en-us/HT204434

Forms.

Reduce cognitive load.


● Minimize number of questions per screen.

● Remind user of the form’s purpose.

● Clearly label form inputs. Source: designmodo.com

https://designmodo.com/checkout-form/

Avoid unnecessary questions.


If it’s not obvious why you need the information,

don’t ask.

Source: UX Collective

https://uxdesign.cc/designing-forms-for-gender-diversity-and-inclusion-d8194cf1f51

Make required fields obvious.


Careful what you require!

Active vs inactive links.


Low-vision users still benefit from seeing your inactive links.

Use placeholder text cautiously.


Don’t let your Input labels disappear.

Source: Smashing Magazine

https://www.smashingmagazine.com/2018/08/best-practices-for-mobile-form-design/

https://www.smashingmagazine.com/2018/08/best-practices-for-mobile-form-design/


Source: CSS Tricks

Use placeholder text cautiously.Don’t let your Input labels disappear.

https://css-tricks.com/input-masking/



Videos.

Avoid sounds that autoplay.


Should your videos start automatically?



Avoid sounds that autoplay.


Will your videos start automatically?



https://developers.google.com/web/updates/2017/09/autoplay-policy-changes

https://hacks.mozilla.org/2019/02/firefox-66-to-block-automatically-playing-audible-video-and-audio/

Captions: not just for deaf and hard of hearing audiences.


Source: 3PlayMedia

https://www.3playmedia.com/2020/01/17/who-uses-closed-captions-not-just-the-deaf-or-hard-of-hearing/

Captions: not just for deaf and hard of hearing audiences.


Source: Time4Learning

https://www.time4learning.com/homeschooling/special-needs/auditory-processing-disorder/

Best practices for captions.


Resources.

Accessibility Organizations


● The A11Y Project● Deque● WebAIM.org

Further Reading● Accessibility | A List Apart● Accessibility | Nielsen Norman Group● Accessibility | Smashing Magazine● Articles | Axess Lab

https://a11yproject.com/

https://www.deque.com/

https://webaim.org/

https://alistapart.com/blog/topic/accessibility/

https://www.nngroup.com/topic/accessibility/

https://www.smashingmagazine.com/category/accessibility/

https://axesslab.com/articles/

july 30, 2020 - amazon web services

Documents