Html 如何对屏幕阅读器隐藏链接？

我有一个链接，我想向有视觉的访问者显示，但使用屏幕阅读器ATs对访问者隐藏。（当然，这并不理想）

这与对vision访问者隐藏内容的常见问题（已知解决方案）相反（例如“跳到内容”链接）

例如：

单击“阅读更多”链接可展开内联文本

相反，点击“无读”链接会再次将其折叠

这种折叠/扩展的文本功能只对有视觉的访问者有利，他们的视野会在到达之前接收到额外的文本（在本例中，取代了下一个常见问题，将其推离屏幕）

有屏幕阅读器的访问者应该看到全文，因为他们可以选择跳到下一个区块，并且他们不应该遇到虚假的“阅读更多”链接，（A）没有链接到页面，（b）只是简单地告诉他们将要从屏幕阅读器听到的内容

---

在HTML5中如何实现这一点？

对内容使用

aria hidden

这种方式：

<p aria-hidden="true">Screen readers will not read this!</p>

您可以尝试将链接放入伪元素中。这带来了另一个问题：您不能单击伪元素，因为它不是DOM的一部分，但可以使用

指针事件来伪造它


$（“p”）。单击（函数（）{
$（“span”）.toggleClass（'on'）；
}); 
span{显示：无；颜色：红色}
p{指针事件：无}
p:after{content:“readmore”；颜色：蓝色；文本装饰：下划线；显示：块；指针事件：all}
span.on{display:block}

Lorem ipsum dolor sit amet，是一位杰出的献身者。埃拉特奥奇的佩伦茨克。在ultrices lorem的Praesent non pulvinar nisl。Sed semper ultricies eros，eu aliquet ipsum Vehiclula nec。这是一个很好的例子。我们有猫科动物、布朗迪特乌尔纳、酵母菌。发酵精悬液。不允许有任何元素。这是一个很好的例子。尊贵的前庭，优雅的元素，优雅的心灵，端庄的前庭。在维尼纳提斯奥奇的前面，坐着艾米特·乌兰科珀·泰勒斯。Morbi lorem purus，ornare non convallis nec，venenatis cursus urna。马塞纳斯·库苏斯，利奥·维尔·蒂奇杜特·维韦拉，利奥·尼布·普拉特拉特·sem，我们的理论是不正确的。Vivamus eget magna libero.
Aria hidden在纯文本上非常有效（如上所述），但在链接（或包含链接的块）上使用时可能会出现一些问题；屏幕阅读器（如JAWS、NVDA和（桌面）VoiceOver）仍允许屏幕阅读器用户点击链接，但在用户点击链接时将保持沉默，或者在JAWS的情况下，重复先前的非隐藏链接；两者都可能令人困惑。使用tabindex=-1将链接从制表符顺序中移除也不是一个很好的解决方案，因为有视力的键盘用户无法使用这些链接。我不确定这里是否有一个好的解决方案。对于所有用户来说，最一致、最容易混淆的方法的最佳解决方案可能是使用aria hidden=“true”对屏幕阅读器隐藏隐藏的内容，因此所有用户都必须单击“阅读更多”才能继续阅读。这将使屏幕阅读器用户的内容与“视觉”用户的内容一样简洁，并使视觉受限的屏幕阅读器用户的体验保持一致。但是，您不能使用overflow:hidden来隐藏内容，而是需要基于不总是提供相同效果的元素进行隐藏。@ScruffyPaws是的，这是正确的。
屏幕阅读器===盲用户
是一个简单的假设。弱视用户（和其他人）也可以使用屏幕阅读器，同时仍能看到屏幕上的内容。在这里，它会迫使他们在不在屏幕上看到文本的情况下听到文本（并且意识到这一点），但（几乎）总是有例外；-）@FelipeAls他们是用它来阅读整个屏幕，还是只阅读选定的部分？他们是否使用屏幕阅读器导航功能（例如，跳到下一段/链接/标题/章节）？