The challenge

The site failed to meet minimal ADA compliance for web accessibility creating the potential for legal repercussions, inability to attract talent, and potential impact on business opportunities.

To complicate matters, the site is built on a third-party platform that would require custom coding of the platform itself.

The goals

  • Meet WCAG 2.0 AA standards
  • Collaborate with vendor to make custom updates to their platform
  • Educate content creators on how to use the platform to ensure ongoing compliance

The audit

To conduct the audit I used a combination of WAVE and AXE tools, code review, and visual assessment, which revealed some easy to resolve issues for a phased updated approach.

  • Missing landmarks due to lack of semantic HTML tags and/or ARIA roles
  • Incorrect use of heading tags (h1-h6)
  • Incorrect use of, or missing, alt attributes on images and videos
  • Insufficient contrast for text and object over background images, and adjacent text objects

The updates

Updates to the site would require updating the entire platform. Updates that would not only effect our site, but every company that uses the platform. Here’s what we were able to do for the first phase.

  • ARIA roles were added to landmark certain areas of the webpage – navigation, footer, header, and main
  • Heading tags (h1-h6) were updated to ensure they defined a clear document outline
  • Alt text was removed from all decorative images like icons and stock photos, and updated where appropriate
  • Colors were modified to ensure sufficient contrast between text and and object, and the backgrounds or adjacent objects

There is a second phase planned to enhance compliance. Updates will include:

  • Clean up the rest of the image alt tags
  • Improve overall keyboard only usability
  • Evaluate the use of live regions and ARIA states to help with the overall operability and understanding of dynamic content like filtering on the search results page.

The education

 

One key step in this project was educating the team that creates the job posting so they use built-features that aid accessibility.

  • Demonstrated to the team what it’s like to use assistive technology to access the website to build empathy for those that rely on such technology to use the site to apply for jobs
  • Showed the team how to use the RTE (rich text editor) in the platform to assign appropriate heading tags to content to maintain content hierarchy 
  • Showed the team to use the list feature, instead of typing a bullet character, to provide the list of job requirements