Back to docs

Accessibility checklist

Ship recipes that work for everyone — screen readers, keyboard users, and beyond.

Semantic HTML

  • ✓Use <nav>, <main>, <article> landmarks
  • ✓Headings descend in order: h1 → h2 → h3
  • ✓Lists use <ul> or <ol>

Keyboard navigation

  • ✓All interactive elements reachable via Tab
  • ✓Visible focus ring on every focusable element
  • ✓Escape closes modals and menus

Color & contrast

  • ✓Text meets 4.5:1 contrast ratio minimum
  • ✓Never convey information with color alone

Screen readers

  • ✓Images have meaningful alt text
  • ✓aria-label on icon-only buttons
  • ✓Live regions for dynamic content updates

Run Lighthouse or axe DevTools on every recipe before publishing. Catch issues early — your users will thank you.