Been picking @BenDMyers' brain over the last few days about accessibility. Here's some scattered thoughts and resources I've gather:
I think the industry has gotten much better at making the case for accessibility whether on moral, legal, or economic grounds.
I think the industry has gotten much better at making the case for accessibility whether on moral, legal, or economic grounds.
But we are failing new developers by providing essentially zero education in this area. In my bootcamp I was told, "We don't have time to teach you accessibility, but it'll be on your interviews so you should learn it." This wasn't very encouraging. Aria was never mentioned once.
Resources either rehash the same basic pieces of advice over and over (alt-text!!!) or provide a technical deep dive on a specification that numbers in the tens of thousands of words. To fill this gap we have bloggers like @BenDMyers @aardrian @codingchaos and @marcysutton
Colleges seem to have done a not-entirely-terrible job in developing curriculum in this area although as far as I can tell no one knows about any of it:
https://www.d.umn.edu/itss/training/online/webdesign/accessibility.html https://accessibility.psu.edu/webpagetools/
https://www.d.umn.edu/itss/training/online/webdesign/accessibility.html https://accessibility.psu.edu/webpagetools/
Common education pitfalls include:
* Introducing a11y too late
* Trying to cover everything you could ever know about a11y
* Too much theory, not enough practice
* Neglecting getting proficient at testing or finding further resources
* Too much focus on compliance/lawsuits
* Introducing a11y too late
* Trying to cover everything you could ever know about a11y
* Too much theory, not enough practice
* Neglecting getting proficient at testing or finding further resources
* Too much focus on compliance/lawsuits
React Aria is a library of hooks that provides accessible UI primitives for design systems.
It implements adaptive interactions to ensure the best experience possible for all users, including support for mouse, touch, keyboard, and screen readers. https://react-spectrum.adobe.com/react-aria/getting-started.html
It implements adaptive interactions to ensure the best experience possible for all users, including support for mouse, touch, keyboard, and screen readers. https://react-spectrum.adobe.com/react-aria/getting-started.html
axe-core is an accessibility testing engine for websites and other HTML-based user interfaces.
Accessibility testing can be performed as part of your unit testing, integration testing, browser testing, and any other functional testing. https://github.com/dequelabs/axe-core
Accessibility testing can be performed as part of your unit testing, integration testing, browser testing, and any other functional testing. https://github.com/dequelabs/axe-core
Along the same lines, Cypress can be used to automate accessibility testing and there is an npm library specifically for integrating Cypress with axe-core.
https://www.deque.com/blog/how-to-test-for-accessibility-with-cypress/ https://www.npmjs.com/package/cypress-axe
https://www.deque.com/blog/how-to-test-for-accessibility-with-cypress/ https://www.npmjs.com/package/cypress-axe
Grommet components can be read by screen readers.
- Default textual description varies for each component
- Description generally generic and lacking contextual information
- A property called a11yTitle enables callers to provide a better description
https://v1.grommet.io/docs/accessibility/
- Default textual description varies for each component
- Description generally generic and lacking contextual information
- A property called a11yTitle enables callers to provide a better description
https://v1.grommet.io/docs/accessibility/
Accessibility Weekly, Articles and Videos, Assistive Technology, Books, Companies and Organizations, Conferences, Courses, Development Testing and Validators, Guides, Jobs, Laws, Meetups, People to Follow, Talks, Tools, W3C Specification https://github.com/brunopulis/awesome-a11y