WCAG Checker

Test web content against WCAG 2.1 accessibility guidelines

Compliance Level

Level A Level AA Level AAA

Level A: Minimum accessibility (critical issues only)

Element Type

Text Content Test

Sample text content for accessibility testing.

Help

What are WCAG Levels?

Level A: Minimum compliance. Critical issues that must be fixed.

Level AA: Recommended target. Addresses major barriers. Most legal requirements target AA.

Level AAA: Enhanced accessibility. Not always achievable for all content.

Each level includes all requirements from previous levels (AA includes A, AAA includes AA and A).

What is Color Contrast?

Color contrast ratio measures the difference between foreground (text) and background colors.

WCAG AA: 4.5:1 for normal text, 3:1 for large text (18pt+ or 14pt+ bold)

WCAG AAA: 7:1 for normal text, 4.5:1 for large text

Higher ratios make text easier to read for people with low vision or color blindness.

Writing Good Alt Text

Alt text should describe the content and function of the image:

  • Be concise (typically under 150 characters)
  • Describe what's important about the image
  • Don't start with "image of" or "picture of"
  • For decorative images, use empty alt text (alt="")
  • For complex images (charts), provide detailed description elsewhere
Form Accessibility

Accessible forms require:

  • Labels: Every input must have an associated label
  • Instructions: Clear guidance on what to enter
  • Error Messages: Specific, helpful error messages
  • Required Fields: Clearly marked (not just with color)
  • Keyboard Access: Can be completed without a mouse
Link Best Practices

Accessible links should:

  • Have descriptive text (avoid "click here", "read more")
  • Make sense out of context
  • Indicate if they open in new window
  • Show if they link to different file types (PDF, etc.)
  • Be visually distinguishable (not just by color)
Heading Hierarchy

Headings should form a logical outline:

  • One H1 per page (page title)
  • Don't skip levels (H1 → H2 → H3, not H1 → H3)
  • Use for structure, not just styling
  • Screen readers use headings for navigation