Essayer gratuitement
4 min lecture Guide 379 of 877

How to Manage Accessibility (a11y) Work in Development?

How to manage accessibility (a11y) work in development?

Manage accessibility work by creating dedicated a11y labels, tracking WCAG compliance level as labels, organizing audit findings into prioritized tasks, and including a11y testing in your definition of done. Document accessibility guidelines in NoteVault and schedule regular a11y audits as recurring tasks on your board.

Accessibility labels

LabelPurpose
a11yAccessibility-related task
wcag:aWCAG Level A requirement
wcag:aaWCAG Level AA requirement
wcag:aaaWCAG Level AAA (optional)
a11y:keyboardKeyboard navigation issue
a11y:screen-readerScreen reader compatibility
a11y:color-contrastColor contrast issue
a11y:focusFocus indicator issue

WCAG compliance priority

LevelPriorityCompliance Meaning
Level ACriticalMinimum accessibility
Level AAHighStandard requirement
Level AAAOptionalEnhanced accessibility

Accessibility audit to tasks:

  1. Run automated audit - axe, WAVE, Lighthouse
  2. Conduct manual testing - Keyboard, screen reader
  3. Categorize findings - By WCAG level and component
  4. Create tasks per issue - One task per fix
  5. Label appropriately - a11y + WCAG level
  6. Prioritize - Level A first, then AA
  7. Include in sprint - Mix a11y with features
  8. Verify fixes - Test after implementation

Accessibility task template

## A11y: [Component] - [Issue Type]

WCAG Criterion: [e.g., 1.4.3 Contrast]
Level: [A/AA/AAA]
Component: [Affected component]

Issue:
[Description of accessibility barrier]

Current behavior:
[What happens now]

Expected behavior:
[What should happen for accessibility]

Testing:
- [ ] Keyboard navigation works
- [ ] Screen reader announces correctly
- [ ] Focus visible
- [ ] Color contrast passes (4.5:1)

Resources:
- WCAG guideline: [link]
- axe rule: [link]

NoteVault a11y documentation

# Accessibility Guidelines

## Testing Checklist

### Keyboard Navigation
- [ ] All interactive elements focusable
- [ ] Tab order logical
- [ ] Focus visible at all times
- [ ] No keyboard traps
- [ ] Skip links available

### Screen Readers
- [ ] Images have alt text
- [ ] Form labels associated
- [ ] Headings hierarchical
- [ ] ARIA used correctly
- [ ] Dynamic content announced

### Visual
- [ ] Color contrast 4.5:1 (AA)
- [ ] Not color-only information
- [ ] Text resizable to 200%
- [ ] No horizontal scrolling at 320px

## Compliance Status

| Page | Level A | Level AA | Last Audit |
|------|---------|----------|------------|
| Login | ✓ | ✓ | 2025-01-15 |
| Dashboard | ✓ | Partial | 2025-01-15 |
| Settings | ✓ | ✓ | 2025-01-15 |

Accessibility in definition of done

  • [ ] Keyboard navigation tested
  • [ ] Screen reader tested (VoiceOver/NVDA)
  • [ ] Color contrast verified
  • [ ] Alt text for images
  • [ ] Form labels associated
  • [ ] Automated a11y scan passes