我的网页上有一个横幅，上面有一些截断的文本和一个“显示更多”按钮，有视力的用户可以点击它来获得全文。我想在页面上包含全文（但在视觉上隐藏），并为屏幕阅读器隐藏显示更多按钮，这样他们就不必为本质上是视觉的、节省空间的布局进行额外的单击。

乍一看，这似乎是正确的方法，但这不适用于可聚焦元素。我可以将它从标签索引中删除，但我希望该按钮对有视力的用户是可聚焦的。

如何实现？

顺晟科技：

我认为这里有一个轻微的假设，即屏幕阅读器用户不需要像有视力的用户那样在页面上扩展全文。虽然有一些方法可以将隐藏的文本传递给屏幕阅读器（例如使用），但这将不允许屏幕阅读器用户使用虚拟光标导航全文。

例如，当我使用屏幕阅读器阅读正文时，我可能想跳过几个单词或段落，或者我可能想跳到一个我不认识的单词来逐个字符地阅读它。我不能这样做，除非文本对屏幕阅读器可见，并且虚拟光标可以导航到它。

我的解决方案是使用或隐藏文本向屏幕阅读器用户传达有一个“显示更多”按钮，然后保持“显示更多”可访问（即不要在按钮上使用，也不要使用）。也许您可以确保当用户按下“显示更多”按钮时，焦点移动到全文正文。

简单的答案是，你不能做你想做的事，但考虑一下是个好主意。因为不能查询屏幕阅读器是否正在运行，所以不能真正调整页面。如果希望有视力的用户点击按钮查看更多文本，则该按钮必须是键盘可聚焦的(wcag 2.1.1)，并且必须宣布按钮的名称(wcag 4.1.2)。对于屏幕阅读器用户来说，没有一种方法可以隐藏按钮，而不会影响视力正常的用户。

您是正确的，这两者都会给某些用户带来问题。

两个选择是为了使“显示更多”界面对所有用户都一样工作，并且不必担心屏幕阅读器用户只有选择“显示更多”才能获得全文。是的，屏幕阅读器用户不受屏幕不动产的限制，可以为他们提供全文，而不需要按钮，但为所有用户提供相同的用户体验是可以的。但是，考虑屏幕阅读器用户的体验还是很好的。

另一种选择是为屏幕阅读器用户提供全文，并在“显示更多”按钮上有一个明显隐藏的标签，说明该按钮主要供有视力的用户显示全文，以便屏幕阅读器用户可以忽略它。大致上，它可以如下所示:

aria-hidden="true"