You’re wrapping up a web project and just as you’re putting the finishing touches you get sent a list of accessibility errors forwarded to you by your project manager. Inadequate color contrast. Missing alt tags. This interactive component needs to be keyboard accessible.
We might not like to admit it but we’ve all been there: at the end of a project trying to reverse engineer accessibility into our site. It’s frustrating for developers, designers, project managers and clients.
While accessibility can be frustrating, you can set yourself, your team, and your client up for success by planning for accessibility from the beginning. Here are four techniques to save you time and trouble when building accessible JavaScript-enabled websites and applications.
1. Use the <button> element for anything that users click on.
In general, using semantic HTML elements will be a boon to the accessibility of your web project. When working with interactivity, the <button> is the semantic tag for things users are clicking on that aren’t links or other inputs. It is a semantic way to denote that an element is clickable and will be your new best friend.
The HTML
<button>element represents a clickable button.
