屏幕阅读器的闪烁文本

Question

我现在让屏幕阅读器可以阅读我的网站。

在网站上，我有一些闪烁的元素。闪烁是通过 javascript 将元素的可见性样式从可见更改为隐藏来实现的。

<span style="visiblity: visible/hidden;">Foobar</span>

我将不得不将其中一些元素放入 aria-live 区域。而此时出现了一个问题——闪烁元素每次闪烁时都会被大声读出。 （真的很糟糕）

我想要什么：

• 为普通用户保持“闪烁”
• 屏幕阅读器应用程序应将此类数据解释为普通文本并仅读取一次

额外的障碍：

在某些情况下，闪烁的文本可能带有链接。在这种情况下，我需要保持 TAB 可以选择文本，并且对于普通用户和使用屏幕阅读器的用户，链接应该是“可点击的”。

<a href="my_link" style="visiblity: visible/hidden;">Foobar</a>

您对如何实施有什么建议吗？

我接受额外的 HTML 元素和/或更改闪烁的实现方式。

Answer 1

闪烁文本是一个非常糟糕的主意，不仅对屏幕阅读器用户而言。 它可以吸引视障人士的注意力，以至于他们无法阅读页面上的任何其他内容。 您还可能给癫痫患者带来严重的麻烦。 等等

所以我最好的答案是，完全忘记闪烁文本。简直太糟糕了。

如果你真的不得不因为你的老板这样说而不得不实现闪烁文本，要给出一个更现实的答案，最简单的方法是使用另一个 CSS 属性。 例如，不透明度、颜色、字体大小、剪辑、定位。这些不会影响屏幕阅读器。

更一般地说，显示和可见性属性会影响屏幕阅读器。 有时宽度/高度也会产生影响。 其他所有通常都没有效果。