如何让JAWS 2022将锚点标签读为按钮而非链接？

针对你遇到的问题，这里有两个可行的方案，既能保留锚点标签的功能（包括Angular routerLink的导航），又能让JAWS 2022仅读取为"Back Button"：

方案1：使用aria-roledescription覆盖角色描述 #

通过设置aria-roledescription=""（空字符串），可以覆盖锚点默认的"link"角色描述，让JAWS只读取aria-label的内容：

<a aria-label="Back Button" aria-roledescription="" class="secondary-button btn-font" title="Back" ngClass="btn-font"
   ngClass.xl="btn-font-xl" i18n-title='importantFacts@@back-button' id="backButton"
   i18n="@@importantFacts-back-button" routerLink="/apply-for-benefit/verification">
   Back
</a>

原理：aria-roledescription用于替换屏幕阅读器对元素角色的默认描述，设置为空字符串后，JAWS不会再追加"link"的角色说明。

方案2：使用role="presentation"移除语义角色 #

给锚点标签添加role="presentation"，可以移除其默认的链接语义，同时保留锚点的点击和导航功能：

<a aria-label="Back Button" role="presentation" class="secondary-button btn-font" title="Back" ngClass="btn-font"
   ngClass.xl="btn-font-xl" i18n-title='importantFacts@@back-button' id="backButton"
   i18n="@@importantFacts-back-button" routerLink="/apply-for-benefit/verification">
   Back
</a>

原理：role="presentation"会告诉屏幕阅读器该元素仅用于展示，不具备语义角色，因此JAWS不会将其识别为链接，也就不会读取"link"后缀。

注意事项 #

• 两种方案都不会影响锚点的正常导航功能（包括Angular routerLink的跳转）。
• 建议优先测试方案1，因为它更精准地控制了角色描述，不会完全移除元素的语义信息。
• 确保aria-label的内容是你需要的最终读取文本，它会覆盖锚点内的可见文本和title属性的内容。

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