Accessibility issues
macOS bootstrap dotfiles: Brewfile, declarative symlinks, app prefs, macOS defaults, agent skills, vault secrets, make doctor. Fork-friendly.
npx -y skills add t4sh/dotfiles --skill accessibility-issuesAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
2 things to look at
- no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
- 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.
What its author says it does
Copied from the file, not written here
Use when animation excludes users with vestibular disorders, cognitive disabilities, or assistive technology needs
SKILL.md
2.4 KB, as published. Nobody here has run it
Accessibility Issues
Make animations inclusive using Disney's principles thoughtfully.
Problem Indicators
- Motion sickness complaints
- Vestibular disorder triggers
- Screen reader confusion
- Cognitive overload
- Seizure risk (flashing)
- Keyboard focus lost during animation
Diagnosis by Principle
Squash and Stretch
Issue: Excessive distortion causes disorientation
Fix: Reduce or eliminate squash/stretch for users with prefers-reduced-motion. Use opacity changes instead.
Secondary Action
Issue: Too many moving elements Fix: Limit to one animated element at a time. Secondary actions should be subtle or removed.
Exaggeration
Issue: Dramatic motion triggers vestibular responses Fix: Reduce scale, rotation, and position changes. Keep movements small and predictable.
Timing
Issue: Animations too fast or too slow Fix: Provide consistent, predictable timing. Avoid sudden speed changes.
Arcs
Issue: Curved motion paths cause tracking difficulty Fix: Use linear motion for essential UI. Save arcs for optional decorative elements.
Quick Fixes
- Respect
prefers-reduced-motion- Always check and honor - No autoplay animation - Let users trigger motion
- Keep focus visible - Never animate focus indicator away
- Announce changes - Use ARIA live regions for dynamic content
- Provide pause controls - For any looping animation
Troubleshooting Checklist
- Does animation respect
prefers-reduced-motion? - Is there a way to pause/stop animations?
- Are state changes announced to screen readers?
- Does keyboard focus remain visible and logical?
- Is flash rate under 3 per second?
- Can users complete tasks without animation?
- Are animations triggered by user action (not autoplay)?
- Test with screen reader enabled
Code Pattern
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
}
}
// Check preference in JS
const prefersReducedMotion = window.matchMedia(
'(prefers-reduced-motion: reduce)'
).matches;