Accessibility

Provide guidelines for building accessible web applications with semantic HTML and ARIA.

Updated Feb 11, 2026
One-click install
npx skills add https://github.com/daniel-heydari-dev/personal-ai-skills --skill accessibility-daniel-heydari-dev
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: Accessibility
Source: https://github.com/daniel-heydari-dev/personal-ai-skills/tree/main/templates/claude/.claude/skills/accessibility
Command: npx skills add https://github.com/daniel-heydari-dev/personal-ai-skills --skill accessibility-daniel-heydari-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps developers build web applications that are usable by everyone, including people with disabilities, by providing guidelines and best practices for accessibility.

Core Features & Use Cases

  • Semantic HTML: Ensures proper structure and meaning in web content.
  • Keyboard Navigation: Guarantees all interactive elements are accessible via keyboard.
  • ARIA Implementation: Enhances accessibility for assistive technologies.
  • Image & Media Accessibility: Provides alternative text and captions.
  • Form Accessibility: Makes forms usable and understandable.
  • Color & Contrast: Adheres to contrast ratio standards.
  • Testing Guidance: Recommends tools and a checklist for validation.

Quick Start

Apply the accessibility skill to ensure the current web project adheres to WCAG guidelines.

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 application accessible for keyboard navigation?

Web accessibility compliance requires following WCAG guidelines for semantic HTML, keyboard navigation, ARIA, and color contrast. This Skill provides comprehensive best practices to ensure your application is usable by people with disabilities.

What is the best way to implement ARIA for assistive technologies?

ARIA implementation enhances accessibility for assistive technologies by adding semantic roles and states to HTML elements. This Skill provides best practices to ensure screen readers accurately interpret dynamic web content.

How do I design accessible forms and ensure proper color contrast?

Accessible forms require clear labels and usable input structures, while color contrast must adhere to specific ratio standards. This Skill provides design guidelines to make forms understandable and visually accessible for all users.

What testing methodologies should I use to validate WCAG compliance?

Validating WCAG compliance involves using specific testing methodologies and checklists to identify accessibility barriers. This Skill recommends validation tools and provides a checklist to ensure your web application meets inclusive design standards.

When do I need to add alternative text for image and media accessibility?

Alternative text for image and media accessibility is needed whenever visual content conveys meaningful information. This Skill provides guidelines for adding captions and text alternatives to ensure inclusivity for users with visual impairments.