D&D and Accessibility

Hullo, adventurer! All of us who work with UI can probably do with levelling up a little in Accessibility. We'll apply Strength, Dexterity, Constitution, Intelligence, Wisdom, and Charisma to the front-end and check out what skills support each stat.

Please note: no existing knowledge of dungeons, dragons, or the combination of the two, is required for this talk.

---

Talk given at https://www.codecampwellington.nz/ on Saturday 15th April 2023

Transcript

1. D&D ! and Accessibility Steve Barnett, naga.co.za (FED who does) Accessibility at Xero
2. All of us who work with UI can probably do with levelling up a little bit in Accessibility (Search for "The WebAIM Million")
3. An adventurer doing web accessibility can up their Dexterity by testing with the keyboard (This will make (more) sense in about 7 minutes time)
5. D&D has six Ability scores / stats: Strength, Dexterity, Constitution, Intelligence, Wisdom, Charisma
6. !
7. Strength is being able to crush a tomato ! "
8. Dexterity is being able to dodge a tomato ! "
9. Constitution is being able to eat a bad tomato (and not get sick) ! "
10. Intelligence is knowing that a tomato is a fruit ! "
11. Wisdom is not putting a tomato in a fruit salad ! "
12. Charisma is being able to sell a tomato-based fruit salad ! "
13. !
14. What do these six mean for an adventurer doing web accessibility? What are the skills that support each stat?
15. (Accessibility) Strength is about doing. Use standard controls.
16. (Accessibility) Dexterity is about flexibility. Test with just the keyboard.
17. (Accessibility) Constitution is about persistence. Offer feedback one step earlier.
18. (Accessibility) Intelligence is about wide knowledge. Understand the accessibility tree. Name, role, value (and state)
19. (Accessibility) Wisdom is about deep knowledge. Think non-binary. Abilities can change permanently, temporarily, or contextually.
20. (Accessibility) Charisma is about persuasion. Celebrate good accessibility.
21. An adventurer doing web accessibility can up their Dexterity by testing with the keyboard
22. Thank you! ! Slide deck: ! ! with post-credits scene
23. Post-credits scene: the longer versions (of "What might these look like for an adventurer doing web accessibility?")
24. (Accessibility) Strength This is about doing. • Use standard controls • Write semantic HTML • Linting, Automated Tests
25. (Accessibility) Dexterity This is about flexibility. • Test with just the keyboard • Test with axe browser extension • Test with Screen Readers
26. (Accessibility) Constitution This is about persistence. • Shift Left • Offer feedback to design • Choose accessibility as a priority
27. (Accessibility) Intelligence This is about wide knowledge. • Understand the accessibility tree • Understand ARIA • Know the Standards
28. (Accessibility) Wisdom This is about deep knowledge. • Think non-binary • Go off The Happy Path • Avoid barriers to access
29. (Accessibility) Charisma This is about persuasion. • Offer good motivations • Be ready for objections • Celebrate good accessibility
30. Post-post-credits scene: The WebAIM Million My write-up on it: the bad news, the good news, and what-you-can-do(s)