skills.rest
sharegpu
sharegpuOFFICIAL
Explore all skills by this author →
WebsiteGitHub

a11y-debugging

Audit web pages for accessibility issues against web.dev guidelines.

Updated Mar 26, 2026
Search Tags:#accessibility#a11y#audit#semantic-html#aria#keyboard-navigation#focus-management
One-click install
npx skills add https://github.com/sharegpu/gpushare-plugins --skill a11y-debugging-sharegpu
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: a11y-debugging
Source: https://github.com/sharegpu/gpushare-plugins/tree/main/plugins/chrome-devtools-mcp/skills/a11y-debugging
Command: npx skills add https://github.com/sharegpu/gpushare-plugins --skill a11y-debugging-sharegpu

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Accessibility issues in web pages can hide semantic gaps, aria misconfigurations, and contrast problems that hinder users with disabilities. This Skill helps identify and guide remediation to meet web.dev guidelines.

Core Features & Use Cases

  • Automated accessibility tree capture and auditing using Chrome DevTools MCP.
  • ARIA label verification, semantic HTML checks, focus state validation, keyboard navigation testing, and color contrast analysis.
  • Use Case: QA engineers can run a full accessibility audit on product pages and generate actionable fixes for developers.

Quick Start

Run an accessibility audit on the target page and review the generated report for violations and recommendations.

Frequently Asked Questions about a11y-debugging

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

FAQPage Schema
How do I run an accessibility audit on a web page using Chrome DevTools?▼

To run an accessibility audit, this Skill connects to Chrome DevTools MCP to capture the accessibility tree, analyze semantic HTML, and generate a report of violations and actionable fixes. It validates ARIA labels, focus management, color contrast, and keyboard navigation.

What is the best way to fix ARIA misconfiguration and semantic HTML gaps?▼

The best way to fix ARIA misconfiguration is to automate an audit of the accessibility tree, which identifies semantic HTML gaps and ARIA labeling issues, then provides actionable remediation steps to meet web.dev guidelines.

Can I test keyboard navigation and focus management automatically?▼

Yes, you can test keyboard navigation and focus management automatically. The Skill captures the accessibility tree via Chrome DevTools MCP to validate focus states and ensure keyboard navigation meets web.dev guidelines.

Does automated accessibility auditing work for color contrast analysis?▼

Automated accessibility auditing does work for color contrast analysis. The Skill evaluates color contrast alongside semantic HTML, ARIA labels, and focus management to identify issues and generate actionable fixes.

Do I need Chrome DevTools MCP integration to perform ARIA label verification?▼

Yes, you need Chrome DevTools MCP integration to perform ARIA label verification. The Skill requires this tooling to capture the accessibility tree and perform snapshot analysis for automated reporting.

What are the limitations of automated semantic HTML audits?▼

Automated semantic HTML audits identify structural gaps and ARIA misconfigurations, but complex keyboard navigation and focus management issues may require manual verification to fully meet web.dev accessibility guidelines.

Related Skills

Explore More Software Engineering Skills→
projetsXprojetsX

web-interface-testing

Automate web UI testing for accessibility, performance, and console diagnostics via MCP Chrome DevTools.

Community
Intermediate
mikeparcewskimikeparcewski
8

accessibility

Audit web interfaces for WCAG 2.1 AA accessibility gaps and remediation.

Community
Advanced
nanorepublicananorepublica
61

Frontend Accessibility

Enforce frontend accessibility compliance in HTML, CSS, and JavaScript components.

Community
Basic
pecorapromotionsllc-cellpecorapromotionsllc-cell

browser-testing-with-devtools

Test UI components in real browsers using Chrome DevTools MCP.

Community
Advanced