网页无障碍审查与可读配色工具
在一个专题中检查 WCAG 问题、读屏顺序、低对比度区域、色觉缺陷风险和可读配色选择，适合网页与 UI 无障碍工作流。
这个专题聚焦于页面、组件和设计改版上线前常见的无障碍检查：审查 HTML、模拟读屏顺序、用截图找低对比度区域、比较配色组合，并为真实界面挑选更安全的颜色方案。
专题信息
- 任务类型
- audit
- Families
- accessibility, design, html
- 工具数
- 11
- 子簇
- 3
为什么有这个专题
无障碍审查通常不是只跑一个检查器就结束，团队往往还需要读屏顺序、对比度、色觉缺陷和截图级别的问题定位一起看。
把 WCAG 检查、读屏模拟、热力图和配色对比工具放在一起，能让你从发现问题更快走到具体修复方案。
收录的 HTML、颜色代码和组件 samples 让你可以先测试 alt 文本、对比度组合和常见组件模式，再去检查真实产品页面。
精选工具
无障碍合规检测器
检测 HTML、网页或设计稿图片中的常见 WCAG 2.1 问题，并给出可直接修复的建议
无障碍热力图生成器
从 UI 截图或 HTML 输入生成聚焦对比度的无障碍热力图，并给出建议修补色值
无障碍审计报告生成器
检查 HTML 或 URL 中的常见 WCAG 问题，并导出按严重程度分组的 PDF 报告
读屏器模拟测试器
模拟 URL 或原始 HTML 在读屏器中的朗读顺序和语义输出，并标记可访问性缺口
色彩视觉无障碍检查器
计算 WCAG 对比度，模拟主要色觉缺陷，并可对 UI 截图中的低对比区域做标记。
颜色无障碍检查
检查颜色对比度是否符合 WCAG 标准
颜色对比度检查器
检查颜色对比度和WCAG无障碍标准合规性
无障碍色彩对比度检查器
按 WCAG 2.1 AA/AAA 审查整套调色板的颜色组合，并给出调整建议
色盲模拟器
模拟不同类型色盲患者看到的颜色
图片配色提取器
上传图片后提取主色调，导出代码可用的色板片段，并检查对比度
网站截图器
使用无头浏览器生成高质量网站截图，支持自定义选项
用 Samples 测试
accessibility, design, html相关专题
CSS 效果、配色板与设计 Token 生成工具
围绕CSS 视觉效果、配色构建与设计 Token 生成整理的一组工具。
技术 SEO、URL 与元信息工作流工具
在一个技术 SEO 专题中完成 meta 标签审查、Open Graph 生成、slug 校验、URL 参数检查，以及 robots.txt 和 sitemap 配置。
HTML 提取、清洗与 Markdown/PDF 导出工具
在一个专题里比较 HTML 清洗、属性提取、图片地址提取、HTML 转 Markdown 和 HTML 转 PDF 工具，适合网页内容转换流程。
图片整理、修饰与批处理准备工具
把图片清理、裁边、补边、加框、批量缩放压缩、水印和视觉修饰工具集中到一个专题中，适合素材整理流程。
常见问题
这个专题里可以做什么？
你可以审查 HTML 或在线页面里的 WCAG 问题，模拟读屏顺序，找出低对比度区域，比较前景/背景颜色组合，并检查整套配色在不同用户视角下是否仍然可读。
这个专题适合谁？
它适合前端开发、设计师、QA、内容团队，以及任何想让网站或组件更容易阅读、导航和理解的人。
应该怎么开始？
先从通用无障碍检查器或报告生成器开始；如果还要确认读屏顺序、颜色对比度或色觉缺陷风险，再继续使用读屏模拟和配色相关工具。