检查于 2026/9/24 · https://www.heise.de/
5 个关键障碍n · 另外还有 2 个待检查。
自上次扫描以来：无变化。
分数是如何得出的？（起始 100 分）
| 517 张图片中有 40 张没有 alt 属性 | -18 |
| 4 个表单字段没有可识别的标注 | -18 |
| HTML 中有 16 个链接没有可识别的名称 | -18 |
| HTML 中有 6 个按钮没有名称 | -18 |
| 5 条 CSS 规则n的文本对比度可能过低 | -18 |
| 交付的 HTML 中没有 <h1> 标题 | -7 |
| 6 个重复的 id 属性 | -7 |
| 结果 | 0 / 100 |
可感知
517 张图片中有 40 张没有 alt 属性
此处不包括通过 JavaScript 加载的图片。
<img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3377" height="1898"><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="1920" height="1079"><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3200" height="1798"><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="300" height="250">
你应当这样做： 为每个 <img> 提供 alt：对有含义的图片写简短描述，对纯装饰性图片写 alt=""。
4 个表单字段没有可识别的标注
请检查是否存在通过 JavaScript 设置的 aria-label。
<input type="text" name="q" placeholder="Suchen"><input type="text" name="q" placeholder="Suchen"><select name="in"><input type="text" name="fs" placeholder="Im Preisvergleich suchen">
你应当这样做： 将每个字段与一个 <label for> 元素关联，或设置 aria-label / aria-labelledby。仅有 placeholder 不够。
5 条 CSS 规则n的文本对比度可能过低
需要：4.5:1（正常）或 3:1（大号文本）。在「假定的页面背景」情况下，无法可靠确定实际背景 —— 有疑问时请在浏览器中检查。发现的示例：`.dark a-gift-link dialog`: #e0e0e0 auf #fff (Vorfahren-Hintergrund) = 1.32:1 · `.a-android-native-app-prompt__close-banner`: #323232 auf rgba(0,0,0,0) = 1.64:1 · `a-opt-in[is-active] .opt-in__footnote`: #959595 auf #ffffff (Standard) (Seitenhintergrund, angenommen) = 3.00:1 · `.a-android-native-app-prompt__load-app`: #fff auf #27a209 = 3.36:1 · `a-topic .topic-label`: #fff auf #ed3725 = 4.06:1
.dark a-gift-link dialog, .a-android-native-app-prompt__close-banner, a-opt-in[is-active] .opt-in__footnote, .a-android-native-app-prompt__load-app, a-topic .topic-label
你应当这样做： 调暗文本颜色或调亮背景，直到达到相应的最低值。切勿将颜色作为唯一的区分特征。
可操作
HTML 中有 16 个链接没有可识别的名称
空链接，或只有图标/图片而无 alt。此处不识别通过 JavaScript 设置的 aria-label。
<a-click-performance><a name="topnavi.ho.magazine-nav.ct" class="hover:bg-brand dark:hover:<a name="topnavi.ho.magazine-nav.ix" class="hover:bg-brand-alternative<a name="topnavi.ho.magazine-nav.foto" class="hover:bg-brand dark:hove
你应当这样做： 补充可见的链接文本，或对图标链接使用 aria-label 或带 alt 的图片。
HTML 中有 6 个按钮没有名称
没有文本且没有 aria-label 的按钮对屏幕阅读器是无声的 —— 除非名称通过 JavaScript 设置。
<button class="scroll-left text-ho-text"><button class="scroll-right text-ho-text"><button class="scroll-left text-ho-text"><button class="scroll-right text-ho-text">
你应当这样做： 补充按钮文本或设置 aria-label。
交付的 HTML 中没有 <h1> 标题
每个页面都应以恰好一个 h1 开始。对于由 JavaScript 构建的页面，h1 可能只在浏览器中生成 —— 那时请在渲染后的 DOM 中检查。
body
你应当这样做： 插入一个有意义的 <h1> 作为第一个标题（尽量在服务器端）。
健壮
6 个重复的 id 属性
例如 heisetopnavi_search, HEI_M_Incontent-2-label, HEI_M_Incontent-2, circle。破坏 label-for 和 aria 关联。
[id]
你应当这样做： 分配唯一的 id。
后续步骤
- 517 张图片中有 40 张没有 alt 属性. 为每个 <img> 提供 alt：对有含义的图片写简短描述，对纯装饰性图片写 alt=""。
- 4 个表单字段没有可识别的标注. 将每个字段与一个 <label for> 元素关联，或设置 aria-label / aria-labelledby。仅有 placeholder 不够。
- HTML 中有 16 个链接没有可识别的名称. 补充可见的链接文本，或对图标链接使用 aria-label 或带 alt 的图片。
- HTML 中有 6 个按钮没有名称. 补充按钮文本或设置 aria-label。
- 5 条 CSS 规则n的文本对比度可能过低. 调暗文本颜色或调亮背景，直到达到相应的最低值。切勿将颜色作为唯一的区分特征。
每周重新扫描，带 JS 渲染，出现新障碍时发电子邮件 —— 即将推出。
方法 & 局限
于 2026/9/24 检查了 www.heise.de 在首次无登录访问时交付的 HTML，以及同一域名下最多四个链接的 CSS 文件。已检查：颜色对比度（来自 CSS）、文本替代、表单标注、控件名称、标题结构、页面标题和语言、缩放锁定、重复的 id、正的 tabindex 值、地标。
未检查： 一切由 JavaScript 生成的内容、键盘可操作性、可见焦点、焦点顺序、屏幕阅读器播报、登录后的内容、子页面。自动测试可发现约 20–35 % 的 WCAG 违规 —— 其余需要手动检查。这是快照，不是法律裁决。
覆盖层小部件（切换对比度或字体的无障碍按钮）并不能让网站达到合规——发现的障碍必须在源代码中修复。 为什么覆盖层工具没有帮助