skills.rest
bulbulogludemir
bulbulogludemirCOMMUNITY
Explore all skills by this author →
Website𝕏@demirbulbulogluGitHub

accessibility

Apply WCAG 2.1 AA patterns to web and mobile interfaces.

Updated Aug 23, 2026
Search Tags:#accessibility#a11y#frontend#wcag#keyboard#semantics#aria
One-click install
npx skills add https://github.com/bulbulogludemir/claude-code-plugins --skill accessibility-bulbulogludemir
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: accessibility
Source: https://github.com/bulbulogludemir/claude-code-plugins/tree/main/plugins/claude-frontend/skills/accessibility
Command: npx skills add https://github.com/bulbulogludemir/claude-code-plugins --skill accessibility-bulbulogludemir

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

WCAG 2.1 AA compliance can be complex and error-prone; this Skill codifies best practices and patterns to ensure digital products are accessible by default.

Core Features & Use Cases

  • Accessibility foundations: keyboard operability, screen-reader compatibility, and semantic HTML.
  • ARIA patterns and interactive component best practices to improve usability for all users.
  • Use Case: apply accessibility patterns to forms, dialogs, and navigation to meet WCAG requirements across platforms.

Quick Start

Audit a UI prototype for accessibility and implement WCAG 2.1 AA patterns across interactive components.

Frequently Asked Questions about accessibility

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

FAQPage Schema
How do I make my UI compliant with WCAG 2.1 AA standards?▼

To make a UI compliant with WCAG 2.1 AA, you need to implement keyboard navigation, screen reader support, semantic HTML, and proper ARIA attributes across forms, dialogs, and navigation components.

What is the best way to add ARIA attributes and semantic HTML for screen reader support?▼

Adding ARIA attributes and semantic HTML for screen reader support involves applying established WCAG 2.1 AA patterns to interactive components, ensuring proper roles, states, and properties are communicated to assistive technologies.

How do I implement keyboard navigation and focus management for accessible web dialogs?▼

Implementing keyboard navigation and focus management for accessible web dialogs requires applying specific WCAG 2.1 AA patterns to trap focus within the dialog and return focus to the triggering element upon closure.

Can I use these accessibility patterns for both web and mobile interfaces?▼

Yes, you can apply these accessibility patterns to both web and mobile interfaces, ensuring keyboard operability, screen-reader compatibility, and semantic markup meet WCAG 2.1 AA requirements across different platforms.

Why does my frontend form fail accessibility audits for color contrast and semantics?▼

Frontend forms fail accessibility audits when they lack sufficient color contrast, missing semantic HTML labels, or improper ARIA attributes, preventing compliance with established WCAG 2.1 AA guidelines.

Do I need specific frontend frameworks to meet keyboard operability and WCAG requirements?▼

No specific frontend frameworks are required to meet keyboard operability and WCAG requirements, as accessibility is achieved by applying semantic HTML, ARIA attributes, and focus management patterns directly in your UI code.

Related Skills

Explore More Software Engineering Skills→
JEO-tech-aiJEO-tech-ai
8

web-accessibility

Apply WCAG 2.1 guidelines to identify and fix accessibility gaps in web UIs.

Community
Advanced
samjhechtsamjhecht
4

frontend-accessibility-verification

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

Community
Advanced
epicweb-devepicweb-dev
5.5k

epic-ui-guidelines

Guides React developers to implement accessible UI components with Tailwind CSS and Radix UI.

Official
Basic
themewagonthemewagon
1

accessibility

Identify and fix UI accessibility gaps to meet WCAG 2.1 AA standards.

Official
Advanced