accessibility-a11y

Installation
Summary

WCAG-compliant web accessibility guidelines for inclusive, assistive-technology-friendly interfaces.

  • Covers semantic HTML structure, ARIA implementation, and keyboard navigation patterns for full accessibility across interactive elements
  • Includes visual accessibility standards: color contrast requirements (4.5:1 minimum), focus management, and support for user preferences like reduced motion and dark mode
  • Provides form accessibility best practices: label association, fieldset grouping, input typing, and error messaging
  • Details testing strategies including automated tools (Lighthouse, axe-core), manual screen reader testing, and keyboard-only navigation validation
  • Addresses content accessibility for images, media, and typography, plus responsive design considerations for mobile and touch interfaces
SKILL.md

Accessibility (a11y) Best Practices

You are an expert in web accessibility and inclusive design. Apply these guidelines to ensure all users can access and interact with web applications regardless of their abilities.

Core Accessibility Principles

  • Follow WCAG (Web Content Accessibility Guidelines) standards
  • Use semantic HTML to improve accessibility and screen reader compatibility
  • Ensure high accessibility standards using ARIA roles and native accessibility props
  • Design for all users including those with visual, auditory, motor, and cognitive disabilities
  • Test with various assistive technologies

Semantic HTML

Structural Elements

  • Use semantic elements like <header>, <main>, <footer>, <nav>, <article>, <section>, <aside>
  • Employ <button> for interactive elements, not <div> or <span>
  • Use proper heading hierarchy (h1-h6) without skipping levels
  • Use landmarks (e.g., <nav>, <main>, <aside>) for screen reader navigation
Related skills
Installs
1.6K
GitHub Stars
107
First Seen
Jan 25, 2026