可访问性:锚点链接需要一个标签

由于这些功能仅在 beta 7 中刚刚出现,我想提请注意:长帖中每个子标题的链接需要添加 aria-label。目前的实现方式仅使用了带名称的 a 标签,并通过 CSS 类 .anchor 引入背景图像,这导致屏幕阅读器会读出某些数字(可能是帖子 ID)以及标题的部分内容。更稳妥的做法是明确标注,例如“固定链接”,或“固定链接至”加上子标题的文本。这样,当屏幕阅读器用户浏览页面上的链接列表时,就能获得命名清晰的链接。

此外,是否可以将锚点放在 h 元素内标题文本的之后,而不是之前?目前,当屏幕阅读器在标题之间导航时,总是先读出链接;尤其是如果如上文建议那样在标签中重复标题文本,阅读过程会变得相当繁琐。由于屏幕阅读器用户通常通过标题结构来概览页面(参见各类 WebAIM 屏幕阅读器用户调查),将链接置于标题文本之后会更合适。

感谢你们始终致力于提升 Discourse 的可访问性!

4 个赞

嗯,数字不知从哪儿被提取出来,这确实有点奇怪……

不过话说回来,这些建议都很合理,实现起来应该没什么问题。再次感谢你的建议!

1 个赞

如果链接上没有其他标签,屏幕阅读器会读取 href 属性的内容,因此用户至少可以知道链接的目标或 URL。

关于可访问锚点链接,这里有一篇非常深入的技术解析:Are your Anchor Links Accessible? | Amber Wilson

2 个赞