React Round Up
RRU 098: Accessibility Made Easy with Brittany Feenstra
Brittany is a software engineer for Formidable Labs. She’s a team lead for some client work and likes to poke around in their open-source stuff in her free time. Last year she gave a talk at ReactConf called ‘Accessibility is a Marathon, Not a Sprint’. She talks about her background and how she came to specialize in accessibility. Brittany believes there are a lot of small things you can do to make your website more accessible, and that following best practices in accessibility makes the website easier to navigate for the able-bodied as well. She emphasizes that having accessibility in mind from the get-go will make your website more organized overall and that making things more accessible is as easy as starting with semantic HTML. Brittany and Charles discuss the moral responsibility for businesses to make their website accessible and whose responsibility it is to enforce accessibility. Brittany feels that accessibility really isn’t that hard, but people just don’t know what it looks like or where to get started.
Brittany shares some methods to improve accessibility that take very little extra effort. One of the best things you can do is use semantic HTML. To learn things like what is a header, footer, article tag, etc. is, she advises listeners to consult the documents. She talks about the importance of a good pull request and even enlisting coworkers to help you to remember to use these accessibility-friendly methods. Charles and Brittany talk about using heading outline extensions to help you see what content is getting scraped off your site. Once semantic HTML is in place, they suggest testing to see if your site works with accessibility tools like screen readers, or if you can navigate with just a keyboard. They talk about different extensions that mimic visual impairments to ensure your pages are readable. The show concludes with Brittany talking about how this all ties into React.
Panelist
Charles Max Wood
Guest
Brittany Feenstra
Sponsors
NxPlaybook.com - Use code ‘NXDEVCHAT’ for 50% off the official https://nx.dev/React Advanced Workspaces course!
Sentry | Use the code “devchat” for $100 credit
____________________________
> "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is now available on Amazon. Get Your Copy Today!
____________________________________________________________
Links
Formidable Labs
Accessibility is a Marathon, not a Sprint
Deaf man sues Pornhub over lack of captions
HTML elements reference
Eslint-plugin-jsx-a11y-npm
headingsMap for Chrome
headingsMap for Firefox
Marcy Sutton
noCoffee
Color contrast analyzer
Writing Automated Tests for Accessibility
Lighthouse
Axe by Deque
JSJ 344: Inclusive Components with Heydon Pickering
Picks
Brittany Feenstra
Follow Brittany on Twitter
Inclusive Components by Hendon Pickering
Becoming by Michelle Obama
Charles Max Wood
The Name of the Wind
Group coaching course for finding jobs and staying current
devchat.tv/workshops