MCP Assessment

MCP课程可访问性评估工具

一个基于人工智能的网络应用程序，用于分析教育文档的可访问性合规性。上传教学大纲、作业和课程材料，以获得全面的WCAG 2.1 AA可访问性分析和可操作的建议。

概述

该工具通过以下方式帮助教育工作者创建可访问的课程内容：

• 分析WCAG 2.1 AA合规性文件 -全面的可访问性检查
• 质量问题（QM）分析 -根据QM标准评估课程材料
• 提供可操作的建议 -解决问题的具体指导
• 支持多种文件格式 -PDF、DOCX、TXT等
• UVA品牌接口 -根据弗吉尼亚大学的品牌指南建造

非常适合需要确保所有学生都能访问其课程材料的教育工作者、教学设计师和内容创作者。

主要特点

🎯 可访问性分析（主要焦点）

• WCAG 2.1 AA级合规性检查 -行业标准可访问性分析
• 问题严重性分类 -关键、警告和信息级别问题
• 特定WCAG标准识别 -确切地知道哪些指导方针失败了
• 颜色对比度检查 -确保文本符合4.5:1的比例要求
• 标题结构验证 -验证标题层次结构是否正确
• Alt文本检测 -识别缺失的图像描述
• 链接文本质量 -检查“点击此处”和模糊链接
• 文件结构 -语义HTML和适当的组织
• 可采取行动的建议 -解决问题的分步指南

📊 质量问题（QM）分析

• 完成QM评估 -所有8项通用标准均已评估
• 计分制 -共101分
• 基本标准跟踪 -11个要求的三分球标准
• 85%阈值验证 -QM认证资格检查
• 按标准细分 -准确了解您需要改进的地方

📤 轻松文档上传

• 拖放界面 -简单文件上传
• 多种文件格式 -支持PDF、DOCX、DOC、TXT、MD格式
• 10MB文件大小限制 -处理大多数课程文件
• 立即处理 -30-60秒内的结果

📈 结果可视化

• 颜色编码分数 -快速识别问题区域
• 详细明细 -见具体问题和建议
• 优先修复 -知道该先解决什么问题
• 可导出报告 -保存结果以供记录

快速开始

先决条件

• Node.js 18+ - 点击此处下载
• 无烟煤API密钥 - 在这里买一个

安装（5分钟）

1.克隆存储库：

git clone https://github.com/behartless67-a11y/MCPAssessment.git
cd MCPAssessment

2.设置API服务器：

cd api-server
npm install
echo "ANTHROPIC_API_KEY=your-key-here" > .env
npm run dev

API服务器将于启动http://localhost:3001

3.设置web前端（在新终端中）：

cd web-frontend
npm install
npm run dev

前端将从开始http://localhost:3000

4.开始分析文档！

• 打开http://localhost:3000在浏览器中
• 上传文档（PDF、DOCX或TXT）
• 选择分析类型（建议使用辅助功能）
• 点击“分析文档”
• 审查结果和建议

详细设置

看 设置.md 获取全面的安装说明、故障排除和生产部署指导。

🚀 部署到Azure（生产）

只需5分钟即可将此应用程序部署为Azure静态Web应用程序！

快速部署：

1. 将代码推送到GitHub
2. 创建Azure静态Web应用程序(portal.azure.com)
3. 连接到您的GitHub仓库
4. 添加 ANTHROPIC_API_KEY 到Azure配置
5. 完成！您的应用程序将在全球范围内运行

请参阅完整的部署指南：

• 快速入门： DEPLOYMENT-QUICKSTART.md -5分钟导游
• 完整指南： AZURE-DEPLOYMENT.md -完整的说明和截图

成本： 可用免费套餐（100 GB带宽/月）

运作原理

分析类型

1.可访问性分析（推荐）

• 全面的WCAG 2.1 AA级合规性检查
• 识别关键问题、警告和信息项
• 提供失败的特定WCAG标准
• 包括针对每个问题的可操作建议
• 检查颜色对比度、标题结构、alt文本、链接文本等

2.质量问题分析

• 根据所有8个QM通用标准进行评估
• 总分101分
• 确定满足哪些基本标准
• 显示QM认证的85%阈值状态
• 提供标准细分和建议

3.一般审查

• 记录具体建议
• 教育材料的最佳实践
• 内容结构建议
• 可访问性和可用性改进

分析什么

该工具检查文档的以下内容：

可访问性问题：

• 颜色对比度（WCAG AA:4.5:1，适用于普通文本）
• 标题层次结构（正确的H1→H2→H3结构）
• 图像的替代文本
• 链接文本质量（避免“点击此处”）
• 文件语言规范
• 键盘可访问性
• 焦点指标
• 表单标签
• 语义结构

质量事项标准：

• 标准1：课程概述和介绍
• 标准2：学习目标/能力
• 标准3：评估和测量
• 标准4：教学材料
• 标准5：学习活动和学习者互动
• 标准6：课程技术
• 标准7：学习者支持
• 标准8：可访问性和可用性

文档结构：

• 清晰的信息层次结构
• 正确使用标题和副标题
• 逻辑读取顺序
• 格式一致
• 专业演示

示例分析结果

可访问性分析输出

Accessibility Score: 72/100

Critical Issues (3):
❌ Missing alt text on 5 images (WCAG 1.1.1)
❌ Color contrast ratio 3.2:1 on heading text (needs 4.5:1) (WCAG 1.4.3)
❌ Skipped heading level: H1 to H3 (WCAG 1.3.1)

Warnings (2):
⚠️ Generic link text "click here" (WCAG 2.4.4)
⚠️ Document language not specified (WCAG 3.1.1)

Recommendations:
1. Add descriptive alt text to all images
2. Change heading color to #232D4B for better contrast
3. Add H2 heading between H1 and H3
4. Replace "click here" with descriptive link text
5. Add lang="en" attribute to document

质量问题输出

Overall Score: 78/101 points (77%)
Status: Below 85% threshold ❌

Standard Scores:
✅ Standard 1: Course Overview - 11/12 points
✅ Standard 2: Learning Objectives - 12/14 points
❌ Standard 3: Assessment - 8/15 points (Essential standard missing)
✅ Standard 4: Instructional Materials - 10/13 points
...

Critical Issues:
- Essential Standard 3.1 not met: Assessment rubrics missing
- Essential Standard 3.3 not met: No alignment between objectives and assessments

Recommendations:
1. Add detailed rubrics for all assessments
2. Create alignment matrix showing objectives to assessments
3. Include clear grading criteria

建筑

┌─────────────────────────────────────┐
│         Web Frontend                │
│   (Next.js + React + Tailwind)     │
│         Port 3000                   │
└──────────────┬──────────────────────┘
               │ HTTP/API Calls
               ↓
┌─────────────────────────────────────┐
│         API Gateway                 │
│   (Express + Claude AI)             │
│         Port 3001                   │
└──────────────┬──────────────────────┘
               │ Anthropic API
               ↓
┌─────────────────────────────────────┐
│      Claude AI (Sonnet 4.5)        │
│   WCAG & QM Analysis Engine         │
└─────────────────────────────────────┘

技术栈

前端：

• Next.js 14（React框架）
• 顺风CSS（样式）
• TypeScript
• 通过拖放上传文件
• 响应式设计

后端：

• Express.js（API服务器）
• 人工克劳德AI（分析引擎）
• 猛犸象（DOCX处理）
• PDF.js（PDF文本提取）
• CORS已启用

MCP服务器（可选）：

• 模型上下文协议实现
• 可与Claude Desktop配合使用
• 品牌套件和模板管理

文档和资源

包含的文档

• 设置.md -详细的设置和安装指南
• 测试.md -带有示例文档的测试指南
• UVA-品牌指南.md -完成WCAG 2.1 AA检查表
• 质量模式指南.md -QM第7版标准

外部资源

• WCAG 2.1快速参考
• 质量问题
• WebAIM对比度检查器
• 克劳德人类学文献

贡献

欢迎投稿！该工具旨在帮助教育工作者创建更易于访问的内容。

贡献领域

• 附加分析功能
• 支持更多文件格式
• 改进无障碍建议
• 与LMS平台集成
• 更好的错误处理
• 性能改进
• 文档改进

路线图

2.0版本（计划中）

• \[\]批量文档处理
• \[\]导出分析报告（PDF，DOCX）
• \[\]历史跟踪和比较
• \[\]自定义可访问性规则
• \[\]与Canvas LMS集成
• \[\]用于第三方集成的API
• \[\]多语言支持
• \[\]自动修复建议

3.0版本（未来）

• \[\]实时文档编辑，实时反馈
• \[\]协作评审功能
• \[\]全机构分析仪表板
• \[\]自定义品牌配置文件
• \[\]基于人工智能的内容改进建议

成本和使用

API成本

此工具使用Anthropic Claude API：

• 根据分析： ~$0.05 - $0.15
• 每月100次分析： ~$5-15
• 每月1000次分析： ~$50-150

成本取决于文档大小和分析复杂性。

获取API密钥

1. 访问 console.anthropic.com
2. 注册或登录
3. 导航到API键
4. 创建新密钥
5. 添加到 .env api服务器目录中的文件

常见问题

Q： 支持哪些文件格式？ A： PDF、DOCX、DOC、TXT和MD文件，最大10MB。

Q： 分析需要多长时间？ A： 通常为30-60秒，具体取决于文档大小。

Q： 我的文档数据是否已存储？ A： 不，文档在内存中处理，并在分析后立即删除。

Q： 我可以将其用于商业目的吗？ A： 是的，该工具获得了麻省理工学院的许可。但是，您需要自己的Anthropic API密钥。

Q： 这个离线工作吗？ A： 不，使用Claude AI API需要互联网连接。

Q： 可访问性分析的准确性如何？ A： 该工具提供了由Claude AI支持的全面WCAG 2.1 AA分析。但是，对于关键的合规性，仍建议进行手动审查。

Q： 我可以自定义分析标准吗？ A： 目前使用标准WCAG 2.1 AA和QM第7版标准。计划在v2.0中使用自定义规则。

故障排除

问题：“获取失败”错误

• 确保API服务器正在端口3001上运行
• 检查您的Anthropic API密钥是否设置在 .env
• 验证防火墙没有阻止本地主机连接

问题：“无法从文件中提取文本”

• 先尝试一个简单的.txt文件来验证设置
• 对于PDF：确保它是文本PDF，而不是扫描图像
• 对于DOCX：验证文件是否损坏

问题：分析时间过长

• 第一次分析可能需要60多秒
• 大文件（>5MB）需要更长的时间
• 检查您的互联网连接

看 测试.md 了解更多故障排除提示。

许可证

MIT许可证-可以自由使用、修改和分发。

致谢

内置：

• 人猿克劳德AI
• Next.js
• Express.js
• 质量问题
• WCAG指南

支持

• 问题： 打开一个问题
• 文档： 看 设置.md 和 测试.md
• 讨论： 使用GitHub讨论来回答问题和功能请求

______________________________________________________________________

教育者为教育者而生。使所有学生都能访问课程内容。 🎓♿