React Round Up

React Round Up


RRU 098: Accessibility Made Easy with Brittany Feenstra

February 04, 2020

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