Accessibility Audit Skill

Ensures the portfolio meets WCAG 2.1 AA standards. Covers semantic HTML, ARIA, keyboard navigation, color contrast, screen reader compatibility, and focus management.

When to use this skill

• Before shipping any UI change
• When adding interactive components (modals, dropdowns, tabs, forms)
• When adding new images, icons, or media
• When fixing a reported accessibility issue
• During code review of UI components

Workflow

1. Scan for semantic issues — Check that interactive elements use correct HTML (<button>, <a>, <input>, <select>, <textarea>). Never use <div> or <span> with click handlers for actions/navigation.

2. Verify keyboard support — Every interactive element must be reachable and operable via keyboard (Tab, Enter, Space, Escape, Arrow keys per WAI-ARIA APG patterns).

3. Check focus indicators — All focusable elements must have a visible :focus-visible style. Never use outline: none without providing a visible replacement.