自链接标题的ARIA规则咨询：两种常见实现方案是否合规？

第一种模式：标题文字完全作为自链接 #

<h2 id="A00"><a href="#A00">Heading</a></h2>

默认状态下，屏幕阅读器会播报「二级标题，Heading，链接」——这类冗余信息对依赖辅助工具的用户意义不大，毕竟他们可以通过标题导航直接定位到对应区域。

如果希望屏幕阅读器完全跳过播报该链接，无需复杂的ARIA配置，只需给链接添加aria-hidden="true"即可，同时保留链接的点击功能供鼠标用户使用：

<h2 id="A00"><a href="#A00" aria-hidden="true">Heading</a></h2>

修改后屏幕阅读器只会播报「二级标题，Heading」，不会提及链接属性。

第二种模式：标题后方带#的自链接 #

<h2 id="A00">Heading <a href="#A00">#</a></h2>

这种场景下屏幕阅读器会播报「二级标题，Heading，#，链接」，同样存在冗余问题。处理逻辑和第一种模式一致，给链接添加aria-hidden="true"即可：

<h2 id="A00">Heading <a href="#A00" aria-hidden="true">#</a></h2>

如果担心纯#符号对鼠标用户的指引性不足，可以用CSS给链接搭配图标，但要保持aria-hidden="true"，确保屏幕阅读器不额外播报。

这类自链接属于常见模式，但无障碍工具不会自动忽略它，手动添加aria-hidden="true"能有效提升屏幕阅读器用户的体验，避免不必要的信息干扰。

内容的提问来源于stack exchange，提问作者meedstrom