Skip to content

Website Accessibility Checklist

General Guidelines

Layout and Structure

  • The website layout is clean, simple, and easy to navigate with clear sections.
  • There are no complex tables or multi-column designs that may confuse screen readers.
  • The content flows logically from top to bottom and left to right. The reading order of the content should match the visual layout.
  • There are not "tabindex" attribute values other than 0 or -1.
  • Keyboard focus is visible when tabbing through the website.
  • Each page has a unique title.
  • "Title" attribute tooltips are not used.
  • Only 1 H1 heading is used per page.
  • Text can be increased to 200% size without loss of readability or functionality.
  • The website can be rotated to portrait or landscape orientation without loss of readability or functionality.
  • There is no horizontal scrolling.
  • More than one way is available to navigate to a page except where the page is a step in a process.
  • Repeating navigation items on multiple pages are always presented in the same order.

Semantics

  • Semantic HTML elements are used (e.g., <header>, <nav>, <main>, <article>, <footer>) to help screen readers interpret content correctly.
  • Appropriate HTML tags are used (like <table> for tabular data and <p> for paragraphs) instead of generic <div> or <span> tags.
  • ARIA attributes (Accessible Rich Internet Applications) are used to enhance accessibility, such as role="banner", role="navigation", or role="button" where necessary.

Function

  • A skip link is used to provide quick access to the main content of each page. This allows a person to easily bypass globally repeated content such as a website's primary navigation or persistent search widget. The skip link is visible when focused.
  • Viewport zoom is not disabled.
  • The autofocus attribute is not used.
  • Extending timeout sessions is allowed.
  • Links do not open in a new tab or window. If they must, indicate that in the link text. E.g. "See pricing in a new tab".
  • Path-based gestures with a pointer or finger are not used unless absolutely necessary.
  • All pointer executions use the up-event, not the down-event.
  • Focusing or changing the settings on user interface components doesn't change context or meaning of the paged unless the user has been advised of the behavior before using the component.
  • Multiple components with the same functionality are identified consistently.
  • Labels or instructions are provided when content requires user input.
  • For pages that cause legal, financial, or user-data changes, the data is validated and the user has an opportunity to check the submissions and modify or reverse them.
  • Status messages can be programmatically determined through role or properties such that they can be presented to the user by assistive technologies without receiving focus.

Language

  • The correct language is set for the website/pages.
  • Content in a language that differs from the majority of the website has the correct language in its tag properties.

Content

  • Colors or sensory characteristics are not used alone to convey meaning.
  • User interface components have a contrast ratio of at least 3:1 against adjacent color(s).
  • User interface components do not contain anything that flashes or blinks more than three times in any one-second period — strobe effects should never be used.
  • User interface components with labels that include text or images of text have a name that contains the text that is presented visually.
  • A link to an accessibility statement and/or contact information for recipients who need assistance or further accommodations is provided.

Links

  • Links and buttons are keyboard-navigable and easily clickable on mobile.
  • Buttons are at least 44x44 pixels for easy tapping.

Forms

  • All form inputs have a corresponding label.
  • Long or complicated forms are broken into sections.
  • Autocomplete is available for common elements like name, address, and phone number.
  • Form errors are clearly presented with specific details above the form upon a failed submission. Make sure the error messages clearly correspond to the related fields. Dynamic error messages from data-validated fields are even better.

Testing

  • The website is tested with screen readers like NVDA, JAWS, or VoiceOver to ensure it is navigable and all elements are read correctly.
  • The website has been tested on different web browsers (Chrome, Firefox, Internet Explorer, Safari) and devices (desktop, tablet, mobile) to ensure proper rendering and accessibility.
  • All content is accessible without a mouse. Navigate through your website using only the keyboard (Tab, Shift+Tab, Enter, Space) to ensure this.
  • SiteImprove has been used to confirm an accessibility score of at least 95% for level A and 90% for AA.
  • Ensure appropriate proximity of elements using The Straw Test.

Actionable Guidance: Website Content Accessibility

1. Keyboard Navigation and Focus

Keyboard accessibility is fundamental. Users who cannot use a mouse (including screen reader users and users with motor disabilities) rely entirely on keyboard navigation (Tab, Shift+Tab, Enter).

Action Requirement Why It Matters
Ensure Full Keyboard Access Every interactive element (links, buttons, form fields, navigation) must be reachable and operable using only the keyboard (Tab, Shift+Tab, Enter). This is essential for users who rely on assistive technologies or have motor disabilities.
Provide a Visible Focus Indicator When tabbing through the page, a clear, visible outline or ring must appear around the currently focused element. Users need to know exactly where they are on the page to navigate effectively.
Implement a "Skip Link" Include a hidden link at the very top of the page that becomes visible on keyboard focus, allowing users to Skip to Main Content. This prevents keyboard users from having to tab through lengthy, repetitive navigation menus on every page load.
Maintain Logical Tab Order The order in which the keyboard focus moves (the tab order) must follow the logical flow of the content (top to bottom, left to right). A confusing tab order disorients screen reader users and makes the site unusable.

2. Forms and User Input

Forms (contact forms, sign-ups, search bars) are often the biggest barrier to accessibility.

Action Requirement Why It Matters
Use Clear, Persistent Labels Every form field must have a visible, descriptive label that is permanently associated with the input field (using the <label> tag). Do not rely on placeholder text alone. Screen readers announce the label to identify the field. Placeholder text disappears when the user starts typing.
Provide Clear Instructions If a specific format is required (e.g., date format, password requirements), provide instructions before the user submits the form. Helps users with cognitive disabilities or those unfamiliar with the required format complete the form successfully.
Handle Errors Clearly When an error occurs, the error message must clearly state what the error is and how to fix it. The message should be placed near the field in error. Users with low vision or cognitive disabilities need explicit, easy-to-understand guidance to correct their input.
Avoid Time Limits If a form or session has a time limit, allow the user to extend, adjust, or turn off the limit. Users with cognitive or motor disabilities may need more time to complete tasks.

3. Data Tables

If you are presenting complex data (not just using a table for layout), proper structure is required.

Action Requirement Why It Matters
Identify Headers Correctly Use the <th> tag to identify column and/or row headers, and use the scope attribute (scope="col" or scope="row") to associate them with the data cells. Screen readers use these tags to announce the context (the header) for each data point, making the table understandable.
Provide a Caption Include a brief caption or summary that describes the table's content and purpose. Gives screen reader users an immediate overview of the data before they navigate through the cells.
Avoid Merged Cells Do not use merged or split cells (colspan or rowspan) unless absolutely necessary, as they complicate the reading order. Merged cells break the simple, linear relationship between headers and data, confusing screen readers.

4. Time-Based Content and Flashing

Action Requirement Why It Matters
Control Moving Content Any content that moves, scrolls, or auto-updates (e.g., carousels, news tickers, auto-playing videos) must have controls that allow the user to pause, stop, or hide it. Moving content can be distracting for users with cognitive disabilities and can interfere with screen reader use.
Limit Flashing Content Ensure no element on the page flashes or blinks more than three times in any one-second period. Flashing content can trigger seizures in users with photosensitive epilepsy.