Does this checklist guarantee my site is accessible?

No. However, addressing the issues called out in this checklist will help improve the experience for everyone who uses your site. The issues this checklist prompts you to check for cover a wide range of disability conditions. There is no such thing as “perfect accessibility” or a site being “100% accessible.” Digital accessibility is an ongoing process. Content creators should always strive to make their digital content as accessible as possible. It is not a “one and done” task. Remember to periodically check your site to ensure it is still accessible.

This checklist uses the Web Content Accessibility Guidelines (WCAG) as a reference point. The WCAG is a shared standard for web content accessibility for individuals, organizations and governments. There are three levels of accessibility compliance in the WCAG, which reflect the priority of support:

  • A: Essential – If this is not met, assistive technology may not be able to read, understand or fully operate the webpage or view.
  • AA: Ideal Support – Required for multiple government and public body websites. State government should strive for AA compliance.
  • AAA: Specialized Support – This is typically reserved for parts of websites and web apps that serve a specialized audience.

This checklist targets many, but not all level A and AA concerns. 

Note that the different levels of WCAG support do not necessarily indicate an increased level of difficulty to implement. The U.S. Department of Justice Accessibility Rule for State and Local Government and the N.C. Digital Accessibility & Usability Standard are geared toward compliance with the WCAG 2.1 AA standard.

Success Criteria

Each item on this checklist has a corresponding WCAG “success criterion.” Success criteria are the specific, testable rules that power the WCAG, described by a reference number and short title. For example, the rule about text resizing is called 1.4.4 Resize text.

Some accessibility issues may have multiple success criteria apply to them. The one most relevant is identified for each checklist item.

Content

Content is the most important part of your website. By adhering to best practices for creating accessible documents, websites and apps, you not only make your content usable for everyone but also help ensure legal compliance.

  • Establish an editorial calendar for regular content review. Use a site crawl (spreadsheet) to assign a content owner for every page of your website and the frequency it should be reviewed, which should be annually at minimum.
  • Refer to your website analytics to determine outdated and unused content. Remove redundant, obsolete and trivial (ROT) content.
  • Use plain language, and avoid figures of speech, idioms and complicated metaphors.
  • Write content at an eighth-grade reading level. Use an online tool such as the Hemingway App to check the readability of your content.
  • Make sure that button and other label elements are unique and descriptive.
  • Use left-aligned text for left-to-right (LTR) languages, such as English, and right-aligned text for right-to-left (RTL) languages.
  • For readability, avoid centered text or fully justified text.
  • Provide a unique title for each page, webform or view.
  • Make sure each page has a unique path, or URL. Avoid duplicate URLs, which may have a number appending at the end of the path, such as -0, -1, etc.
  • Delete unnecessary URL redirects.
  • Ensure that tables have a designated header in table properties (more on tables below).
  • Ensure link text is descriptive but concise. Do not use terms such as “click here” and “read more.” They are not meaningful and provide no context. Link text should convey what will happen if navigated to or activated.
  • When creating or editing content on a Digital Commons website, pay attention to items flagged by the Editoria11y accessibility checker and address as needed. 

Headings

Heading elements (h1, h2, h3, etc.) help break up the content of the page into related “chunks” of information. They are important for helping people who use assistive technology to understand the meaning and structure of a page or view.

  • Use heading elements to introduce content, and make sure heading text is descriptive of the content it introduces.
  • Use only one h1 element per page or view. This is typically the page title.
  • Ensure heading elements are written in a logical sequence.
  • Don't skip heading levels.

Tables

Tables are a structured set of data that help people understand the relationships between different types of information.

  • Use the <table> element to describe tabular data.
  • Ensure that every table has a designated header row or column. Do not use color or font as the only means to convey the header.
  • Use the <th> element for table headers (with appropriate scope attributes).
  • Use the <caption> element to provide a title for the table.

Lists

List elements let people know a collection of items are related and if they are sequential, and how many items are present in the list grouping.

  • Use list elements (<ol>, <ul> and <dl> elements) for list content.
  • Make sure sequential items use numbered lists. Items for which sequence does not matter should use bullets.
  • Use indention as needed to indicate hierarchy and relationships between items in the list.

Images

Images provide decoration as well as information on a webpage. Help make sure they can be enjoyed by all by including an alternative text (alt text) description.

  • Make sure that all <img> elements have an alt attribute (alt text).
  • Make sure that decorative images use a null alt (empty) attribute value (alt="").
  • Provide a text alternative for complex images such as charts, graphs and maps.
  • For images containing text, make sure the alt description includes the image's text.

Webforms

Forms allow people to enter and submit information to a website for processing and manipulation. This includes sending messages and placing orders.

  • All input fields in a form are associated with a corresponding label element, and the label accurately and concisely describes the field associated with it.
  • Use <fieldset> (a section of related input fields) and <legend> elements where appropriate.
  • Inputs use autocomplete, where appropriate, to help users enter the correct information.
  • Make sure that required fields are designated as such.
  • Make sure that form input errors are displayed in list above the form after submission.
  • Associate input error messaging with the input it corresponds to.
  • Make sure that error, warning and success states are not visually communicated only by color.

Media

Media includes content such as pre-recorded and live audio and video.

  • Make sure that media does not autoplay.
  • Ensure that media controls use appropriate markup.
  • Check to see that all media can be paused.
  • For videos, confirm the presence of captions and remove seizure triggers, such as strobing or flickering.
  • For audio, confirm that transcripts are available.

Appearance & Consistency

Consistency improves user experience by helping site visitors know what to expect when navigating your website.

  • Check your content in specialized browsing modes.
  • Check your content in multiple, commonly used browsers
  • Increase text size to 200% and ensure that it is still readable and does not overlap other content.
  • Double-check that good proximity between content is maintained.
  • Make sure color is not the only way information is conveyed.
  • Make sure instructions are not visual- or audio-only.
  • Use a simple, straightforward and consistent layout.

Animation

This is content that moves, either on its own or when triggered by a person activating a control.

  • Ensure animations are subtle and do not flash, flicker or strobe.
  • Provide a mechanism to pause background video.
  • Make sure all animation obeys the prefers-reduced-motion media query, which is used to detect if a user has enabled a setting on their device to minimize the amount of non-essential motion. 

Color Contrast

Color contrast refers to how legible colors are when placed next to and on top of each other.

  • Check the contrast for all normal-sized text. Level AA compliance requires a contrast ratio of 4.5:1.
  • Check the contrast for all large-sized text. Level AA compliance requires a contrast ratio of 3:1.
  • Check the contrast for all icons. Level AA compliance requires a contrast ratio of 3.0:1.
  • Check the contrast of borders for input elements (text input, radio buttons, checkboxes, etc.). Level AA compliance requires a contrast ratio of 3.0:1.
  • Check text that overlaps images or video.
  • Check custom ::selection color, which is used to change the color of highlighted text.

Mobile & Touch

Site visitors should be able to access web content regardless of the device they use.

  • Check that the site can be rotated to any orientation.
  • Ensure that there is no horizontal scrolling.
  • Ensure that button and link icons can be activated with ease, regardless of device orientation.
  • Ensure sufficient space between interactive items.

PDFs

The Portable Document Format is an Adobe file format for sharing digital documents at a lower compression (file size). PDFs and other document files should use structure and tagging to help ensure accessibility.

  • Use website analytics to determine whether a PDF is outdated or still in use. Remove outdated PDF files from the website.
  • Where practical, provide document content as a webpage rather than a document file.
  • Ensure the source document is accessible before converting it to PDF. Microsoft provides an accessibility checker for its products, including Word, Excel and PowerPoint.
  • Ensure the PDF is accessible using the Adobe Pro accessibility checker.

 

On