Web Accessibility with Joe Dolson

Another weekend of WordCamp MPLS has come and gone, and as always, it was a huge success! On Sunday, I was able to attend a great presentation on web accessibility by Joe Dolson. The presentation shed some important light on how terrible and difficult navigating the web can be for someone with a disability.

As developers, we’re inclined to create experiences for our users that are almost automated. In our minds, when a user hovers on a certain area, A,B and C should then automatically occur so the user doesn’t need another point of interaction. This is great, until you consider the impact it may have on users who are unable to use a mouse or keyboard. This is where accessibility awareness comes in.

Here are a number of key takeaways from Joe’s presentation and things to consider when developing with accessibility in mind:

• Use labels on all input elements
• Use buttons for events
• Do not trigger events without an interaction
• Move focus if interaction point has changed (modals, overlays, etc.)
• Use aria-live on elements where the DOM changes
• Use ajax on forms with validation so user does not “jump to top” on refresh
• Do not “hide” content by pulling it “off screen”
• Avoid event delegations like (onMouseOut, onKeyUp)
• Avoid automatic changes like (onSelect, onChange)

For reference, below are Joe’s presentation slides. We applaud him for donating his time and giving a great presentation at WordCamp this year.

Next time you do an estimate for a client, consider accessibility in your quote. Some of the takeaways above do not even take additional time, but rather, just require being aware of how keyboards, mice and screen readers respond to elements.

For a more in-depth look at the four principles of web accessibility, see our previous blog post.