skills.rest
HDeibler
HDeiblerCOMMUNITY
Explore all skills by this author →
GitHub

accessibility-robust

Audit UI markup for semantic HTML and correct ARIA usage.

6|3|Updated May 3, 2026
Search Tags:#accessibility#semantic html#screen readers#aria#wcag 4.1#live regions
One-click install
npx skills add https://github.com/HDeibler/universal-design-principles --skill accessibility-robust
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: accessibility-robust
Source: https://github.com/HDeibler/universal-design-principles/tree/main/plugins/process-and-robustness-principles/skills/accessibility-robust
Command: npx skills add https://github.com/HDeibler/universal-design-principles --skill accessibility-robust

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Ensuring your interface is robust enough that assistive technologies (like screen readers and voice control) can correctly interpret your UI across browsers, components, and frameworks.

Core Features & Use Cases

  • Compatible markup: Use semantic HTML first so name, role, and value are programmatically determinable for every UI component.
  • Reliable status announcements: Publish dynamic updates (validation, toasts, search-result changes) through live regions without focus shifts.
  • ARIA done only when needed: Apply ARIA only to non-native widgets or to add missing state, while avoiding conflicting roles that break semantics.

Use cases include deciding between semantic elements vs custom components, adding ARIA for custom controls, and auditing a UI built heavily from <div> elements for assistive-technology robustness.

Quick Start

Use the accessibility-robust skill to review a UI and identify where semantic HTML is missing, where ARIA is conflicting or incomplete, and whether status messages are announced via appropriate live regions.

Frequently Asked Questions about accessibility-robust

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

FAQPage Schema
How do I make custom UI components readable by screen readers?▼

Ensure dynamic UI updates like toasts and validation messages are announced by screen readers without shifting focus by configuring DOM-ready live regions with appropriate ARIA attributes.

When should I use ARIA roles instead of semantic HTML for accessibility?▼

Audit a UI built heavily from div elements for assistive-technology robustness by identifying missing semantic HTML, checking for conflicting or incomplete ARIA, and verifying that status messages use appropriate live regions.

How do I announce dynamic UI updates to screen readers without changing focus?▼

Ensure dynamic UI updates like toasts and validation messages are announced by screen readers without shifting focus by configuring DOM-ready live regions with appropriate ARIA attributes.

How do I audit a div-based UI for assistive technology robustness?▼

Audit a UI built heavily from div elements for assistive-technology robustness by identifying missing semantic HTML, checking for conflicting or incomplete ARIA, and verifying that status messages use appropriate live regions.

Why does my ARIA markup break screen reader announcements?▼

Use ARIA roles instead of semantic HTML only when building non-native widgets or adding missing states that native elements cannot provide, ensuring you avoid conflicting roles that break underlying semantics.

Related Skills

Explore More Design & Creative Skills→
peopledearpeopledear
1

Frontend Accessibility

Audit web interfaces for WCAG, ARIA, keyboard navigation, and semantic HTML.

Official
Basic
Sumeet138Sumeet138
1

screen-reader-testing

Test web interfaces with VoiceOver, NVDA, JAWS, and TalkBack.

Community
Intermediate
tsuji-tomonoritsuji-tomonori

a11y-semantic-html

Correct HTML semantics, ARIA attributes, and accessible names to meet WCAG 2.2 AA.

Community
Intermediate
CivicActionsCivicActions
2

accessibility-audit

Audit web pages and components for WCAG 2.1 AA and Section 508 compliance.

Official
Advanced