skills.rest
nattergabriel
nattergabrielCOMMUNITY
Explore all skills by this author →
𝕏@eterdevGitHub

accessibility

Identify and resolve accessibility gaps in web user interfaces using ARIA guidelines.

2|Updated Mar 18, 2026
Search Tags:#accessibility#a11y#semantic-html#screen-reader#color-contrast#aria#keyboard-navigation
One-click install
npx skills add https://github.com/nattergabriel/oasis-greenhouse --skill accessibility-nattergabriel
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: accessibility
Source: https://github.com/nattergabriel/oasis-greenhouse/tree/main/frontend/.claude/skills/accessibility
Command: npx skills add https://github.com/nattergabriel/oasis-greenhouse --skill accessibility-nattergabriel

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Accessibility patterns and best practices for web apps. Use when building UI components, forms, modals, dropdowns, tabs, toggles, or any interactive elements. Also use when the user mentions ARIA, screen readers, keyboard navigation, focus management, color contrast, or accessible HTML.

Core Features & Use Cases

  • Semantic HTML and proper labeling for form controls
  • ARIA roles and attributes to communicate dynamic content and states
  • Focus management for modals, menus, and custom widgets
  • Keyboard navigation and readable color contrast across components
  • Use Case: ensure interactive elements are reachable via keyboard and announced correctly by screen readers

Quick Start

Audit the current UI for accessibility gaps and implement recommended a11y patterns for forms, modals, tabs, and navigation.

Frequently Asked Questions about accessibility

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

FAQPage Schema
How do I make web modals and dropdowns accessible with keyboard navigation and ARIA?▼

Make modals and dropdowns accessible by applying ARIA roles, managing focus traps, and enforcing keyboard navigation. Semantic HTML and proper labeling ensure interactive elements are reachable and announced correctly by screen readers.

What is the best way to fix color-contrast compliance in web UI components?▼

Fix color-contrast compliance by auditing interactive elements and applying readable contrast ratios across components. Enforce accessible patterns to ensure text remains legible for users with visual impairments and meets a11y guidelines.

When do I need ARIA attributes for semantic HTML forms?▼

You need ARIA attributes for semantic HTML forms when communicating dynamic content and states. Proper labeling and ARIA roles ensure form controls are fully accessible and correctly announced by screen readers.

How do I resolve accessibility gaps in custom tabs and toggles?▼

Resolve accessibility gaps in tabs and toggles by applying a11y patterns for focus management and keyboard navigation. Ensure proper ARIA attributes communicate dynamic states so custom widgets are usable with assistive technologies.

Can I audit my current UI for screen-reader support and focus management issues?▼

You can audit your current UI for screen-reader support by identifying accessibility gaps in focus management and component patterns. Implement recommended a11y patterns to ensure interactive elements are reachable and announced correctly.

Why does my custom widget lose keyboard navigation and focus management?▼

Custom widgets lose keyboard navigation and focus management when lacking proper ARIA patterns and semantic HTML. Apply focus management techniques for menus and modals to restore keyboard accessibility and screen-reader support.

Related Skills

Explore More Design & Creative Skills→
theofernandezztheofernandezz

accessibility

Identify and fix accessibility gaps in web applications to meet WCAG 2.1 AA standards.

Community
Advanced
zinohomezinohome
1

accessibility-auditor

Audit web pages for WCAG 2.1 compliance and implement accessibility fixes.

Community
Advanced
thec3ukthec3uk

Frontend Accessibility

Guide frontend code to meet accessibility standards like ARIA and keyboard navigation.

Official
Basic
CrazyDubyaCrazyDubya

accessibility-auditor

Audit web applications for WCAG 2.1 Level AA accessibility compliance.

Community
Intermediate