Accessibility
Skill manikumarkv/devrunway-claude-plugin/skills/accessibility
Web accessibility (a11y) standards — semantic HTML, ARIA, keyboard navigation, focus management, forms, dynamic content. Load when writing or reviewing any UI component or page.From its SKILL.md
npx -y skills add manikumarkv/devrunway-claude-plugin --skill accessibilityAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 0 stars0 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
1.6 KB, as published. Nobody here has run it
Full rules in accessibility.md. Always-on summary:
Never:
<div onClick>or<span onClick>for interactive elements — use<button>or<a>- Images without descriptive
alttext — always setalt=on<img>elements; decorative images userole="presentation", informative images must describe the content - Form inputs without an associated
<label> tabIndexvalues > 0 (breaks natural tab order)aria-labelthat duplicates visible text- Color as the only way to convey meaning
- Auto-playing audio or video
Always:
- Semantic HTML first —
<nav>,<main>,<header>,<button>,<a href> - Keyboard navigable: every interactive element reachable and operable by keyboard
- Focus visible: never
outline: nonewithout a custom focus style aria-livefor content that updates without a page reload- Focus trap inside modals/dialogs; restore focus on close
- Error messages linked to their input with
aria-describedby - Custom interactive elements must handle
onKeyDown(Enter/Space/Arrow keys) and be focusable withtabIndex={0}
Related skills — apply together:
- Your frontend layer skill — semantic HTML is the foundation of accessible UI
- Your testing layer skill — role/label-based selectors enforce accessibility in tests
- Your E2E testing layer skill — keyboard navigation and screen reader flows belong in E2E tests