此规则检查什么
确保链接有可辨识的文本.
为什么重要
WCAG 2.4.4 和 4.1.2 要求链接具有描述其目的的无障碍名称。
如何修复
- 找到没有名称的链接。大多数是 <a> 标签内的图标或图片。
- 在链接内添加视觉上隐藏的文字，或添加 aria-label，例如 aria-label="Instagram" 或 aria-label="Cart"。
- 如果链接包裹的是图片，请改为给图片添加有意义的替代文本。
如何检查修复效果
- 重新扫描，确认 link-name 已消失。
- 在运行屏幕阅读器的情况下，用 Tab 键依次移到每个链接，收听其名称。
FixReports 如何发现此问题
我们的扫描会在真实的 Chrome 浏览器中，对所测的每个页面运行 axe-core 规则 link-name，并报告每个未通过的元素及其所在页面、标记代码，以及适用时的截图。
自动化测试可以确认这个具体问题确实存在，但无法判断页面的其余部分是否无障碍：有些障碍只有在人工检查页面时才会显现。