By factoring in UI/UX design upfront and building to these accessibility best practices, you will significantly reduce technical debt and rework.
In the transition to digital, the Government is automating routine workflow processes. Agencies are digitizing vast amounts of paper files, changing how analysts manage their daily workload. But consider that the shift to digital processes doubly impacts people with impairments. Studies1 show that 3.3% of workers have a visual impairment, and 8.2% have an impairment with lifting/grasping (i.e., difficulty with mouse control and reliance on keyboard commands).
The GSA’s Section 508 Government-wide IT Accessibility Program requires federal agencies to ensure their information and services are accessible to people with disabilities. The standards include but are not limited to:
- Smartphones and other types of communication devices
- Desktops, laptops, tablets, and websites
- Recorded presentations such as webinars and online training
- Digital documents such as user guides and PDFs
Our view on best practices
At NT Concepts, we developed best practices to assist agencies with 508 compliance requirements. We recognize the importance of having a clear understanding to assist in meeting their responsibilities for accessibility:
1 Have a certified Section 508 SME on the design team
Many objectives go into designing web sites and web tools, such as creating a comprehensible and engaging site and achieving desired business outcomes. A certified Section 508 subject matter expert (SME) knows how to balance multiple stakeholders’ needs and work with front-end developers to meet the conformance requirements for Level A and Level AA success criteria.
For example, multiple criteria must be met for usability by people with disabilities, such as color contrast ratios and the ability to navigate the application using only the keyboard. The 508 SME continually ensures all entities focus on the Web Content Accessibility Guide (WCAG) principles (see Figure 1) to “bake in” 508 compliance every step of the way. This includes continual 508 compliance testing, which significantly reduces technical debt and creates repeatable code modules that are 508 compliant.
The WCAG principles—Perceivable, Operable, Understandable, and Robust—are often referred to by the acronym “POUR.” 2
- PERCEIVABLE: Information and user interface components must be presentable to users in ways they can perceive.
- OPERABLE: User interface components and navigation must be operable.
- UNDERSTANDABLE: Information and the operation of the user interface must be understandable.
- ROBUST: Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.
2 Follow a playbook
For each project, NT Concepts follows a DesignOps playbook to define the UI/UX style that will be used to create the user interfaces necessary for the application. We collaborate with our product owners, our UI/UX design team, and our certified 508 testers to develop a standardized style guide for each application. Figure 2 outlines the DesignOps process and how it applies to 508 compliance considerations.
DesignOps Delivery Process
Our agile-based process utilizes the following six plays:
- DISCOVER: Identify fallacies and faults in the application; outline targeted audience
- COLLABORATE: Work with customer to outline requirements
- DEFINE USABILITY: Design UI/UX geared to accommodate 508 compliance
- PROTOTYPE: Outline of established design
- TEST: Ensure all compliance is met, use screen readers to validate code
- DEPLOY/INTEGRATE: Move all work to dev and staging environments
Working as a team through the Discover, Collaborate, and Define phases ensures a robust and consistent style guide is created. The style guide is a proven successful road map to ensure 508 compliance within the UI/UX design.
3 Use automated tools for CI/CD
Integrating automated testing tools into the continuous improvement/continuous development (CI/CD) pipeline ensures automated 508 compliance checks are run with each code merge. These automated tests ensure developers are receiving 508 compliance feedback at the earliest point in the integration flow. Automated checks are not a replacement for manual reviews by human testers but can provide a great deal of early feedback and prevent simple errors from even entering the code base and allowing the human testers to focus on more complicated tests and verification. Tools such as Tanaguru Engine and Pa11y can be integrated into the CI/CD pipeline to perform these tests and generate reports describing the developed code’s compliance.
By factoring in UI/UX design upfront and building to Section 508 accessibility specifications, you will reduce the amount of technical debt and rework while ensuring the application meets the required WCAG guidelines.
Take, for example, our experience working with one of our government clients. The client knew the product needed to be 508 compliant at the AA level but initially focused on gathering and implementing the minimum functional requirements. As a result, code development started, and the 508 requirements were deprioritized in the backlog.
While this approach allowed for the development of a functional application, it was not 508 compliant. Upon completion of development, the 508 requirements were then “bolted on” to make the application 508 compliant at the AA level. The problem with this approach is that it resulted in technical debt because aspects of the system had to be redone and replaced to achieve compliance. This code included rework of the UI/UX design and items such as tables, graphs, and images. This approach ultimately increased cost and delayed deployment of a 508 compliant application.
When this client needed another application, we used lessons learned from the previous effort, and the development of the new requirements included the necessary elements to support 508 compliance. This approach supported user-centric design and involved utilizing Department of Homeland Security (DHS) certified trusted testers as part of the application’s initial design. The team created a standardized playbook and focused on the WCAG principles to ensure consistency and compliance across the application.
4 Have certified human testers
In addition to automation tools, you still need certified Department of Homeland Security (DHS) trusted testers who fully understand the DesignOps playbook, specifications, and style guide.
Various tools are available to assist with compliance; however, the human element remains a critical component. For example, ANDI (Accessible Name & Description Inspector) is a free tool described as a “bookmarklet” that tests websites for accessibility. The tool automatically reads the code within each page, flags and categorizes potential issues in order of severity, and provides suggestions to improve accessibility for users. A human is required to analyze feedback and decide if code changes need to be made to ensure compliance. Below is the example output of WAVE, a free Chrome extension tool that flags any potential accessibility issues and marks them for manual review.
Accessibility is good for business
The GSA points out that aside from the legal requirements, “Creating products and information that everyone can use drives innovation, provides a better customer experience, and improves employee engagement. Accessibility helps you reach more stakeholders and, ultimately, achieve your agency’s mission.”
For more information, visit Section508.gov.
1Accessibility, Interactive. “Accessibility Statistics.” Accessibility Statistics | Interactive Accessibility, www.interactiveaccessibility.com/accessibility-statistics.
2“WCAG 2.0 Principles and Implementation.” WCAG 2.0 Principles, www.d.umn.edu/itss/news/2016/05/wcag_principles.html.