Wcag Text MCP

WCAG MCP服务器套件

用于WCAG 2.1可访问性验证的模块化MCP（模型上下文协议）服务器套件。

建筑

此monorepo包含单独的专注服务器和一个伞式服务器，用于全面覆盖WCAG：

packages/
├── core/       # Shared types, criteria definitions, report formatting
├── text/       # Text accessibility (contrast, spacing, language)
├── keyboard/   # Keyboard navigation and focus (2.1.x, 2.4.x)
├── aria/       # ARIA roles, states, properties (4.1.x)
├── media/      # Captions, audio descriptions (1.2.x)
├── forms/      # Labels, error handling (1.3.x, 3.3.x)
├── structure/  # Headings, landmarks, reading order (1.3.x, 2.4.x)
└── full/       # Umbrella combining all servers

快速开始

# Install dependencies
npm install

# Build all packages
npm run build

# Or build individually
npm run build:core
npm run build:text
npm run build:keyboard
# etc.

包裹

@wcag-mcp/核心

共享库：

• 用于检查结果、报告、标准的TypeScript类型
• 完成WCAG 2.1标准定义（78个标准）和类别
• 报告格式化实用程序（人类可读和机器可读）

@wcag mcp/text

文本可访问性验证。

WCAG标准： 1.4.3, 1.4.4, 1.4.5, 1.4.6, 1.4.8, 1.4.10, 1.4.12, 3.1.1, 3.1.2

工具：

• check_contrast -色彩对比度（AA/AAA）
• check_text_spacing -行高、字母/单词间距
• check_line_length -最多80个字符（AAA）
• check_language -页面语言属性
• validate_text -全面的文本验证
• get_wcag_text_criteria -参考数据

@wcag mcp/键盘

键盘和指针可访问性验证。

WCAG标准： 2.1.1, 2.1.2, 2.1.4, 2.2.1, 2.2.3, 2.4.3, 2.4.7, 2.5.1, 2.5.2, 2.5.4, 2.5.5, 3.2.1

工具：

• check_keyboard_access -键盘可操作性，焦点捕捉
• check_focus_indicator -聚焦可见度和对比度
• check_timing -时限可调性
• check_motion -运动驱动控制
• check_pointer_gestures -复杂的手势替代方案
• check_pointer_cancellation -取消活动
• check_target_size -触摸目标尺寸
• get_wcag_keyboard_criteria -参考数据

@wcag mcp/aria

ARIA和语义可访问性验证。

WCAG标准： 2.5.3, 4.1.1, 4.1.2, 4.1.3

工具：

• check_name_role_value -可访问的名称、角色、状态
• check_status_message -实时区域公告
• check_aria_attributes -ARIA属性有效性
• check_landmarks -地标区域标签
• check_label_in_name -可访问名称中的可见标签
• get_wcag_aria_criteria -参考数据

@wcag mcp/媒体

媒体可访问性验证。

WCAG标准： 1.2.1-1.2.9, 1.4.2, 2.2.2, 2.3.1, 2.3.2, 2.3.3

工具：

• check_captions -字幕可用性（预先录制/现场直播）
• check_audio_description -视频音频描述
• check_transcript -媒体文本替代方案
• check_media_controls -自动播放控制机制
• check_animation -动画暂停/停止控件
• check_flashing -闪光频率阈值
• check_sign_language -手语翻译
• get_wcag_media_criteria -参考数据

@wcag mcp/表格

表单可访问性验证。

WCAG标准： 1.3.5, 3.2.2, 3.3.1-3.3.6

工具：

• check_form_labels -标签关联
• check_input_purpose -自动补全属性
• check_error_identification -错误消息
• check_error_prevention -提交保障措施
• check_input_constraints -格式说明
• check_on_input -输入上下文更改
• validate_form -全面的表单验证
• get_wcag_forms_criteria -参考数据

@wcag-mcp/结构

页面结构和导航验证。

WCAG标准： 1.3.1, 1.3.2, 2.4.1, 2.4.2, 2.4.4, 2.4.5, 2.4.6, 2.4.9, 2.4.10, 3.2.3, 3.2.4

工具：

• check_heading_structure -标题层次结构
• check_page_title -标题描述
• check_link_purpose -链接文本清晰度
• check_bypass_blocks -跳过链接、地标
• check_reading_order -DOM/视觉顺序匹配
• check_info_relationships -语义结构
• check_multiple_ways -导航方式
• check_consistent_navigation -导航一致性
• check_consistent_identification -组件标签
• get_wcag_structure_criteria -参考数据

@wcag mcp/full

带概述和导出工具的伞形服务器。

工具：

• get_all_wcag_criteria -按级别/类别筛选的所有条件
• get_wcag_checklist -合规性等级检查表
• wcag_help -使用帮助
• export_report -将任何检查的结果导出到Markdown文件

导出结果

任何WCAG检查工具都会返回 MACHINE-READABLE 输出中的JSON块。将JSON传递给 export_report 要保存格式化的Markdown报告，请执行以下操作：

WCAG_Results_2026-02-24.md

报告包括：

• 汇总表（总计/通过/失败/警告）
• 按合规级别细分（A/AA/AAA）
• 带有建议和WCAG参考链接的详细故障
• 警告和通过检查

可选参数：

• outputDir --保存文件的目录（默认为当前工作目录）
• title --自定义报告标题
• url --被审核页面的URL
• notes --报告附加说明

使用Claude代码

添加到您的 .mcp.json:

{
  "mcpServers": {
    "wcag-text": {
      "command": "node",
      "args": ["/path/to/wcag-mcp/packages/text/dist/index.js"]
    },
    "wcag-keyboard": {
      "command": "node",
      "args": ["/path/to/wcag-mcp/packages/keyboard/dist/index.js"]
    },
    "wcag-aria": {
      "command": "node",
      "args": ["/path/to/wcag-mcp/packages/aria/dist/index.js"]
    },
    "wcag-media": {
      "command": "node",
      "args": ["/path/to/wcag-mcp/packages/media/dist/index.js"]
    },
    "wcag-forms": {
      "command": "node",
      "args": ["/path/to/wcag-mcp/packages/forms/dist/index.js"]
    },
    "wcag-structure": {
      "command": "node",
      "args": ["/path/to/wcag-mcp/packages/structure/dist/index.js"]
    }
  }
}

或者使用雨伞服务器：

{
  "mcpServers": {
    "wcag": {
      "command": "node",
      "args": ["/path/to/wcag-mcp/packages/full/dist/index.js"]
    }
  }
}

自动批准工具

默认情况下，Claude Code在每次MCP工具调用时都会提示用户请求权限。要自动批准所有WCAG工具，请将其添加到您的Claude Code设置中。

每个项目 (.claude/settings.local.json):

{
  "permissions": {
    "allow": [
      "mcp__wcag*"
    ]
  }
}

全球 (~/.claude/settings.json):

{
  "permissions": {
    "allow": [
      "mcp__wcag*"
    ]
  }
}

通配符 mcp__wcag* 匹配来自每个WCAG MCP服务器的所有工具（WCAG文本、WCAG键盘、WCAG aria等）。

发展

# Watch mode for development
cd packages/text && npm run dev

# Build all
npm run build

# Clean all dist folders
npm run clean

添加新支票

从导入共享实用程序 @wcag-mcp/core:

import {
  createReport,
  formatToolResponse,
  getCriteriaByCategory,
  type CheckResult
} from "@wcag-mcp/core";

// Get criteria for a category
const criteria = getCriteriaByCategory("keyboard");

// Create a check result
const result: CheckResult = {
  criterion: "2.1.1",
  name: "Keyboard",
  level: "A",
  status: "pass",
  message: "All functionality is keyboard accessible"
};

// Create formatted report
const report = createReport([result], {
  title: "My Check",
  category: "keyboard"
});

许可证

麻省理工学院