Challenge: Mccann was tasked to conduct an accessibility audit for Valero.com, DiamondGreenDiesel.com and their consumer credit card application form to meet WCAG 2.0 AA requirements.
My role: UX Design, Accessibility audit: automated/manual audit, report with findings.
Timeline: 5 months I Platform: Web I Tools: Screaming Frog, Wave, Screen reader, Keyboard navigation, Browser zoom
Others Involved: Producer
Project Outline
The snippet from report:
We checked all content against WCAG 2.0 AA.
Automated Evaluation Tools: Screaming Frog, Wave
Manual Evaluation Tools: Keyboard, Screen Reader (Safari with MAC OS VoiceOver) and Browser Zoom.
1. Keyboard testing verified that:
All interactive element receive keyboard focus
Keyboard order follows the visual flow of the page
All interactive elements can be activated
No Key board traps stops the user from navigating further on the page.
2. Screen reader testing
Linear way: went through the entire page content.
Headings: jumped from heading to heading to get an overall impression of the page.
Landmarks and page sections: navigated to the desired sections easily and quickly.
3. Zoom testing
Magnified content to 200% and 400%
Checked if the content can reflow, be readable and didn’t have any horizontal scrolling.
Identified Issues & Recommendations
We organized our recommendations based on 4 design principles of accessibility: perceivable, operable, understandable and robust.
Example from report:
Perceivable. The content of a website must make sense from the perspective of every user.
For instance: A person who is blind can listen to text alternatives for photographs.
Results and Recommended Actions
Accessibility features in which this site is strong:
Keyboard structure
Zoom content reflow
Recommended priorities for inaccessible features:
Show dropdown hidden mega menu
Enable link “Skip to main content”
Provide ALT descriptions to iconographic images
Enable language switcher or remove it from site
Provide focus/meaningful sequence for search button
Accessibility Report for consumer card application
Project Outcome
Provided accessibility report with recommendations and supporting documents for the client to implement the changes.