Articles

The Definitive Website Accessibility Checklist

Your website can reach a massive audience. Reaching, as well as attracting those users, however, requires a site that anyone can access. That’s why development and marketing teams need to review website accessibility checklists and ensure your site meets web content accessibility guidelines (WCAG).

Keep reading to view our definitive website compliance checklist of 50-plus standards to meet.

You’ll find all the requirements for accessibility, plus instructions on how to meet those guidelines. If you want to learn more about WCAG compliance and marketing your website online, sign up for our free weekly newsletter for industry tips, strategies, and more!

WCAG 2.0 checklist

Assess your WCAG compliance fast with our up-to-date WCAG 2.0 checklist:

  • Level A: Your checklist for making your site accessible to some users.
  • Level AA: Your checklist for making your site accessible to almost all users.
  • Level AAA: Your checklist for making your site accessible to all users.

Level A website accessibility checklist

If your company doesn’t have a significant amount of time to dedicate to WCAG compliance, Level A can get you started. With Level A, you make some basic changes to your site that make it accessible to some (but not all) users.

Level A Web Accessibility Checklist
Guideline Overview Action Items
Non-text content Offer alternatives for any non-text content. Add alt text to images.

Add alt text to audio and video.

Add names to controls, like “Submit.”

Audio-only and video-only Offer alternatives to video- and audio-only content Write transcripts for audio- and video-only content.

Link or place transcripts near audio or video content.

Record audio tracks for video-only media.

Captions Create captions for videos with audio Add captions to all videos with sound.
Audio description or media alternative Provide users with other options to videos with audio Write video transcripts.

Provide audio descriptions of video.

Information and relationships Build a logical structure for site and content Use valid and proper HTML.

Apply clear labels to forms.

Divide content with subheadings.

Meaningful sequence Present site and content in a meaningful order Separate navigation menus from content.

Use valid HTML.

Use headings and lists.

Arrange paragraphs in order.

Sensory characteristics Use position, shape, sound, and size to provide users direction Provide more than one sense, like sight and sound, for instructions.
Color usage Provide an experience not reliant on color Avoid color references in text, like instructing users to click a green button.
Audio control Stop audio from playing automatically Allow users to choose when to play audio, versus playing it automatically.
Keyboard Allow users to use their keyboard to access and use your site Remove any function that uses timed keystrokes, like a double tap.
No keyboard tap Prevent keyboard-only users from becoming trapped on your site Enable navigation control with arrow or “Tab” key.

Eliminate any instances where users cannot navigate or access your site without a keyboard.

Timing adjustable Provide users with the option to control timing limits Let users turn off, adjust, or extend any time limits except for real-time events, like an auction.

Allow users to pause moving or animated text.

Allow users to delay update frequency.

Pause, stop, hide Allow users to stop, hide, or pause moving, blinking, scrolling, or auto-updating content Provide all moving, blinking, scrolling, or auto-updating content with user controls.
Three flashes or below Eliminate any content that flashes more than three times per second Remove any content that flashes more than three times per second.
Bypass blocks Allow users to bypass parts of your page, like headers Add a “Skip to Content” link to all site pages.

Make the “Skip to Content” link visible and accessible.

Page titled Create page titles that tell users what page they are on and what that page is for Write unique and descriptive titles for each page on your site.
Focus order Provide users a logical and meaningful way to navigate and access site elements Ensure site functionality with the “Tab” key.

Make the order of elements, like pages on your navigation, logical.

Link purpose in content Use descriptive anchor text for links Create easy-to-understand anchor text that aligns with the surrounding text.
Page language Assign a language to every page Use HTML to use the appropriate language code for pages.
On focus Prevent elements from instantly changing when users interact with them, like by mousing over a link Eliminate responses that happen automatically, like pop-ups, form submissions, and link openings.

Require a user action, like a mouse click to open a link, for responses to happen.

On input Provide a predictable experience for users interacting with content, like a form Remove any auto-submit form fields.

Eliminate any instances that remove a user’s control when interacting with an element.

Error identification Offer easy-to-understand error messages Provider users with explanations for errors and instructions on how to fix those errors.

Place error explanations near the error, like a required, but blank form field.

Labels or instructions Create clear and helpful labels for website features that require user input, like a contact form Label all input fields.

Describe the preferred format for input fields, like for a phone number or date.

Provide helpful instructions for completing input fields.

Parsing Resolve any significant website code errors and prevent future ones Follow proper HTML structure and guidelines.

Fix any HTML elements with duplicate attributes.

Name, role, value Build all website elements to work with assistive technology Ensure site uses valid HTML markup.

Follow HTML specifications for website scripts.

Level AA website accessibility checklist

With the Level AA website accessibility checklist, your business takes a more proactive approach to building and maintaining an accessible site. Most action items on this website compliance checklist make your website accessible to almost every single user.

Level AA Web Accessibility Checklist
Guideline Overview What You Need To Do
Captions for live videos Caption live videos Caption live videos via software or professional services.
Audio description Provide users access to audio descriptions for video content Add audio description soundtracks to any video content.

Provide a link to the soundtrack close to the content.

Contrast Maintain a contrast ratio of 4.5:1 between your site text and background Use a light background and dark text or vice versa.
Resize text Allow users to resize text up to 200% without losing website functionality or content visibility Prevent resized text from requiring users to scroll horizontally.

Enable resizing of text by up to 200%.

Text images Display all text as plain text Eliminate any images that use images of text to convey content.

Use CSS to stylize text, like for pull quotes.

Finding pages Provide users with different ways to find your website’s pages Add an HTML sitemap.

Enable site search.

Create a logical navigation menu.

Make your navigation menu consistent across your site.

Headings and labels Use descriptive headings and subheadings Make headings and subheadings straightforward and descriptive.

Label site elements, like tables or forms.

Focus visible Allow users to see the focus or location of their keyboard on your site Use CSS to add borders or underlines to elements when selected by a user’s keyboard.

Enable keyboard focus visibility on all site elements, like menus, form fields, and links.

Language of parts Notify users when the language of a page changes Add a language attribute to pages with content that isn’t in your default language.
Consistent navigation Place your navigation menu in the same place on your website Adopt a universal location for your navigation menu and order of items in the navigation menu.
Consistent identification Use consistent icons and buttons, and functions for those icons and buttons Label and name elements with the same function consistently.

Use identical alt text for elements with the same function.

Error suggestion Provide users with tips for how to fix site errors Enable elements, like forms, to identify input errors.

Communicate errors to users with text suggestions.

Error prevention Add confirmation stages to site processes with legal or financial risks Make changes to user-controlled data reversible, like canceling an order.

Allow users to correct errors.

Create a confirmation page that details the user’s input and the website’s outcome.

Level AAA website accessibility checklist

With Level AAA compliance, your business adopts an aggressive approach to website accessibility. While you can focus on this website accessibliyt checklist, it’s often considered too aggressive for most sites. That’s why many companies focus on Level AA.

Ready for WCAG compliance?

With this web accessibility checklist, your company (and team) can move forward with achieving WCAG compliance. If you need help, though, WebFX features a dedicated and experienced team of designers, developers, and copywriters.

Our website compliance services can help your business check off everything on your website accessibility checklist. Explore our plans today, and see why our recommendation score beats the industry average by almost 500%!

The post The Definitive Website Accessibility Checklist appeared first on WebFX Blog.

Level AAA Web Accessibility Checklist
Guideline Overview Action Items
Sign language Offer video translations in sign language Upload alternative video versions with sign language.

Place alternative versions near original video.

Extended audio description Use extended audio descriptions for video content Create extended audio description soundtracks with enough pauses for users to listen and understand.

Place soundtracks near the original video.

Media alternative Provide text transcripts with relevant links for videos Write a full-text transcript.

Position the transcript near the video content.

Live audio-only Offer users alternatives for viewing audio-only content, like a podcast or radio stream Use closed captions.

Provide the script text.

Contrast Maintain a contrast ratio of 7:1 between your text and background Use a dark background and light text or vice versa.
Low or zero background audio Upload clear, easy-to-hear audio Eliminate background noise from audio.

Maintain a background noise 20 decibels below foreground noise.

Visual presentation Offer users different presentation options for viewing site Use tools that allow users to customize background and foreground colors, text spacing, and text size.
No timing Remove all time limits Allow time limits for real-time events only, like auctions or live streams.
Interruptions Prevent interruptions Remove redirects that happen after a specific amount of time.

Eliminate pop-ups.

Re-authenticating Preserve user data for re-authentications Save users data, like items in their shopping cart, when re-authenticating their identity.
Location Help users understand where they are on your website Use breadcrumb navigation.

Add a sitemap.

Section headings Use headings to divide content Add relevant headings to content.
Unusual words Remove unnatural words and explain the meaning of complex phrases Avoid idioms and jargon.

Explain words in-text or with a link to a relevant page.

Abbreviations Explain any abbreviations in content Eliminate abbreviations or explain abbreviations in content.
Reading level Write for a ninth-grade reading level Use a readability testing tool, like Readable.

Create images or diagrams to explain content.

Pronunciation Explain words with difficult or unusual pronunciation Link to pronunciation guides for words or write the phonetic pronunciation.

from Web Design – WebFX Blog https://www.webfx.com/blog/web-design/website-accessibility-checklist/