Lesson 24 / 25

Best practices checklist

Top accessibility do's and don'ts for production sites.

Do's

Use semantic HTML. Include alt text on images. Provide labels on forms. Ensure 4.5:1 contrast. Support keyboard navigation. Test with screen readers. Use ARIA correctly. Announce dynamic content. Provide skip links. Keep heading hierarchy logical. Use descriptive link text.

Don'ts

Use divs for buttons. Hide focus outline without replacement. Rely on color alone. Embed text in images. Disable zoom. Use or auto-play sound. Forget alt on important images. Nest interactive elements. Create keyboard traps. Use placeholder as label.

WCAG 2.1 AA quick checklist

Page title unique. Alt text on images. Text contrast 4.5:1. Labels on form fields. No keyboard traps. Focus visible. Color not sole information source. Video has captions. Resizable text. Logical heading hierarchy.

WCAG 3.0 preview

WCAG 3.0 is coming (still in draft). Focus on WCAG 2.1 AA for now. 3.0 will use outcome-based scoring.

← Assistive technologies Cheat sheet & Interview Q&A →

Web Accessibility (A11y)
Getting Started
Why accessibility matters

Foundation
WCAG standards
Semantic HTML

Core Techniques
ARIA roles
Keyboard navigation
Focus management
Screen readers

Content & Data
Color contrast
Text alternatives
Forms accessibility
Tables for data

Design Patterns
Skip links
Landmarks
Headings structure
Lists properly

Advanced Patterns
Dynamic content
Video/audio captions
Navigation accessibility

Testing & Tools
Testing accessibility strategy
Manual testing
Automated testing
Browser dev tools

Assistive Technologies
Assistive technologies

Best Practices
Best practices checklist

Quick Reference
Cheat sheet & Interview Q&A

GeeksWithGeeks — Hands-on tutorials for C, Python and more — split into bite-sized segments you can read as a page or watch as 30-second shorts, in your language.