- 28WTF are Accessible Design Patterns?1m 44s
WTF are Accessible Design Patterns?
Although elements that are natively keyboard accessible should be used when possible, there are times when HTML falls short and custom "widgets" are necessary. Complex menus, sliders, dialogs, tab panels, etc. must all be built to support keyboard and screen reader accessibility.
Widget behavior expectations
- For more complex widgets there are expectations by keyboard and screen reader users as to how these specific widgets will behave and can be navigated
- Interactions must be intuitive and predictable
- Events triggered by mouse clicks should also be able to be triggered via keyboard
- The state of the widget should always be clear
References
- https://www.w3.org/TR/wai-aria-practices-1.1/#aria_ex
- https://inclusive-components.design/
- https://a11yproject.com/patterns/
- https://webaim.org/techniques/keyboard/
Eddie Henrique
~ 5 years ago
Amazing, I also agree that focus on the tittle sometimes is a much better user experience than focusable elements. Thank you very much for this !
Erin Doyleinstructor
~ 5 years ago
I also agree that focus on the tittle sometimes is a much better user experience than focusable elements.
Thank you! And to back up my assertion here's why I think that focusing on the title can be a better experience in some scenarios: https://www.gatsbyjs.org/blog/2019-07-11-user-testing-accessible-client-routing/