CodeFrog
Accessibility Testing
← Back to CodeFrog

Accessibility Testing

CodeFrog includes comprehensive accessibility testing tools designed to help you meet WCAG (Web Content Accessibility Guidelines) standards at all three conformance levels: A, AA, and AAA. These tools help identify and fix accessibility issues before your app or website goes live.

Overview

Accessibility testing ensures your application is usable by people with disabilities, including:

Meeting WCAG standards is not just good practice—it’s often required by law in many jurisdictions. Level AA is typically the target for legal compliance, while Level A is the minimum and Level AAA represents enhanced accessibility.

Windows Screen Reader Context

When testing accessibility on Windows, it’s important to understand how screen readers work:

Windows Screen Readers

Windows Narrator (Built-in):

NVDA (NonVisual Desktop Access):

JAWS (Job Access With Speech):

Testing with Screen Readers

When testing your web applications:

  1. Install a Screen Reader
    • Start with NVDA (free and comprehensive)
    • Or use Windows Narrator for basic testing
  2. Test Navigation
    • Use keyboard-only navigation (Tab, Arrow keys, Enter)
    • Verify all interactive elements are reachable
    • Check that focus indicators are visible
  3. Test Content Reading
    • Verify headings are announced correctly
    • Check that form labels are read with inputs
    • Ensure images have descriptive alt text
    • Verify link text is meaningful out of context
  4. Test Forms
    • Ensure all form fields have labels
    • Verify error messages are announced
    • Check that required fields are indicated

How to Run Accessibility Tests

  1. Open your project in CodeFrog
  2. Navigate to the Analyze tab
  3. Select Accessibility from the analysis options
  4. Choose the files or directories to scan
  5. Click Run Analysis

The accessibility scanner will check:

Interpreting Results

Color Contrast

The scanner reports contrast ratios for all text elements:

Results show:

Keyboard Navigation

The scanner verifies:

ARIA and Semantic HTML

Checks include:

Windows-Specific Testing Notes

Browser Testing

When testing accessibility in browsers on Windows:

Keyboard Testing

Windows keyboard navigation:

High Contrast Mode

Test in Windows High Contrast Mode:

  1. Settings → Ease of Access → High contrast
  2. Enable high contrast theme
  3. Verify your application remains usable
  4. Check that all content is visible

Zoom Testing

Test at different zoom levels:

Best Practices

During Development

Testing Workflow

  1. Automated Testing: Run CodeFrog’s accessibility scanner first
  2. Manual Testing: Test with actual screen readers
  3. Keyboard Testing: Navigate entire application with keyboard only
  4. Color Testing: Check contrast and color-blind accessibility
  5. User Testing: Get feedback from users with disabilities

Common Issues and Solutions

Low Contrast Text

Problem: Text doesn’t meet contrast requirements

Solution:

Missing Alt Text

Problem: Images lack descriptive alt attributes

Solution:

Keyboard Traps

Problem: Users can’t escape a component with keyboard

Solution:

Missing Focus Indicators

Problem: Users can’t see which element has focus

Solution:

Resources

Next Steps