【问题标题】:Hidden content with assistive technology使用辅助技术隐藏内容
【发布时间】:2016-11-25 15:00:38
【问题描述】:

我对隐藏内容如何与辅助技术一起使用感到有些困惑。我给你举几个例子,请你解释一下:

    1234563 /p>
  1. 我应该如何制作可访问的图像滑块?我听说过role 和aria-* 属性,并且当时只有可见图像应该是display:block; 或只是可见,所有其他图像都应该是display:none;。如果是这样,用户不会对他的 AT(第一个问题的一部分)感到困惑吗?

  2. 是否有超出台式计算机对移动设备的要求。例如,如果我想为移动屏幕制作一个汉堡菜单,是否应该用display:none; 隐藏它的链接?我应该如何注意到用户现在可以看到链接?

【问题讨论】:

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


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

    2. 如果您正在移动焦点,这没什么大不了的。隐藏的图像不会出现在页面内容中,因此它们不会减慢用户的速度。在这种情况下,不要使用活动区域,因为它会在循环过程中不断干扰用户。

    3. 在这种情况下,通过将焦点移动到以前隐藏的导航菜单。使用易于访问的名称就可以正常工作。

    我怀疑你不熟悉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。现在您知道要搜索什么,还有很多其他内容。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2012-02-05
      • 2023-03-05
      • 1970-01-01
      • 2021-10-31
      • 2012-04-05
      • 2013-07-05
      • 1970-01-01
      • 2019-08-15
      相关资源
      最近更新 更多