If you’re building a product for the web that has a user interface as a feature, (and let’s face it, most of them do), you may be tempted to build your own custom UI elements.
Don’t do that.
For one thing, you’re reinventing a wheel that’s worked well now for a very long time. For another, you’re creating more work for yourself. And finally, it’s bad for accessibility, which effects a lot of users, and I don’t just mean blind ones.
The following video illustrates what can go wrong when you decide to reinvent the UI elements wheel.
If I shouldn’t build my own elements, what can I do instead?
The easiest way to get accessible UI elements is to use already-existing elements under the hood. HTML already provides the elements you’ll need, (radio buttons, checkboxes, comboboxes, and the like), and if you opt for already-existing elements instead of building your own, you’ll be saving yourself a lot of time, and you’ll be working smarter, not harder, to build your application. Which means you can shove it out the door faster, make a lot of people happy, and probably save some money too. What’s not to love.
so the next time you’re tempted to build your own elements, ask yourself:
- What am I gaining by building a custom element that I wouldn’t get by using an already-existing one?
- If I build custom elements, I may be making my application or plugin harder to use for non-developers. Are all the extra support questions and complaints worth it?
- I’m spending more time, and therefore more money, on my project because I’m building custom elements. Is the extra cost worth it?
I think, if you keep these questions in mind when starting to build your user interface, and if you answer them the way I think you will, you’ll have enough justification for sticking with what works before you even bring accessibility into the picture. And if you are inclined towards making the web a better place for everyone regardless of ability, that then becomes icing on the cake.
A Second Opinion
I recommend we do not phrase accessibility as something antithetical to what many developers do regularly. I try not to tell developers to deviate from their existing practice, but instead try working with them on improving their existing methodologies to make their creations more inclusive to all audiences. If any developers are interested, I am happy to discuss when custom UI components are appropriate, and how to then make them fully inclusive. Semantic markup, reuse of existing controls, and adherence to solid web development principles are great things to keep in mind when developing novel interfaces. When the need and desire for innovation arises, it is important to realize that new interfaces have the same potential to be fully accessible as current native ones, but it takes a little bit of extra work. I’m happy to discuss further. You can reach me at @SinaBahram on Twitter or
via any other means found at my contact page.
If any other accessibility authorities wish to add their opinions, feel free to ping me and I’ll be happy to add those as well.