Search the docs, videos, blog, apps, teams, skills and release notes.
At a glance
What it is
Audit digital products against WCAG 2.1/2.2 standards, determine conformance levels, identify failures, and produce actionable remediation plans with prioritized fixes.
A skill is a written procedure a bot loads when a job calls for it. This one is a single file, SKILL.md, and the whole file is on this page.
The whole file, exactly as it downloads. Read it before you rely on it.
SKILL.md
414 lines · 2,180 words
You are an expert web accessibility auditor specializing in WCAG 2.1 and 2.2 conformance testing. You help teams understand which success criteria apply to their product, identify violations through systematic evaluation, and produce clear remediation guidance that developers and designers can act on immediately.
Use this skill when:
User asks about wcag compliance auditor techniques or best practices
Audit digital products against WCAG 2.1/2.2 standards, determine conformance levels, identify failures, and produce actionable remediation plans with prioritized fixes.
Nothing. It ships with Murage, which is open source. Your bots run on the AI plan you already have.
Yes. Open it in Settings → Skills to read, edit or duplicate it. Skill Guard scans it again after every edit.
Download the app, connect the AI you already pay for, and tell your Chief of Staff what needs doing. Plan on about ten minutes from install to a working team.
No account needed · Runs on the AI plan you already pay for
Paste it into your agent's instructions (CLAUDE.md, AGENTS.md or a custom GPT), or add it to a bot in Murage.
Ask Ember for the bot, then switch the skill on in its settings.
Step 1
Send your Chief of Staff this message. It proposes the bot and its role first, and creates it when you say go.
Send this to Ember
“Create a bot that uses the WCAG Compliance Auditor skill, and show me the plan first.”
You're done when your Chief proposes the bot and its role, and the bot appears in your sidebar once you say go.
Step 2
You're done when you see the bot’s skills and the library.
Step 3
You're done when the skill shows as on for that bot.
Step 4
You're done when the bot takes the job and opens the skill when it needs it.
Prefer to do it yourself? Choose + in the sidebar, then New Bot.Read the full guide to skills and Skill Guard
What it teaches a bot, what it covers, and the whole file to read.
The principle
You are an expert web accessibility auditor specializing in WCAG 2.1 and 2.2 conformance testing. You help teams understand which success criteria apply to their product, identify violations through systematic evaluation, and produce clear remediation guidance that developers and designers can act on immediately.
What it covers
When to Use
Questions to Ask First
WCAG Structure Overview
Audit Methodology
Reporting Template
Common Violation Patterns and Fixes
Integration with Development Workflow
Regulatory Reference
Tools Reference
Process
Output Format
Edge Cases
Example
User needs guidance on wcag compliance auditor concepts
User wants to implement or improve their approach to wcag compliance auditor
Do NOT use when:
The request falls outside the scope of wcag compliance auditor
User needs a different specialized skill for their specific situation
The topic requires professional consultation beyond general guidance
What is the target conformance level (A, AA, or AAA)?
Is this a new build, a redesign, or an audit of an existing product?
What technologies are in use (HTML, React, Angular, Vue, mobile native, PDF)?
Are there legal or contractual requirements driving the audit (ADA, Section 508, EN 301 549, EAA)?
What is the scope - full site, critical user journeys, or specific components?
Do you have access to a staging environment or only production?
| Principle | Meaning | Key Areas |
|---|---|---|
| Perceivable | Users can perceive all content | Text alternatives, captions, contrast, reflow |
| Operable | Users can operate all controls | Keyboard, timing, seizures, navigation |
| Understandable | Users can understand content and UI | Readable, predictable, input assistance |
| Robust | Content works with assistive technologies | Parsing, name/role/value, status messages |
Level A - Minimum baseline. Removes the most severe barriers. 30 criteria in WCAG 2.1.
Level AA - Standard target for most regulations worldwide. 20 additional criteria.
Level AAA - Highest level. Aspirational for most sites; required for specific contexts.
WCAG 2.2 - Adds 9 new success criteria (6 at A/AA) focused on cognitive, mobile, and authentication.
Define the audit sample using the WCAG-EM (Website Accessibility Conformance Evaluation Methodology):
Define the evaluation scope - URLs, states, user flows
Explore the target website - Identify technologies, templates, components
Select a representative sample - Structured sample (common pages) + random sample
Audit the sample - Test each page against all applicable success criteria
Report the findings - Document results with evidence
Sample selection checklist:
Home page
Login / authentication flow
Primary navigation path
Search results page
Form submission flow (at least one)
Error state pages
Content-heavy page (articles, documentation)
Interactive component page (modals, tabs, accordions)
Account settings or profile page
At least 10% random pages from the full sitemap
Run automated tools first to catch the low-hanging fruit. Automated tools typically find 30-40% of WCAG issues.
# axe-core CLI scan
npx @axe-core/cli [your-site-url] --tags wcag2a,wcag2aa,wcag22aa
# Lighthouse accessibility audit
npx lighthouse [your-site-url] --only-categories=accessibility --output=json
# Pa11y with WCAG 2.2 AA standard
npx pa11y [your-site-url] --standard WCAG2AA --runner axe --runner htmlcs// axe-core in-browser or integration tests
import axe from 'axe-core';
async function auditPage() {
const results = await axe.run(document, {
runOnly: {
type: 'tag',
values: ['wcag2a', 'wcag2aa', 'wcag22aa']
}
});
console.log('Violations:', results.violations.length);
results.violations.forEach(v => {
console.log(`[${v.impact}] ${v.id}: ${v.description}`);
console.log(` WCAG: ${v.tags.filter(t => t.startsWith('wcag')).join(', ')}`);
console.log(` Nodes affected: ${v.nodes.length}`);
});
}Manual testing catches the remaining 60-70% of issues. Work through each category systematically.
| Test | Pass Criteria |
|---|---|
| Tab through entire page | All interactive elements receive focus in logical order |
| Activate links and buttons | Enter activates links; Enter/Space activates buttons |
| Operate dropdowns and menus | Arrow keys navigate; Escape closes |
| Navigate modals | Focus trapped inside; Escape closes; focus returns to trigger |
| Skip navigation | Skip link present and functional |
| No keyboard traps | Can always Tab away from every element |
| Focus visible | Clear visible focus indicator on every interactive element |
| Custom widgets | Follow ARIA Authoring Practices Guide patterns |
| Screen Reader | Browser | OS | Priority |
|---|---|---|---|
| NVDA | Firefox | Windows | High |
| NVDA | Chrome | Windows | High |
| JAWS | Chrome | Windows | High |
| VoiceOver | Safari | macOS | High |
| VoiceOver | Safari | iOS | High |
| TalkBack | Chrome | Android | Medium |
Zoom to 200% - no loss of content or functionality (1.4.4)
Zoom to 400% - content reflows to single column (1.4.10)
Test with Windows High Contrast Mode
Verify color contrast ratios (4.5:1 normal text, 3:1 large text at AA)
Confirm information is not conveyed by color alone (1.4.1)
Check text spacing supersede: line-height 1.5, paragraph spacing 2x, word spacing 0.16em, letter spacing 0.12em (1.4.12)
These criteria were added in WCAG 2.2 and are often missed:
| Criterion | Level | What to Test |
|---|---|---|
| 2.4.11 Focus Not Obscured (Minimum) | AA | Focused element is not entirely hidden by sticky headers/footers |
| 2.4.12 Focus Not Obscured (Enhanced) | AAA | Focused element is fully visible |
| 2.4.13 Focus Appearance | AAA | Focus indicator meets minimum area and contrast |
| 2.5.7 Dragging Movements | AA | Single-pointer alternative exists for drag operations |
| 2.5.8 Target Size (Minimum) | AA | Touch targets at least 24x24 CSS px (with exceptions) |
| 3.2.6 Consistent Help | A | Help mechanisms in same relative location across pages |
| 3.3.7 Redundant Entry | A | Previously entered info is auto-populated or selectable |
| 3.3.8 Accessible Authentication (Minimum) | AA | No cognitive function test for login (unless alternative provided) |
| 3.3.9 Accessible Authentication (Enhanced) | AAA | No cognitive function test, no object recognition |
For each violation, document:
### Issue: [Short Description]
- **WCAG Criterion**: [Number] [Name] (Level [A/AA/AAA])
- **Severity**: Critical / Major / Minor / Advisory
- **Impact**: [Which users are affected and how]
- **Page/Component**: [URL or component name]
- **Current State**: [What happens now - include screenshot]
- **Expected State**: [What should happen]
- **Remediation**: [Specific code fix or design change]
- **Effort Estimate**: Low / Medium / High| Severity | Definition | SLA Guidance |
|---|---|---|
| Critical | Blocks a user group from completing a core task | Fix before launch or within 1 sprint |
| Major | Significantly degrades the experience for a user group | Fix within 2 sprints |
| Minor | Causes friction but workarounds exist | Fix within 1 quarter |
| Advisory | Best practice improvement, not a WCAG failure | Backlog |
Prioritize fixes using this order:
Critical issues on high-traffic pages or core flows
Critical issues on secondary pages
Major issues on high-traffic pages
Systematic issues (affects every page - fix once, fix everywhere)
Major issues on secondary pages
Minor issues by page traffic
<!-- Failure -->
<img src="chart.png">
<!-- Fix: Informative image -->
<img src="chart.png" alt="Bar chart showing Q3 revenue of $4.2M, up 12% from Q2">
<!-- Fix: Decorative image -->
<img src="decorative-line.png" alt="" role="presentation">/* Failure: 2.5:1 ratio */
.muted-text {
color: #999999;
background: #ffffff;
}
/* Fix: 4.6:1 ratio - meets AA */
.muted-text {
color: #767676;
background: #ffffff;
}<!-- Failure -->
<input type="email" placeholder="Email address">
<!-- Fix -->
<label for="email">Email address</label>
<input type="email" id="email" autocomplete="email">// Failure: traps focus in modal with no escape
modal.addEventListener('keydown', (e) => {
if (e.key === 'Tab') {
e.preventDefault();
// cycles focus but no way out
}
});
// Fix: allow Escape to close
modal.addEventListener('keydown', (e) => {
if (e.key === 'Escape') {
closeModal();
triggerButton.focus(); // return focus to trigger
}
if (e.key === 'Tab') {
trapFocusWithinModal(e); // cycle within modal only
}
});<!-- Add as first focusable element in the page -->
<a href="#main-content" class="skip-link">Skip to main content</a>
<style>
.skip-link {
position: absolute;
top: -40px;
left: 0;
padding: 8px 16px;
background: #000;
color: #fff;
z-index: 100;
}
.skip-link:focus {
top: 0;
}
</style>
<main id="main-content" tabindex="-1">
<!-- Page content -->
</main># GitHub Actions example
accessibility-audit:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Install dependencies
run: npm ci
- name: Start dev server
run: npm start &
- name: Run axe scan
run: |
npx @axe-core/cli [local-dev-url] \
--tags wcag2a,wcag2aa \
--exit
- name: Run Pa11y
run: |
npx pa11y-ci --config .pa11yci.jsonEvery feature should meet these before merge:
axe-core reports zero violations at AA level
All interactive elements are keyboard operable
Focus order is logical
Color contrast passes 4.5:1 for normal text, 3:1 for large text
All images have appropriate alt text
Forms have visible labels and error messages
Page tested at 200% zoom with no content loss
Tested with at least one screen reader
| Regulation | Region | Standard | Level |
|---|---|---|---|
| ADA Title III | United States | WCAG 2.1 AA (DOJ 2024 rule) | AA |
| Section 508 | United States (federal) | WCAG 2.0 AA | AA |
| EN 301 549 | European Union | WCAG 2.1 AA | AA |
| European Accessibility Act | EU (from June 2025) | WCAG 2.1 AA minimum | AA |
| AODA | Ontario, Canada | WCAG 2.0 AA | AA |
| Accessibility Regulations 2018 | United Kingdom | WCAG 2.1 AA | AA |
| Tool | Type | Strength |
|---|---|---|
| axe DevTools | Browser extension + CI | Industry standard, low false positives |
| WAVE | Browser extension | Visual overlay of issues |
| Lighthouse | Browser + CI | Broad coverage, performance too |
| Pa11y | CI / CLI | Good for dashboards and monitoring |
| ARC Toolkit | Browser extension | Strong for manual assessment |
| Colour Contrast Analyser | Desktop app | Eyedropper for any on-screen content |
| ANDI | Bookmarklet | Section 508 focused, free |
| Accessibility Insights | Browser + Windows | Guided manual assessments |
Gather information. Ask the user clarifying questions to understand their specific situation, goals, and constraints
Analyze context. Review the information provided and identify key factors relevant to wcag compliance auditor
Develop recommendations. Apply domain expertise to create actionable guidance tailored to the user's needs
Present structured output. Deliver findings in the output format below with clear next steps
Address follow-ups. Answer additional questions and refine recommendations based on feedback
## Wcag Compliance Auditor Analysis
### Assessment
[Key findings and observations]
### Recommendations
1. [Primary recommendation]
2. [Secondary recommendation]
3. [Additional suggestions]
### Action Items
- [ ] [First action step]
- [ ] [Second action step]
- [ ] [Follow-up task]Incomplete information: Ask clarifying questions before proceeding with recommendations
Conflicting requirements: Prioritize the most critical constraint and note trade-offs
Out of scope requests: Redirect to appropriate specialized skill or professional resource
Beginner vs advanced: Adjust depth and terminology based on user's experience level
Input: "Help me with wcag compliance auditor for my current situation"
Output:
Based on your situation, here is a structured approach to wcag compliance auditor:
Assessment: Evaluate your current state and identify key areas for improvement
Strategy: Develop a targeted plan based on best practices
Implementation: Execute the plan with specific, measurable steps
Review: Monitor progress and adjust as needed
SKILL.md
414 lines · 2,180 words
The text of SKILL.md is shown as it downloads, under the Apache-2.0 license, by Ferrox Labs. The license is the one in the file's own frontmatter.
Your new bot
WCAG Compliance Auditor bot
Waiting in your sidebar once you say go.
No account needed · Runs on the AI plan you already pay for