Skip to main content

Accessibility Checklist

General

  1. Use semantic HTML: Use HTML elements that are appropriate for the content they contain, such as using <h1> for headings and <button> for buttons.

  2. Provide alt text for images: Include descriptive alt text for images, so that users with visual impairments can understand the content.

  3. Use ARIA attributes: Use ARIA attributes to describe the function and purpose of non-standard interface elements. Example: <button aria-label="Add to cart">Add to cart</button>

  4. Use high-contrast colors: Use high-contrast colors for text and background, to make it easier for users with visual impairments to read the content.

  5. Use keyboard shortcuts: Provide keyboard shortcuts to allow users to navigate the app without a mouse.

  6. Use focus indicators: Use visual indicators to show users which element has focus, so that they can navigate the app more easily.

  7. Use descriptive link text: Use descriptive link text, rather than generic text such as "click here".

  8. Ensure proper heading hierarchy: Use heading tags in the correct order (i.e. <h1> followed by <h2>, <h3>, etc.), to provide proper structure and context.

  9. Test with screen readers: Test the app with screen readers to ensure that it can be navigated and understood by users with visual impairments.

  10. Provide accessible documentation: Provide documentation in multiple formats, such as text, audio, and video, to ensure that users with different needs can access the information.