Accessibility Checklist
General
Use semantic HTML: Use HTML elements that are appropriate for the content they contain, such as using
<h1>
for headings and<button>
for buttons.Provide alt text for images: Include descriptive alt text for images, so that users with visual impairments can understand the content.
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>
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.
Use keyboard shortcuts: Provide keyboard shortcuts to allow users to navigate the app without a mouse.
Use focus indicators: Use visual indicators to show users which element has focus, so that they can navigate the app more easily.
Use descriptive link text: Use descriptive link text, rather than generic text such as "click here".
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.Test with screen readers: Test the app with screen readers to ensure that it can be navigated and understood by users with visual impairments.
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.