AI UX PlaygroundNewsletterJoin 2K+ AI designers and PMs on Substack. New teardowns, patterns, and prompts as they drop.

UX design

Accessibility Audit Checklist

Create a comprehensive accessibility audit checklist for websites or applications.

Prompt

Create a comprehensive accessibility audit checklist for [website/application].

Include:

1. WCAG Compliance
   - Level A requirements
   - Level AA requirements
   - Level AAA considerations

2. Keyboard Navigation
   - Tab order
   - Focus indicators
   - Keyboard shortcuts
   - Skip links

3. Screen Reader Compatibility
   - ARIA labels
   - Semantic HTML
   - Alt text for images
   - Form labels

4. Visual Accessibility
   - Color contrast ratios
   - Text sizing
   - Visual indicators (not just color)
   - Animation/motion preferences

5. Content Accessibility
   - Heading structure
   - Link text clarity
   - Form error messages
   - Language attributes

6. Interactive Elements
   - Button accessibility
   - Form accessibility
   - Modal/dialog accessibility
   - Custom component accessibility

7. Testing Checklist
   - Screen reader testing
   - Keyboard-only testing
   - Color contrast testing
   - Browser testing

Format as an actionable checklist with specific items to verify.

How to use

  1. 01

    Replace [website/application] with your specific site or app (e.g., "our e-commerce checkout flow" or "our React dashboard app")

  2. 02

    Add context before the prompt: "Tech stack: [React/Vue/etc]. Current WCAG level: [A/AA/AAA or unknown]. Focus areas: [forms/navigation/keyboard/etc]."

  3. 03

    If you have screenshots: Upload screenshots of your UI to AI tools with vision. Say "Create an accessibility audit for these screens"

  4. 04

    If you have code: Paste your component code. Say "Create an accessibility audit checklist for this component"

  5. 05

    Paste the modified prompt into your preferred AI tool, like ChatGPT or Claude (preferably with image analysis if using screenshots)

  6. 06

    Review the checklist section by section. Ask follow-ups: "Focus on keyboard navigation" or "Prioritize Level AA issues" or "Check color contrast specifically"

  7. 07

    Use the checklist to systematically audit your site: Test each item manually or with automated tools (axe DevTools, Lighthouse, WAVE)

  8. 08

    Export the checklist to a tracking tool (Jira, Linear, Notion) and mark items as you fix them

Tips

  • Include screenshot analysis: Upload screenshots of your UI for visual accessibility checks (color contrast, focus indicators)
  • For code-first audits: Paste your component code and ask AI to identify missing ARIA labels, semantic HTML, and keyboard navigation
  • Combine with automated tools: Use AI checklist + automated tools (axe, Lighthouse) for comprehensive audits
  • Test as you go: After AI identifies issues, test them manually with keyboard navigation and screen readers (NVDA, VoiceOver)
  • Prioritize by impact: Ask "Rank issues by user impact" to focus on the most critical accessibility barriers first