闪烁屏幕阅读器的文本

时间:2017-10-23 13:51:36

标签: javascript html css accessibility

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

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

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

我必须把一些这样的元素放在咏叹调生活区。此时存在一个问题 - 每次闪烁时,闪烁的元素都会被大声读出。 (这真的很糟糕)

我想要的是什么:

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

额外的障碍:

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

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

您对如何实施有任何建议吗?

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

1 个答案:

答案 0 :(得分:5)

闪烁文字是一个非常糟糕的主意,不仅适用于屏幕阅读器用户。 它可以引起视障人士的极大关注,使他们无法阅读页面上的任何其他内容。 您也可能给患有严重疾病的用户带来严重的麻烦。 等

所以我最好的答案是,忘记完全眨眼文字。这简直太糟糕了。

为了给你一个更真实的答案,如果你真的有义务实施闪烁文本,因为你的老板已经这么说了,最简单的就是玩另一个CSS属性。 例如,不透明度,颜色,字体大小,剪辑,定位。这些不会影响屏幕阅读器。

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