mcpField
C
compliance-mapping

compliance-mapping

github.com/owl-listenerDesign & UI10874 installsUpdated 20w ago
Repository

About compliance-mapping

A skill that maps design decisions to accessibility standards for design teams conducting reviews or preparing for audits. It provides mappings for WCAG 2.2 AA and related legal frameworks to help identify potential conformance issues before implementation.

Key features

  1. 01Map visual design decisions to WCAG
  2. 02Map interaction decisions to WCAG
  3. 03Map content and structure decisions to WCAG
  4. 04Map motion and timing decisions to WCAG
  5. 05Guide design reviews and audit preparation

Use cases

  1. 01Check relevant WCAG criteria before finalizing designs
  2. 02Flag potential conformance issues during design review
  3. 03Create a product-specific pre-audit checklist

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/owl-listener/inclusive-design-skills --skill compliance-mapping

After installing, type/compliance-mappingin Claude Code to confirm it loaded.

Details

From the project README

Compliance Mapping

Map design decisions to specific accessibility standards so the team knows exactly where they stand — what's covered, what's not, and what's at risk.

Why Designers Need This

Compliance mapping is usually treated as an engineering audit task. But most conformance failures originate in design decisions made before code was written. A designer who understands which standards their decisions affect can prevent failures instead of discovering them.

Key Standards

WCAG 2.2 Level AA

The global baseline. Most laws reference this.

  • Level A: minimum (29 criteria)
  • Level AA: standard target (20 additional criteria)
  • Level AAA: aspirational (28 additional criteria)

Most organisations target Level AA. Some criteria in Level AAA are worth adopting even if not required (especially cognitive accessibility criteria).

Legal Frameworks
  • ADA (US): requires accessible digital services, courts reference WCAG 2.1 AA
  • EAA (EU): European Accessibility Act, effective June 2025, references EN 301 549 which aligns with WCAG 2.1 AA
  • Section 508 (US government): references WCAG 2.0 AA, update expected
  • EN 301 549 (EU): the technical standard behind EAA, aligned with WCAG 2.1 AA plus additional requirements for software, hardware, and documentation

Design Decision to WCAG Mapping

Colour and Visual Design
Design decisionWCAG criteria
Text contrast ratios1.4.3 Contrast (Minimum) AA
Non-text contrast1.4.11 Non-text Contrast AA
Colour not sole indicator1.4.1 Use of Color A
Text resizing to 200%1.4.4 Resize Text AA
Content reflow at zoom1.4.10 Reflow AA
Text spacing override1.4.12 Text Spacing AA
Interaction Design
Design decisionWCAG criteria
Keyboard operability2.1.1 Keyboard A
No keyboard traps2.1.2 No Keyboard Trap A
Focus visible2.4.7 Focus Visible AA
Focus order logical2.4.3 Focus Order A
Touch target size2.5.8 Target Size (Minimum) AA
No motion-only input2.5.4 Motion Actuation A
Gesture alternatives2.5.1 Pointer Gestures A
Content and Structure
Design decisionWCAG criteria
Page titles2.4.2 Page Titled A
Heading hierarchy1.3.1 Info and Relationships A
Link purpose clear2.4.4 Link Purpose (In Context) A
Language of page set3.1.1 Language of Page A
Consistent navigation3.2.3 Consistent Navigation AA
Error identification3.3.1 Error Identification A
Labels on inputs3.3.2 Labels or Instructions A
Motion and Timing
Design decisionWCAG criteria
Pause/stop/hide motion2.2.2 Pause, Stop, Hide A
No flashing content2.3.1 Three Flashes A
Timing adjustable2.2.1 Timing Adjustable A
Animation from interaction2.3.3 Animation from Interactions AAA

How to Use This

During Design

Before finalising a design decision, check which WCAG criteria it affects. This catches failures at the cheapest point to fix them.

During Review

Map the design against the relevant criteria table. Flag any decision that would cause a conformance failure.

For Audit Preparation

Use the mapping tables to create a pre-audit checklist specific to your product. This tells auditors exactly which decisions map to which criteria.

Assessment Questions

  1. Can the team map their key design decisions to WCAG criteria?
  2. Are there design decisions that would cause conformance failures?
  3. Does the team know which legal frameworks apply to their product?
  4. Is there a process for checking designs against standards before implementation?

Comments

Markdown supported