# Accessibility Auditor Examples
## Example 1: Audit Report
```markdown
# Accessibility Audit Report: Introduction to Photosynthesis
**Date:** 2026-04-24
**Auditor:** Accessibility Auditor (Roo Code)
**Standard:** WCAG 2.1 Level AA
**Content Type:** Interactive lesson with video and quiz
## Summary
- Total Issues Found: 8
- Critical: 2
- Major: 4
- Minor: 2
## Critical Issues
### Issue 1: Missing Alt Text on Diagram
**Location:** Module 2, Photosynthesis diagram image
**WCAG Criteria:** 1.1.1 Non-text Content (Level A)
**Description:** The photosynthesis diagram image has no alt text. Screen reader users cannot understand the content.
**Remediation:** Add alt="Diagram showing the process of photosynthesis: sunlight, water, and carbon dioxide enter the plant; glucose and oxygen are produced and released."
### Issue 2: Video Without Captions
**Location:** Module 1, Introduction video
**WCAG Criteria:** 1.2.2 Captions (Level A)
**Description:** The 4-minute introduction video has no captions.
**Remediation:** Create and synchronize captions for all spoken content and relevant sound effects.
## Major Issues
### Issue 3: Insufficient Color Contrast
**Location:** Quiz feedback text
**WCAG Criteria:** 1.4.3 Contrast (Minimum) (Level AA)
**Description:** Light gray text (#999999) on white background has contrast ratio of 2.85:1 (required: 4.5:1)
**Remediation:** Change text color to #595959 or darker to achieve 4.5:1 contrast ratio.
### Issue 4: Missing Form Labels
**Location:** Quiz answer input fields
**WCAG Criteria:** 1.3.1 Info and Relationships (Level A)
**Description:** Text input fields for short answer questions have no associated labels.
**Remediation:** Add for each input field.
## Minor Issues
### Issue 7: Heading Level Skipped
**Location:** Module 3 summary section
**WCAG Criteria:** 1.3.1 Info and Relationships (Level A)
**Description:** Heading structure jumps from h2 to h4, skipping h3.
**Remediation:** Change h4 to h3 to maintain proper heading hierarchy.
```
---
## Example 2: Remediation Guidance
```markdown
# Remediation: Keyboard Navigation for Interactive Quiz
## Problem
The interactive quiz requires mouse clicks to select answer options. Keyboard-only users cannot complete the quiz.
## WCAG Criteria
2.1.1 Keyboard (Level A)
## Solution
### HTML Structure
```html
Question 1: What is photosynthesis?
```
### CSS for Focus
```css
.answer-option input:focus {
outline: 3px solid #0056b3;
outline-offset: 2px;
}
```
### JavaScript for Keyboard Interaction
```javascript
document.querySelectorAll('.answer-option input').forEach(input => {
input.addEventListener('keydown', (e) => {
if (e.key === 'Enter' || e.key === ' ') {
input.checked = true;
input.closest('.quiz-question').dispatchEvent(new Event('change'));
}
});
});
```
## Testing
- [ ] Tab through all answer options
- [ ] Select answer with Space or Enter
- [ ] Verify focus indicator is visible
- [ ] Verify screen reader announces options
```