skills.rest
liomoti
liomotiCOMMUNITY
Explore all skills by this author →
GitHub

web-accessibility

Guide WCAG-compliant semantic HTML, ARIA, keyboard operability, and accessibility testing.

2|Updated Dec 12, 2024
Search Tags:#testing#accessibility#wcag#semantic-html#aria#keyboard-navigation
One-click install
npx skills add https://github.com/liomoti/pirkei-avot-finder --skill web-accessibility-liomoti
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-accessibility
Source: https://github.com/liomoti/pirkei-avot-finder/tree/main/.kiro/skills/web-accessibility
Command: npx skills add https://github.com/liomoti/pirkei-avot-finder --skill web-accessibility-liomoti

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Web developers and UX teams struggle to build and review accessible web interfaces that meet WCAG standards across components, pages, and apps. The skill provides structured guidance to ensure semantic HTML, ARIA usage, keyboard navigation, focus management, color contrast, and testing with popular tools.

Core Features & Use Cases

  • WCAG 2.2 AA guidance integrated into UI development and review workflows.
  • ARIA & semantic HTML best practices for reliable accessibility outcomes across assistive technologies.
  • Testing patterns with common tooling (axe, screen readers) for regular checks during design and implementation.
  • Use Case: When delivering a new form or modal, ensure keyboard operability, focus management, and proper labeling from the outset.

Quick Start

Apply semantic HTML, ensure keyboard operability, label controls with ARIA, and run WCAG-aligned testing before shipping any UI component.

Frequently Asked Questions about web-accessibility

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

FAQPage Schema
How do I make web UI components meet WCAG 2.2 AA accessibility standards?▼

Make web UI components meet WCAG 2.2 AA standards by applying semantic HTML, ARIA roles and labels, keyboard operability, focus management, and color contrast rules throughout development and review workflows.

When do I need ARIA roles and semantic HTML for web accessibility?▼

ARIA roles and semantic HTML are needed for web accessibility when labeling controls and ensuring reliable interactions across assistive technologies, especially for interactive elements like forms and modals.

What is the best way to ensure keyboard navigation and focus management in a modal?▼

The best way to ensure keyboard navigation and focus management in a modal is to enforce keyboard operability and proper focus handling from the outset, guided by WCAG-compliant semantics.

How do I test accessibility with axe and screen readers during UI development?▼

Test accessibility with axe and screen readers by running WCAG-aligned testing patterns during design and implementation to perform regular checks before shipping any UI component.

Does this accessibility guidance apply to forms and interactive navigation elements?▼

Yes, this accessibility guidance applies to forms and interactive navigation elements, ensuring proper labeling, keyboard operability, and focus management across the full UI development lifecycle.

Why does my web UI fail keyboard operability and color contrast checks despite using semantic HTML?▼

Web UI fails keyboard operability and color contrast checks when ARIA usage is incomplete or focus management is missing, requiring structured WCAG-aligned testing to identify and fix these gaps.

Related Skills

Explore More Design & Creative Skills→
grvpanchalgrvpanchal
1

ui-accessibility

Analyze semantic HTML, ARIA attributes, and keyboard navigation for accessibility issues.

Community
Advanced
redpanda-dataredpanda-data
34

setup-accessibility

Enforce WCAG 2.1 AA ARIA compliance via Claude Code hooks with Playwright and AXE.

Official
Intermediate
Colten-CovingtonColten-Covington

accessibility-audits

Audit web content for WCAG 2.2 AA compliance and assistive technology compatibility.

Community
Basic
PP-NamiasPP-Namias
2

accessibility-audit

Validate web accessibility compliance with WCAG 2.1 AA standards.

Community
Intermediate