问题标签 [web-accessibility]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
accessibility - 用标题（标题和 aria-label）替换图像的可访问方法
在我的网页上，我有一个锚（下面的代码），我在视觉上显示为完全隐藏文本的图像（标识）。我希望锚是：
- 可访问 - 由屏幕阅读器正确阅读，
- 鼠标悬停时显示工具提示（工具提示解释了图像标识，可能不是每个人都理解）。
我使用以下方法：
HTML
CSS
上述方法存在的问题：
- 一个人向我报告说，在遇到链接时，他的屏幕阅读器会阅读链接的内容（“某机构”）和链接的内容（“某机构”
title），导致“卡顿”。 - 我读到（在本文中）使用
title可访问性是错误的，aria-label应该改用。
所以我尝试重构以同时使用aria-labeland title：
现在 NVDA（我正在测试的屏幕阅读器）同时读取title和aria-label属性，导致再次卡顿。
其他可能不起作用的解决方案：
- 当我删除
title属性并仅保留aria-label它时，它可以正常读取，但我无法删除title属性，因为这是对我想要拥有的视觉用户的解释。 - 我也可以只保留
title属性，完全删除锚的内容，但我觉得拥有一个空锚并不是一个特别好的做法，不是吗？
这个问题的最佳解决方案是什么？我真的在它周围失去了我的头......
css - 禁用 CSS 以检查网站的可访问性的目的
许多开发人员/可访问性专家建议禁用 CSS 来检查网站的可访问性，但没有人明确说明它实际上对 Web 可访问性有何帮助。
所以我在这里，确切地问你这个问题，因为我所有尝试在可靠的（我想相信！）来源（如“w3.org”）中检查这一点，包括他们的 WCAG 2.0 建议，不要说任何关于使网站可以访问的内容CSS。此外，他们说它可能“依赖”某些技术，例如 CSS。
html - 如何在没有字段集的情况下对表单输入进行分组？
问题：对表单元素进行分组
我有一个 HTML 表单，其中很少有一个控件由多个输入组成。一个例子是一组单选按钮。
我想将这些输入和它的标签明确分组，以便屏幕阅读器（除了通过将它们对齐在单行上的视觉表示之外）能够理解和宣布这种关系。
例如，假设我有一个这样的控件：
标准解决方案问题：字段集样式问题
fieldset元素和它的子元素legend似乎正是为此而制作的（在下面的示例中使用）。
fieldset问题是legend元素不能像普通元素一样设置样式（关于它的一些讨论），现在除了在 Firefox 中之外，不可能使用我的布局需要的 Flexbox 将它们对齐在一行上。
问：还有其他方法吗？
fieldset这让我想知道除了使用元素之外，是否有一些可访问的方法来对多个表单控件进行分组？
可能的解决方案：role="group"？
有一个“组”角色（在下面的示例中使用），它可以添加到一个简单的div并且看起来它可以完成这项工作，但没有明确说明它与使用字段集的功能等效。如果确实如此，那么我如何标记该组的一个元素以用作 的等价物legend？
javascript - “警告：react-modal：App 元素未定义。请使用 `Modal.setAppElement(el)` 或设置 `appElement={el}`”
如何使用 react-modal 包在 React 应用程序的控制台中修复此警告：
警告：react-modal：未定义 App 元素。请使用
Modal.setAppElement(el)或设置appElement={el}
我还没有成功弄清楚el应该是什么。
上下文：在我的 App.js 根组件文件中：
其中...表示未显示代码。
一切正常，但是当 Modal 打开时，我的控制台中会出现以下警告：
index.js:2177 警告：react-modal：未定义 App 元素。请使用
Modal.setAppElement(el)或设置appElement={el}。这是必需的，以便屏幕阅读器在打开模式时看不到主要内容。不建议这样做，但您可以通过设置选择退出ariaHideApp={false}。
在react-modal 文档中，我只能找到以下内容：
App 元素 app 元素允许您指定应用程序中应隐藏的部分（通过 aria-hidden），以防止屏幕阅读器等辅助技术读取模态内容之外的内容。
如果你在做服务器端渲染，你应该使用这个属性。
可以通过以下方式指定：
DOM元素
Modal.setAppElement(appElement);
query selector - uses the first element found if you pass in a class.
Modal.setAppElement('#your-app-element');
不幸的是，这没有帮助！我无法弄清楚el应该代表什么。
以下是我尝试添加到我的 Modal 组件的许多属性变体中的一些：
我也尝试过从Modal.setAppElement('root');inside调用，我的组件被注入 的根元素src/index.js在哪里，而 index.js 就是我这样做的地方。rootApp
widget - 可访问性和选择日期范围
当盲人与范围日期选择器交互时，我不知道应该是什么声音提示。有人可以帮助我吗？
更新：我只是想知道可访问范围日期选择器的预期
accessibility - 可访问性的占位符文本最佳做法
以以下标记为例：
屏幕阅读器会读取诸如“电子邮件字段，bar dot com 上的 foo”、“信用卡 XXXX 空间 XXXX 空间......”之类的内容吗？如果是，我想这不是最好的用户体验，最好避免以这种方式使用占位符。是否有指南或示例说明如何向用户提供简短提示，以帮助用户以易于理解的格式输入数据，适用于所有用户？
ios - ionic 与 VoiceOver：如何阅读中文？
我创建了一个应用程序，它需要视障人士的可访问性。VoiceOver 非常适用于我手机中的其他中文应用程序。但是，它只能用英文读出，而不能用中文读出。如何让 VoiceOver 识别中文？
这是关于 HTML5 文档语言的问题吗？<html lang="en" dir="ltr">
我应该在离子中做什么？或者我应该配置我的 Xcode 项目吗？
解决方法：en用zh-HKin
代替<html lang="en" dir="ltr">粤语。
accessibility - 为了使 PDF 文档可访问，我可以只转换为图像并将所有文档文本包含在 alt 属性中吗？
为了使我们的数字文档符合 Web 可访问性标准，我们需要找到一种方法来轻松地将可读文本添加到我们的文档中。从pdf中提取文本，将它们转换为jpg并将文本添加到alt属性是否可以接受？
accessibility - WCAG 2.0 标准 1.4.1 / 2.1.1
我在 WCAG 验证方面遇到了麻烦，我第一次尝试使用这个检查器。
在脚本标签中我有一个潜在的问题
脚本可以单独使用颜色
和
使所有功能都可以通过键盘使用
但我真的不明白如何解决这个问题
我正在使用 achecker.ca
accessibility - 在 Mac 上使用 VoiceOver 或在 Android 上使用 Google TalkBack 时出现下拉列表问题
我在很多网站上都看到过这个问题，比如Facebook 注册 生日下拉列表，甚至是WebAim Accessible Forms。问题如下：
通过使用屏幕阅读器，我专注于下拉列表并选择一个元素。之后，我尝试离开下拉元素并将焦点移到下一个元素上（通过 VoiceOver 中的 ctrl + alt + 右箭头或在 Android 上向右滑动）。当我这样做时，屏幕阅读器不会将焦点移动到下一个元素，而是会宣布下拉列表中的下一个元素（尽管我已经选择了它并且列表现在已关闭）而不是下拉列表之后的下一个元素. 这导致我被困在那里而无法继续。
- 控制屏幕阅读器时我在那里做错了吗？
- 为了解决这个问题，我提到的网站的代码是否有可能发生变化？