隐藏内容与辅助技术

时间:2016-11-25 15:00:38

标签: accessibility user-experience wai-aria wcag wcag2.0

我对隐藏内容如何与辅助技术合作感到困惑。我会举几个例子,希望你能解释一下这个,请:

  1. 如果我想制作一个小弹出窗口(以前是display:none;),那么AT的用户将如何理解它是新的东西,除了我将自动关注此弹出窗口的事实

  2. 我应该如何制作无法访问的图片滑块?我听说过rolearia-*属性,只有当时的可见图片应为display:block;或只是可见,所有其他图片应为display:none;。如果是这样,对于用户来说是不是会让他感到困惑(第一个问题的一部分)?

  3. 台式电脑是否需要更多移动设备。例如,如果我想为移动屏幕制作一个汉堡包菜单,它的链接应该隐藏在display:none;吗?我应该如何注意到用户现在可以看到这些链接?

1 个答案:

答案 0 :(得分:1)

  1. 提供焦点是弹出窗口的关键,通常是关闭它的控件。但是,如果您的弹出窗口不是真正的弹出窗口,而是在页面顶部只有一个更新框,那么您可以跳过焦点并使用实时区域。简而言之,这取决于你在做什么。请记住,弹出窗口旨在防止用户在执行指定操作之前与页面的其余部分进行交互,而更新内容块不会带有该限制。

  2. 如果你正在转移焦点,那不是什么大问题。隐藏的图像不会出现在页面内容中,因此它们不会减慢用户的速度。在这种情况下,请不要使用实时区域,因为这会在用户循环时不断中断。

  3. 在这种情况下,将焦点移至先前隐藏的导航菜单。有了良好的可访问名称,它可以正常工作。

  4. 我怀疑你不熟悉ARIA live regions,尽管你知道焦点管理。

    实时地区可以满足您的一些需求。您需要了解一些live region properties。如果您希望区域一改变就立即公布,无论用户在做什么,它都将是assertive。如果您希望它等到用户完成交互,那么它将是polite。还有corresponding live region roles,我将在下面展示。

    此外,aria-atomic属性将告诉屏幕阅读器是否应该宣布整个事物(这对于警报消息有用)或者只是更改的部分(可能更适合计时器)

    避免在页面上放置多个ARIA实时区域。

    这是example of an offline alert。这是一个方便的slideshare that goes into more detail。现在还有很多东西你知道要搜索什么。