skills.rest
iulspop
iulspopCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

frontend-accessibility-best-practices

Review React components for accessibility best practices and WCAG standards.

Updated Feb 10, 2026
Search Tags:#accessibility#a11y#web development#frontend#react#wcag
One-click install
npx skills add https://github.com/iulspop/misc-skills --skill frontend-accessibility-best-practices-iulspop
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-accessibility-best-practices
Source: https://github.com/iulspop/misc-skills/tree/main/.agents/skills/frontend-accessibility-best-practices
Command: npx skills add https://github.com/iulspop/misc-skills --skill frontend-accessibility-best-practices-iulspop

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps developers create more accessible web applications by providing guidelines and best practices for building user interfaces that are usable by everyone, regardless of ability.

Core Features & Use Cases

  • Accessibility Auditing: Review code for common accessibility anti-patterns.
  • Best Practice Guidance: Learn how to implement semantic HTML, ARIA attributes, and keyboard navigation.
  • Use Case: When building a new form component, consult this Skill to ensure it's usable with screen readers and keyboard-only navigation.

Quick Start

Review the accessibility best practices for semantic HTML and keyboard navigation.

Frequently Asked Questions about frontend-accessibility-best-practices

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

FAQPage Schema
How do I make my React components accessible for screen readers?▼

Ensure keyboard navigation in web interfaces by implementing logical tab order, visible focus states, and standard key interactions for interactive elements. This allows users relying on keyboards to fully operate forms and UI components without a mouse.

What are the WCAG best practices for building accessible forms?▼

WCAG best practices for accessible forms involve using proper semantic HTML elements, accurate ARIA labeling, and robust screen reader support. Adhering to these ARIA guidelines ensures forms are inclusive and usable for everyone regardless of ability.

Does this Skill help audit my code for accessibility anti-patterns?▼

Yes, this Skill helps audit your code for common accessibility anti-patterns. It reviews your frontend implementation against established best practices to identify semantic HTML, ARIA, and keyboard navigation issues in your React components.

How do I ensure keyboard navigation works properly in my frontend application?▼

Ensure keyboard navigation in web interfaces by implementing logical tab order, visible focus states, and standard key interactions for interactive elements. This allows users relying on keyboards to fully operate forms and UI components without a mouse.

When do I need to use ARIA attributes in web development?▼

Use ARIA attributes in web development when semantic HTML alone cannot convey the proper role, state, or property of an interactive UI component. Adhering to ARIA guidelines ensures screen readers accurately interpret dynamic frontend elements.

Related Skills

Explore More Software Engineering Skills→
jngong-collabjngong-collab
1

web-development

Develop static websites with CloudBase SDK integration and Vite build setup.

Community
Advanced
zinohomezinohome
1

accessibility-auditor

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

Community
Advanced
esneiderbravoesneiderbravo
1

accessibility-standards

Audit UI accessibility for WCAG 2.2 AA compliance with automated and manual checks.

Community
Intermediate
OneWave-AIOneWave-AI
245

code-review-pro

Review code for security vulnerabilities, performance bottlenecks, and maintainability issues.

Official
Basic