What is WCAG conformance, and why is it essential for your site?
WCAG stands for Web Content Accessibility Guidelines, which serves as the global standard. WCAG does not provide specific actions that every website must take, but instead shares what accessible websites should do. This set of guidelines was published by the World Wide Web Consortium (W3C) to make web content accessible for all users, including those with disabilities, whether permanent, temporary, or situational.
Ensuring that your site is WCAG conformant, as well as ADA compliant, is essential because when the assumption is made that all users perceive and interact with the world in the same way, your content’s reach can be restricted, and can even send an ableist message about your business.
While WCAG 2.0 is the ISO standard, we strive to meet WCAG 2.1 requirements, which is a backwards compatible recommendation extending the requirements outlined in 2.0, and the most recent and relevant standard of web accessibility.
When working to meet these accessibility requirements, there are three levels of conformity that can be achieved: A, AA, and AAA. Whenever possible, we strive for Level AAA conformance, however, this level is not always achievable, as noted in the WCAG 2.1 standard. As such your site will meet a minimum Level AA conformance.
Once you’re set up for success, maintaining your level of WCAG conformance is dependent on the website’s upkeep and maintenance, and the level may drop if not maintained through any updates you may make to your site. It’s important to note that partial conformance is not conformance, and if one page fails to meet the criteria the entire website fails.
What major principles does a website need to meet to fit the WCAG requirements for certification?
To meet WCAG requirements, your site’s content and user experience (UX) needs to fulfill four major principles of accessibility. We keep these top of mind in every step of our process, including designing and coding for accessibility. Additionally, testing for assistive technology ensures that your site is in line with these principles.
The four principles of accessibility are:
- Perceivable: content must presented in such a way that is is obvious to all users and all users must be able to “perceive” it in some way
- Operable: all users, regardless of input device (i.e. a mouse, keyboard, or screen reader), should be able to interact with your site in a meaningful and useful way
- Understandable: your site’s content and information must be explained in a clear way and your site’s user interface needs to be easily understandable and predictable
- Robust: your site and its content must be rendered in an understandable way across any device—from a TV to a screen reader, and needs to work both now and into the future
Working with a pre-existing site instead of starting from scratch? We’ve got you covered! We can do an audit of your website to see if you meet the WCAG 2.0 standard, and at what level. Then, we can make recommendations to help you improve your conformance, or to help elevate your site to meet minimum WCAG requirements.
WCAG conformance in your website’s design and content.
Conformance to WCAG standards does not happen as an afterthought. Instead, it must inform decisions across the design, development, content, and testing phases of your site’s development, and must be maintained on an ongoing basis.
First, take your site’s design into account. Decisions made when creating the look and feel of your website have a major impact on accessibility, and ensuring that WCAG standards are taken into account during this phase of your site’s development will make maintaining WCAG conformance much easier in the long run. Here are a few things you should keep in mind:
- Color: Instead of using color as the only tool to convey important information on your site, provide descriptions and feedback that is intuitive for all users and eliminate reliance on color alone. For example, when incorporating an important message on your site, remember that simply making an error alert red doesn’t convey the message’s importance to individuals with certain types of color blindness. Instead, add an icon or text that communicates the message clearly, and don’t rely on color alone. Additionally, it’s essential to use color combinations that work for all users so that text in the foreground doesn’t get lost in the background for color blind users.
- Text: The first step to making sure your intended audience is able to understand your site’s content? Don’t let your text get too complex. Ensure that text is written in a clear manner that can be understood by users with a lower secondary education reading level, and that your text’s language is defined within the code. Even if you have a lot of information to convey, keeping any text to a maximum 80 character width, while using accessible line, letter, and paragraph spacing, and avoiding justified text ensures that your content is easy to read and comprehend. Next, make sure that jargon is clearly defined to your users, whether through the text itself, or an alternate mechanism such as crosslinking to a glossary. Finally, it’s essential that any link text provides context to users, and isn’t a generic “read more” or “click here.”
- Global site elements: When designing a WCAG compliant website, it’s important to include interactive elements that are appropriately spaced from one another and are large enough to be easily tappable with a finger, or clickable with a mouse. This allows users with impairments (whether temporary, permanent, or situational) that prohibit them from comfortably interacting with smaller elements to access these elements with ease. Additionally, ensure that global elements such as the header, footer, and navigation are predictable by presenting them in the same way across all pages on your site. Using placeholders to describe form fields may look sleek, but they’ll only provide context for sighted users which then disappear once the field is filled in.
- Moving content: When incorporating moving content into your site, design from a user-focused perspective, and ensure that users have enough time to read and have control over the content, allowing them to pause, play, or stop as needed. Plus, avoid any flashing content elements.
Setting yourself up for WCAG certification from the beginning of the development process.
Like your site’s design, taking note of WCAG standards from the beginning of the web development process is crucial to maintaining a WCAG certified site. Let’s look at a few steps that can be taken during the development process to set you up for success.
- Provide context for users: Use descriptive `title` or `alt` tags to provide context for content when it isn’t evident through the content itself. Another way to provide additional context for users is through input focus and interactive effects.
- Create a seamless experience across devices: Use responsive web design so that your site works across all devices, and components function exactly the same across all pages. Additionally, hierarchical and semantic markup of your site’s content will allow it to be properly interpreted by a browser on any device, assistive technology, or as an HTML document devoid of styling, if needed.
- Include elements to allow users to control their experience: Create the systems for interactive elements, such as slideshows, to be controlled by users whenever possible. This can be accomplished by providing controls for navigation, play/pause buttons, and ensuring that the behavior of buttons and links are predictable. That way, changes initiated by the user are explicit and clear.
Ensuring your site’s WCAG conformance through testing.
Throughout the web design and development process, our team uses various testing tools to confirm each piece of your site’s compliance to WCAG standards. During these assessments, cross-device testing ensures that it works across multiple devices, including screen readers, and designs are checked for ease of reading with colorblind filters. Finally, the navigation of your site is tested with different input devices such as a keyboard, mouse, and touch screen, and the website’s HTML is run through W3C validators.
Once the design and development process is complete, it’s time to take WCAG compliance into your own hands.
Compliance doesn’t end with the design and development process. Throughout our partnership we’ll make all of the recommendations we can to fit these standards, and design a custom website to match, but it is imperative that you take on the final responsibility to approve accessible designs and functionality. If these responsibilities seem overwhelming, we’re here to help with our support plans.
Additionally, there may be legal risk for not following the 2.0 standard, even if you don’t have a set of specific accessibility regulations that apply to your business or organization. If you want to avoid this, maintaining a minimum WCAG 2.0 Level A conformance is a safe option. To do this, you and your team must add appropriate content to your site, and maintain best practices to ensure that any updates you make remain compliant with WCAG requirements. Our team will explain best practices required to adhere to WCAG conformance standards when entering content in our training session.
Ready to learn more about WCAG website conformance, and how we can help you achieve it? Fill out our needs assessment form and our team will be in touch.