此规则检查什么
确保每个表单元素都有标签.
为什么重要
WCAG 1.3.1、3.3.2 和 4.1.2 要求表单字段具有标签。新闻通讯订阅和搜索字段是常见的问题来源。
如何修复
- 为每个字段添加 <label for="field-id"> 元素,至少也要添加 aria-label。
- 仅有占位符文字不能算作标签。
如何检查修复效果
- 重新扫描,确认 label 规则不再未通过。
- 点击每个标签,检查它是否会让对应字段获得焦点。
FixReports 如何发现此问题
我们的扫描会在真实的 Chrome 浏览器中,对所测的每个页面运行 axe-core 规则 label,并报告每个未通过的元素及其所在页面、标记代码,以及适用时的截图。
自动化测试可以确认这个具体问题确实存在,但无法判断页面的其余部分是否无障碍:有些障碍只有在人工检查页面时才会显现。