Because of my previous expertise as the accessibility lead at TK20, my first project at Aunt Bertha was to perform a full analysis of our site accessibility. As I began my analysis, I realized that:
- Many of the pages were unusable to people with visual impairments.
- There were no UX color or style guidelines,
- No one else on the design team had any experience considering accessibility during their design, and they weren’t designing for accessibility
- The QA team wasn’t sure how to test whether or not a page was accessible.
Since I was already going through every page in the product to test accessibility, I took the opportunity to also audit every color and every design pattern used in the system. Then I tested all our color combinations for color contrast and keyboard/screen reader usability. I documented the first comprehensive UX pattern and color guidelines at Aunt Bertha. Since the interfaces hadn’t been designed with accessibility first, there was a wide range of practices and patterns, some of which had to be redesigned completely.
After I documented and corrected the accessibility problems, my next goal was to educate the team. I held a 2 hour class for the design team on how to design with accessibility in mind, a working session with the engineering team to lay out improved accessibility practices, and developed an accessibility test plan for the QA team.
Since that team, through the hard work of the whole team, we’ve been able to maintain WCAG compliance on all user-facing parts of the site.
Before
Colors were low contrast; the page was busier; filters required a lot of scrolling; the map filled the entire above-the-fold area, wasn’t navigable by keyboard, and couldn’t be returned to while navigating results; buttons and top menu didn’t work for disabled users
After
Improved color contrast, colors are consistent across the site; display is visually simplified; filters and map switch places and map became fixed; aria tags and keyboard usability improved
