Designing for Accessibility
An accessible website begins with an accessible design. Considerations such as how and when to use color, color contrast, the style of links, and how your content is organized all impact whether a user can easily navigate your content. This is particularly important for people who use only keyboard navigation or assistive technology such as screen readers.
Getting Started — Key WCAG Success Criteria for Designers
Many WCAG criteria address accessible design. Here are six of the more common design considerations that can significantly impact the accessibility of your website and other digital assets.
Ensure there’s enough color contrast.
Website designers recognize that low contrast can make it very difficult to read the words on a page. It’s even harder to read when the text is small or the font very thin. And if you have low vision, insufficient contrast can make it nearly impossible to make out the words on a Web page.
WCAG Success Criterion 1.4.3
Write anchor link text that has clear meaning.
Links should be visually distinct, descriptive, concise and unique. Never use “click here” or any variation of that. Link text needs to inform the site visitor what they will find if they click on the link. And you never need to use the word “link” in your link text. Screen readers announce when the user comes across a link.
WCAG Success Criterion 2.4.4
Design labels and headings that offer clear direction.
A design that is logical and that has a nested heading structure is essential for accessibility. Descriptive headings help users find specific content and orient themselves in terms of where they are on a Web page and on the overall website. Visual headings also represent the content structure, and describe the content that follows them.
WCAG Success Criterion 2.4.6
Use alt text for all non-text content.
Designers ensure that images, graphics and other non-text information have alt text descriptions that clearly and succinctly describe their meaning. Alt text also serves the purpose of allowing screen readers to ignore images that are are decorative and convey no meaning.
WCAG Success Criterion 1.1.1
Make sure tabs flow in a logical sequence.
The reading order should be logical and intuitive with clear focus indicators. People with mobility impairments who use keyboards only benefit from a logical, usable focus order. Reading also flows better for those who use assistive technology such as a screen magnifier, as they may interpret a field in the wrong context if the focus order isn’t logical.
WCAG Success Criterion 2.4.3
Provide a way to correct input mistakes.
Website visitors benefit from feedback on input errors they make. It’s easy to make errors filling out online forms, so it’s critical to design ways to alert users to input mistakes they’ve made and how to correct them.