About accessible components
I set myself on the quest of being more inclusive in my web development. This starts by making sure everyone can use and profit from the websites I build.
2 min read
August 8, 2020
What I know
This will be short. I basically know nothing. Not exactly nothing as I do have some basic. But I don't know enough. Not enough for building an accessible website. And by that, I mean a truly accessible website. Have you ever used a screen reader? I know I never did. At least not on purpose. Keyboard smashing? Anyone?
Do I test what I develop with a screen reader? Nope ❌
Do I make sure what I develop is accessible? Never ❌
Will I work to improve that aspect of my work? Yep ✅
Should this be as important as responsiveness? Sure ✅
Better mindset
I recently built a little website. It's nothing really, but it's a place where I learn to use TailwindCSS. It's built with Next.js and is hosted on Netlify. While I worked on that project, I started to build a bunch of basics components; titles, nav, buttons, etc.
I started working on a little `tooltip` component. While working on it my mind drifted a bit :
How should I write this component for it to make sense for search engines?
That's a normal reflex, isn't it? Performance, responsiveness and SEO are classic concerns for a frontend engineer. Then, something else came to my mind. How would I make it work with a screen reader? And that's it. Pandora's box was opened. A whole new part of my job was brought to my attention.
Room for improvements
So, how should I build this component? The answer is not simple. Not at all. In fact, at this very moment, I still don't know how to make it. I toyed with some ideas and found one of the many resources that will help me in my learning process (here 👈).
Here is my plan:
- I have to learn about how people with a wide range of disabilities use the web. This includes learning how to use a screen reader
- Learn about accessibility and the best practices.
- Keep building new components and learning how to make them fully accessible.
- Write about it. Learning in public is something I want to more often. I'll write about my progress here.