Here’s my process for conducting accessibility design reviews. I try to present the results as tune-ups rather than tell-offs.
- Check the page title. It should be unique and describe the page content.
- Check the page headings. Check for order and nesting.
- Check all non-text information has a text equivalent. Images (including icons) have alt text that conveys the content or function of the image. Audio and video have transcripts and captions.
- Check for high quality link and button text. Link text describes the destination, button text describes the action, .
- Check that every form control has an accessible name (visible or not). Placeholders aren’t used instead of label.
- Check that every group of related forms controls has an accessible name (visible or not) that provides context for the individual questions in the group.
- Check colour contrast. At least 4.5:1 for text (including text over images) and 3:1 for graphics and UI components.
- Check that standard controls are used wherever possible. Interactive elements match standard components from the design system.
- Check that non-standard keyboard interactions are annotated. The reasoning behind using a custom component is clearly explained.
- Check for responsive annotations. Consider what the UI will look like zoomed in to 400%.
Error messages are clear and helpful.
- State clearly and precisely the reason for the error (don’t make the user guess what went wrong).
- Give constructive advice on how to fix the problem (Help them fix it).
- Don’t use jargon or error codes: express everything in the user’s vocabulary. (Most humans don’t speak developer).
- Fields are sized appropriately to hint at the required input.
- Check that the language used is plain and clear.
- Check colour isn’t used as the only way of conveying information.
- How to Meet WCAG (Quick Reference) (filtered for levels A and AA, excluding SMIL, PDF, Flash, and Silverlight) is more readable way of doing this than going straight to the official specification. Do a final read-through of the WCAG SC.