skills.rest
nakano1122
nakano1122COMMUNITY
Explore all skills by this author →
Website𝕏@cafkaf1122GitHub

accessibility

Guide web accessibility implementation using WCAG 2.1 standards.

2|Updated Feb 15, 2026
Search Tags:#inclusive design#accessibility#a11y#wcag#web standards#aria
One-click install
npx skills add https://github.com/nakano1122/dotfiles --skill accessibility-nakano1122
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: accessibility
Source: https://github.com/nakano1122/dotfiles/tree/main/dot_agents/skills/accessibility
Command: npx skills add https://github.com/nakano1122/dotfiles --skill accessibility-nakano1122

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses the challenge of making web content accessible to all users, including those with disabilities, by providing guidelines and best practices for WCAG 2.1 compliance.

Core Features & Use Cases

  • WCAG 2.1 Compliance: Guides users on adhering to the Perceivable, Operable, Understandable, and Robust principles.
  • Semantic HTML & ARIA: Explains the correct usage of HTML elements and ARIA attributes for better screen reader compatibility.
  • Keyboard Navigation & Forms: Details how to ensure websites are fully navigable and usable via keyboard and how to make forms accessible.
  • Color Contrast & Dynamic Content: Covers essential aspects like color contrast ratios and managing dynamic content for accessibility.
  • Use Case: A developer needs to ensure a new web application meets accessibility standards before launch. They can use this Skill to review their implementation against WCAG 2.1 guidelines, focusing on semantic structure, ARIA usage, and keyboard operability.

Quick Start

Review the web accessibility guide for WCAG 2.1 compliance.

Frequently Asked Questions about accessibility

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I make my web content accessible and meet WCAG 2.1 standards?▼

To make web content accessible and meet WCAG 2.1 standards, follow the principles of perceivability, operability, understandability, and robustness. This involves using semantic HTML, proper ARIA patterns, and ensuring full keyboard navigation.

What is the best way to use ARIA attributes for screen reader compatibility?▼

The best way to use ARIA attributes for screen reader compatibility is combining them with semantic HTML. ARIA should enhance accessibility for dynamic content and complex UI patterns, ensuring dynamic updates are properly announced to assistive technologies.

How do I ensure my website forms are fully navigable using a keyboard?▼

To ensure website forms are fully navigable using a keyboard, implement logical tab indexing and accessible focus management. Use semantic HTML form elements and ARIA labels to guarantee users can interact with and submit forms without a mouse.

What color contrast ratios are required for WCAG 2.1 compliance?▼

Color contrast ratios required for WCAG 2.1 compliance dictate specific minimum thresholds between text and background colors. Meeting these ratios ensures perceivability for users with visual impairments, making dynamic and static content readable.

When do I need to manage dynamic content for web accessibility?▼

You need to manage dynamic content for web accessibility whenever page elements update without a full reload. Proper ARIA live regions and focus management ensure these dynamic changes are perceivable and operable for screen reader users.

Does implementing inclusive design require semantic HTML over ARIA?▼

Implementing inclusive design prioritizes semantic HTML over ARIA wherever possible. Native HTML elements inherently provide accessibility, while ARIA attributes should only supplement semantics when native elements cannot convey the necessary dynamic content behaviors.

Related Skills

Explore More Design & Creative Skills→
ryan-nguyen-01ryan-nguyen-01
4

skill-ui-accessibility

Analyze web UI structure, semantics, and ARIA usage for accessibility gaps.

Community
Advanced
samjhechtsamjhecht
4

frontend-accessibility-verification

Verify frontend UI accessibility compliance with axe-core, keyboard, screen reader, and Lighthouse audits.

Community
Advanced
Higashi-KotaHigashi-Kota

ui-component

Build accessible React UI components with design tokens and ARIA patterns.

Community
Advanced
guichefferguicheffer
3

web-accessibility

Enforce WCAG 2.1 AA compliance using semantic HTML, ARIA attributes, axe-core, and jest-axe automated tests.

Community
Intermediate