Construct-AI-primary Accessibility Standards
Overview
This skill defines accessibility standards for creating inclusive user experiences. Accessibility is not optional - it's a legal requirement and moral obligation that also improves usability for everyone.
When to Use
- When designing or building any user interface
- When creating documents or content for users
- When reviewing UI changes or designs
- When creating forms, navigation, or interactive elements
- Don't use when: Building purely backend services with no user interface
Core Procedures
Step 1: Accessible Markup
- All images have descriptive
alttext - Headings are hierarchical (h1 → h2 → h3, no skipping)
- ARIA labels on interactive elements without visible text
- Focus outlines are visible and logical
- Color is never the only indicator of state or meaning
- Language is specified in HTML/document
Step 2: Keyboard Access
- All interactive elements operable via keyboard
- Tab order is logical and matches visual order
- Keyboard focus is always visible
- No keyboard traps (users can't get stuck)
- Shortcuts are documented and don't conflict with screen readers
Step 3: Content Standards
- Text contrast ratio minimum 4.5:1 (3:1 for large text)
- Text resizeable up to 200% without loss of function
- Language is clear and avoids unnecessary jargon
- Links are descriptive (not "click here")
- Forms have associated labels and error messages
- Error messages identify the field and suggest correction
Step 4: Testing
- Automated accessibility scan (aXe, Lighthouse)
- Keyboard-only navigation test
- Screen reader test (VoiceOver, NVDA, or TalkBack)
- Color contrast validation on all text/interactive elements
- Zoom test (200% zoom, no horizontal scroll required)
Step 5: Documentation
Document any known accessibility limitations:
ACCESSIBILITY NOTE
==================
Issue: [what accessibility concern exists]
Affected Users: [who is impacted - screen reader, keyboard, visual]
Workaround: [what alternative is available]
Planned Fix: [if fix is planned, when]
Quality Checklist
- Automated accessibility scan passes with zero errors
- Keyboard navigation works completely
- Screen reader announces content meaningfully
- Color contrast meets minimum standards
- Text is readable at 200% zoom
- All images have alt text
- Forms have labels and error handling
Error Handling
- Error: Accessibility issue discovered after release Response: Triage severity, fix critical issues immediately, document known issues with workarounds
- Error: Third-party component has accessibility issues Response: Report to vendor, implement workaround, evaluate alternatives
Cross-Team Integration
Related Skills: ui-ux-guidelines, testing-strategy, documentation-quality-check, feedback-integration Used By: Design agents, frontend developers, UX agents, Content agents, QA testers