A360: Gaining Certification for eCommerce sites

Gaining Letters of Certification for Accessibility (A11y)

Web accessibility has moved into the forefront for online retailers in the last decade. Providing an accessible site to all is a crucial aspect of a successful and inclusive business.

Bluestem Brands was in the process of gaining letters of certification from A360, a company that specializes in getting sites accessible and compliant within the WCAG guidelines. I was responsible for identifying and recommending solutions for accessibility issues that affected the user experience.

Identify Issues

To prevent any issue from getting into a sprint before we had time to investigate, I combed our internal backlog as well as the A360 portal to identify tickets with UX consideration.

Once I identified a ticket that affected the user experience, I notified a business analyst. Communicating with business analysts was key to prevent issues reaching a sprint before the solution was properly vetted.

Breaking Brand Colors

Once an issue was determined to need UX consideration, I would quickly examine the ticket and identify how to best address the issue while maintaining a smooth experience. If there was a color contrast issue, I would use a brand’s style guide to identify a compliant color.

There were instances where colors from a brand’s style guide were non-compliant. In these cases, I reached out to the marketing team for other options and shared WebAIM’s color contrast tool so they could make compliant choices in the future.

If there was an issue involving expected behavior, I would consult with the UX team and Product owner to confirm my recommendation. When making significant changes to the sites, it was important to have stakeholders involved in the process.

Interpretation Is Key

I communicated with A360’s staff through their portal that housed all the accessibility tickets. If I came across an issue that wasn’t clear or I needed clarification on, we would have a dialogue within the ticket.

There were several instances where our established UI patterns met WCAG requirements but due to A360’s interpretation of the guidelines, there were marked as warnings. One of these issues involved adding an asterisk to any required form fields.

After discussing these instances internally and with the A360 staff, we were able to come to a consensus. It was important that we started a dialogue on issues that would require a large development effect when a brand was not violating WCAG guidelines.

Documenting Changes

Every sprint we were notified if an issue we worked on and submitted had been approved. Once our fixes had been approved by A360, it was important to document the compliant code. With many rapid changes occurring, it was easy to lose track. My UX teammate and I created a spreadsheet with all the changes that could affect Bluestem Brand’s pattern libraries and style guides.

We organized the spreadsheet by brand and element. We prioritized style guide and UI updates. These elements were most likely to be iterated on in the near future and it was important to reflect the changes in the pattern library and style guides. We partnered with business analysts to get stories written so that these changes will be documented as soon as possible. This tool would be crucial to maintaining an accessible site in the future.

Next Steps

After we received confirmation that our sites are compliant and would be receiving letters of certification, I asked to be apart of a internal team to continue to monitor our sites in order to maintain their accessibility and compliance with WCAG guidelines.

We shared our accessibility tools and knowledge with other departments that weren’t directly involved but had the ability to change aspects of the sites. This would maintain the level of accessibility that the sites had reached.

We will hire disabled users to make sure these changes are effective and robust in our next usability testing session.