skills.rest
OpenElementsLabs
OpenElementsLabsOFFICIAL
Explore all skills by this author →
WebsiteGitHub

web-accessibility

Identify and fix web accessibility gaps using WCAG 2.1 guidelines.

Updated Mar 7, 2026
Search Tags:#a11y#wcag#screen-reader#color-contrast#aria#keyboard-navigation#web-accessibility
One-click install
npx skills add https://github.com/OpenElementsLabs/claude-base --skill web-accessibility-openelementslabs
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-accessibility
Source: https://github.com/OpenElementsLabs/claude-base/tree/main/claude-project-base/skills/web-accessibility
Command: npx skills add https://github.com/OpenElementsLabs/claude-base --skill web-accessibility-openelementslabs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps developers ensure their web interfaces are accessible to users with disabilities by following WCAG 2.1 guidelines and ARIA best practices.

Core Features & Use Cases

  • WCAG compliance mapping for common UI components.
  • ARIA role and attribute guidance for dynamic content.
  • Quick checks during front-end development and code review to improve accessibility.

Quick Start

Run accessibility checks on a page and implement WCAG-aligned improvements to ensure screen-reader compatibility.

Frequently Asked Questions about web-accessibility

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

FAQPage Schema
How do I check my web page for WCAG 2.1 compliance?▼

Audit web accessibility by evaluating front-end components against WCAG 2.1 guidelines. This process identifies gaps in ARIA attributes, keyboard navigation, color contrast, and screen reader compatibility, providing actionable recommendations for remediation.

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

Improve screen reader compatibility by applying appropriate ARIA roles and attributes to dynamic content. This ensures assistive technologies correctly interpret UI updates, fulfilling WCAG 2.1 requirements for accessible rich internet applications.

How do I fix keyboard navigation issues in front-end components?▼

Fix keyboard navigation by reviewing front-end components for proper focus management and tab order. Applying WCAG 2.1-aligned recommendations ensures all interactive elements are operable without a mouse, improving overall web accessibility.

Can I audit a live prototype for color contrast and web accessibility?▼

Yes, you can audit color contrast and web accessibility across both live pages and prototypes. The skill evaluates visual elements against WCAG 2.1 standards to identify and provide remediation guidance for contrast failures.

Why does my dynamic content fail WCAG compliance checks?▼

Dynamic content often fails WCAG compliance due to missing or incorrect ARIA attributes and improper focus management. Applying targeted accessibility checks identifies these gaps and provides remediation steps to ensure screen reader compatibility.

Do I need manual code review to ensure web accessibility?▼

Manual code review is enhanced by running quick accessibility checks during front-end development. This maps UI components to WCAG 2.1 guidelines, validating ARIA usage and keyboard navigation before deployment.

Related Skills

Explore More Software Engineering Skills→
89jobrien89jobrien
4

web-accessibility

Audit web content for WCAG 2.1/2.2 conformance and accessibility issues.

Community
Advanced
vecearvecear

accessibility-auditor

Audit web applications for WCAG 2.1 accessibility issues.

Community
Advanced
veerababumanyamveerababumanyam

accessibility

Validate UI components against WCAG 2.1 AA accessibility standards.

Community
Basic
HouseofmvpsHouseofmvps
115

a11y

Detect and fix deterministic WCAG 2.2 A/AA accessibility violations in HTML files.

Community
Advanced