简体中文
a11yglass · 网站无障碍检查

检查于 2026/8/31 · https://contentglass.com/

C
68 / 100
1 个关键 · 2 个待检查

1 个关键障碍 · 另外还有 2 个待检查。

分数是如何得出的?(起始 100 分)
{n} 条 CSS 规则{nPlural}的文本对比度可能过低-18
HTML 中有 {n} 个链接没有可识别的名称-7
交付的 HTML 中没有 <h1> 标题-7
结果68 / 100
对比度 (1)文本替代?标注 (1)?结构 (1)语言缩放健壮性

可感知

关键WCAG 1.4.3 对比度(最低)

{n} 条 CSS 规则{nPlural}的文本对比度可能过低

需要:4.5:1(正常)或 3:1(大号文本)。在「假定的页面背景」情况下,无法可靠确定实际背景 —— 有疑问时请在浏览器中检查。发现的示例:{examples}

.p-qe19929 .pagelayer-heading-holder *, .pagelayer-social_grp[class*="pagelayer-social-shape"] .pagelayer-icon-holder[class*="pagelayer-facebook"], .pagelayer-social_grp[class*="pagelayer-social-shape"] .pagelayer-icon-holder[class*="pagelayer-twitter"], .pagelayer-social_grp[class*="pagelayer-social-shape"] .pagelayer-icon-holder[class*="pagelayer-google-plus"], .pagelayer-social_grp[class*="pagelayer-social-shape"] .pagelayer-icon-holder[class*="pagelayer-linkedin"]

你应当这样做: 调暗文本颜色或调亮背景,直到达到相应的最低值。切勿将颜色作为唯一的区分特征。

可操作

待检查WCAG 2.4.4 链接目的 / 4.1.2 名称、角色、值

HTML 中有 {n} 个链接没有可识别的名称

空链接,或只有图标/图片而无 alt。此处不识别通过 JavaScript 设置的 aria-label。

a

你应当这样做: 补充可见的链接文本,或对图标链接使用 aria-label 或带 alt 的图片。

待检查WCAG 1.3.1 信息与关系 / 2.4.6 标题与标签

交付的 HTML 中没有 <h1> 标题

每个页面都应以恰好一个 h1 开始。对于由 JavaScript 构建的页面,h1 可能只在浏览器中生成 —— 那时请在渲染后的 DOM 中检查。

body

你应当这样做: 插入一个有意义的 <h1> 作为第一个标题(尽量在服务器端)。

已正确解决

后续步骤

  1. {n} 条 CSS 规则{nPlural}的文本对比度可能过低. 调暗文本颜色或调亮背景,直到达到相应的最低值。切勿将颜色作为唯一的区分特征。
  2. HTML 中有 {n} 个链接没有可识别的名称. 补充可见的链接文本,或对图标链接使用 aria-label 或带 alt 的图片。
  3. 交付的 HTML 中没有 <h1> 标题. 插入一个有意义的 <h1> 作为第一个标题(尽量在服务器端)。
自动监控此页面?

每周重新扫描,带 JS 渲染,出现新障碍时发电子邮件 —— 即将推出。

创建无障碍声明 →

方法 & 局限

于 2026/8/31 检查了 contentglass.com 在首次无登录访问时交付的 HTML,以及同一域名下最多四个链接的 CSS 文件。已检查:颜色对比度(来自 CSS)、文本替代、表单标注、控件名称、标题结构、页面标题和语言、缩放锁定、重复的 id、正的 tabindex 值、地标。

未检查: 一切由 JavaScript 生成的内容、键盘可操作性、可见焦点、焦点顺序、屏幕阅读器播报、登录后的内容、子页面。自动测试可发现约 20–35 % 的 WCAG 违规 —— 其余需要手动检查。这是快照,不是法律裁决。

检查其他网站