Accessibility for designers
Mind your RGB’s
I began this year with the objective of learning more about accessibility, particularly as it pertains to design. So, at SXSW 2014 I attended as many workshops and talks on accessibility as I could:
Accessibility: Make it happen! by Carol Gibson & Susan Hewitt
Mobile Accessibility & 508 Compliance for Gov by Jordan Sheckman
For those less familiar with the concept of accessibility it comes down to understanding that the web is for everyone. It is easy to put on your blinders and think of your user as someone sitting at a desk with a high-res monitor and a mouse. While that may in fact be the majority of your users, you need to also take into account the needs of physically and cognitively impaired users as well as those in less-than-ideal situations (e.g. outside, low-res display, etc.). Here are a few quick tips with a focus on color. According to the W3C, interfaces, navigation and information must be:
Operable
This principle is almost entirely about alternative forms of input other than a mouse. Ensure your experience can be navigated and understood using a keyboard.
Understandable
The user must be able to read and understand the content as well as the overall structure of the website/experience. This principle is also very much about avoiding, understanding and correcting errors.
Perceivable
This is where I will focus because I recently ran into problems with a redesign I was working on. This principle is mostly about providing enough color contrast between the foreground and the background (in most cases, the foreground will be text). While redesigning an experience within my product at work I took a step back to do a quick audit on color contrast ratios using WebAIM.
To my surprise most of the new core colors we were implementing failed WCAG AA and AAA contrast ratios. Overall over 60% of our contrast ratios failed; this was a huge blow as it meant we needed to rethink our entire color palette. We are still working through the issues but we are glad we caught it early with such a quick and simple audit. It can be very easy as a designer to want to use color to either emphasize or de-emphasize certain elements but you need to be aware of how or even if certain subsets of your users will be able to perceive those elements.
This is an EXTREMELY high level view of accessibility. My goal was to share an anecdote about how easy it is for designers to do a quick accessibility gut-check. For those entrenched in this world, this may seem over-simplified and for those new to it, this is certainly not enough information. For the latter, here are some great resources to get started:
