Spoiler模糊与屏幕阅读器不兼容

激活 iOS 的 VoiceOver,然后导航到一个包含剧透模糊的内容,像这样。

向右滑动文本,让屏幕阅读器朗读文本。

实际情况:VoiceOver 只是朗读了剧透文本,忽略了剧透模糊。

预期:它应该有一个 ARIA 角色(按钮?)和一个替代的 ARIA 阅读,“读取剧透”,或者类似的东西。

(JAWS 和 NVDA 也会发生类似情况。)

6 个赞

我认为 ARIA 中没有关于“剧透”的内容,……我可能错了。我的理解是,我们能做的最接近的事情是使用 detailsummary 标签来实现这一点。

乐于更改我们的实现。

看起来 detail/summary 的样式设置有相当大的灵活性,但预先计算宽度可能不可行。

1 个赞

啊,我现在明白了,我基本上为这里提到的“Spoiler Alert”可访问性问题开了一个重复的 issue,抱歉。虽然我的 issue 更侧重于键盘可访问性,但我的解决方案也能修复这个问题,因为正如 @dfabulich 所建议的那样,它将使用一个由按钮触发的 disclosure widget 模式。

我认为你不会想在这里使用 details/summary,因为你想在内容“隐藏”时将其显示在页面上,只是想将其模糊化。在模糊的内容上使用 aria-hidden="true" 会将其对屏幕阅读器用户隐藏,但仍允许其在页面上显示(模糊化)。然后按钮可以切换 aria-hidden 以使其对辅助技术可用。

我认为 ARIA 中没有关于 spoilers 的内容
Spoiler alert 基本上是一个 disclosure widget,ARIA Authoring Practices Guide 提供了相关的指南。

1 个赞

我认为这个提交应该能解决这个问题:

4 个赞

此主题已在 25 小时后自动关闭。不再允许回复。