【问题标题】:Markdown for NVDA or similar screen readersNVDA 或类似屏幕阅读器的 Markdown
【发布时间】:2018-10-25 21:10:18
【问题描述】:

我正在开发网络应用程序,我们的团队希望使其更易于访问。特别是,我们希望为看不见的人(使用屏幕阅读器)提供更好的支持。

一种流行的解决方案是 NVDA。在阅读了他们的文档 here 后,不清楚 - 他们是否支持自定义降价?

我可以使用一些属性/标签/元数据,以便 NVDA 以不同的方式读取内容吗?例如: Google 将被读作“谷歌”。我可以以某种方式对其进行装饰,以便将其读取为“链接到 Google”吗?

谢谢。

【问题讨论】:

    标签: screen-readers nvda


    【解决方案1】:

    没有针对屏幕阅读器的自定义标记。嗯,有这样的事情,我会在下面告诉你。
    基本上,当您尝试使您的网站更易于访问时(这是一件非常好的事情,顺便说一句!),您应该尽量减少对屏幕阅读器用户的影响。 “影响”是指您的目标应该是让您的盲人用户看到与有视力的用户一样的东西,但作为网站开发人员,您赋予他/她查看、导航、打开、点击等的能力等等。

    不过,有一种方法可以自定义布局。它被称为WAI-ARIA。你可以用它做很多疯狂(和聪明)的事情,它很棒而且很强大,但是搏击俱乐部的第一条规则,我的意思是,WAI-ARIA 的做法是:

    如果您可以使用已内置所需语义和行为的原生 HTML 元素或属性,而不是重新利用元素并添加 ARIA 角色、状态或属性 使其可访问,然后这样做。 — from here.

    即:如果您可以不使用 ARIA,请不要使用它。
    让我们以指向 Google 的链接为例:您希望您的盲人用户看到“Google”文本并理解它是一个链接,对吗?好吧,我会告诉你你应该做些什么来实现这一目标。你需要做...鼓滚...什么都没有! NVDA 或 JAWS(您绝对应该使用它进行测试,它是主要玩家!),或 Android 上的 TalkBack,或 Apple 设备上的 VoiceOver,会说:“链接 Google”或“Google 链接”(取决于屏幕阅读器和在特定用户的设置上)。就是这样。
    当然你可能已经这样做了(但不要以任何方式这样做!):

    <a href="https://google.com" aria-label="Link to Google"><span aria-hidden="true">Google</span></a>
    

    看看它有多疯狂(和强大!)?因此,您告诉屏幕阅读器您需要阅读您的自定义文本并隐藏您的主链接文本(以防万一;我刚刚使用 JAWS 进行了测试,即使没有 aria-hidden 属性也一切正常,所以它仅用于一个例子)。
    但是,如果您的链接是带有一些花哨样式的 span,ARIA 就是您的一切:您只需说出 &lt;span role="link"&gt;,您的用户将获得愉快的体验,而不是试图找到要点击的词。
    最后一个例子:在 Bootstrap 中有很多装饰,比如

    <i class="fas fa-arrow-up"></i>
    

    如果它们位于链接上(而且大多数情况下),某些屏幕阅读器(例如 JAWS)会报告两个链接,一个带有文本,一个为空,只是“链接”。在这些情况下,向屏幕阅读器隐藏这些内容真的很好:

            <i class="fas fa-arrow-up" aria-hidden="true"></i>
    

    【讨论】:

    • 谢谢安德烈,非常详细的例子回答!
    【解决方案2】:

    NVDA,如JAWSVoiceOverTalkback 和其他几个,是screen reader。屏幕阅读器是低视力或无视力用户用于访问其计算机的软件。如果您编写语义正确的 html,那么您的应用将自动使用屏幕阅读器。

    为了创建语义正确的 html,W3C 制定了一套指南,称为 Web Content Accessibility Guidelines (WCAG),其中概述了您可以采取哪些措施来改进您的 Web 应用程序,使其可供最多的人使用。

    它包括诸如为图像提供替代文本、为表单元素提供标签、为链接使用措辞良好的文本以及为语义元素使用适当的 html 标签,例如 &lt;h1&gt; 用于标题,&lt;ul&gt; 用于列表, &lt;table&gt; 用于数据表等。

    native html 语义元素由于某种原因而无法使用时,可以使用 ARIA attributesroles 为屏幕阅读软件提供关于您正在尝试的对象类型的线索传达。

    因此,NVDA 或任何其他屏幕阅读器都没有降价。你只需要聪明地使用 html。

    【讨论】:

      猜你喜欢
      • 2018-10-04
      • 2023-02-02
      • 2020-04-29
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2010-12-31
      • 2022-08-04
      相关资源
      最近更新 更多