问题标签 [wcag2.0]

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.

0 投票
1 回答
113 浏览

video - 根据 WCAG 2.0 的成功标准 1.2.5,我如何处理无声视频?

我不确定如何处理 WCAG 2.0 的成功标准 1.2.5。它说:

为同步媒体中所有预先录制的视频内容提供音频描述

我是否必须为无声视频提供音频描述,展示如何制作纸飞机以满足 AA?不幸的是,同步媒体的定义似乎不是很有帮助。

0 投票
2 回答
140 浏览

html - 具有 alt 属性但没有文本的 img 是否满足 WCAG 2.0:技术 H30?

我正在阅读WCAG 2.0 技术 H30

该程序说:

对于使用此技术的内容中的每个链接:

  1. 检查文本或非文本内容的替代文本是否包含在 a 元素中
  2. 如果 img 元素是 a 元素的唯一内容,请检查其替代文本是否描述了链接的目的
  3. 如果 a 元素包含一个或多个 img 元素并且 img 元素的替代文本为空,请检查链接的文本是否描述了链接的目的
  4. 如果 a 元素只包含文本,请检查文本是否描述了链接的目的

我专注于第 2 点:如果img有一个alt属性,但没有替代文本怎么办?

例如,以下代码是否满足该技术要求?

0 投票
7 回答
20970 浏览

html - 在 HTML 中组合表格和分层列表

我正在努力重新设计一个遗留工具集,并且我正在研究如何更好地在外观和语义上显示一些信息。

数据本质上是分层的,但具有需要用户随时可见的属性。所需的布局类似于下面。

目前这是一个完整的表格,并且Seq通过插入额外的表格单元格来实现对序列 () 编号的缩进,以将所有内容都向右碰撞。

我面临的挑战是弄清楚如何有效地显示这些信息。

首先是这个表格数据?我会说不,因为层次结构很重要,而“列”只是每个“行”中项目的属性。

如果它不是表格,它是什么以及如何完成?我个人认为这是一组嵌套UL列表 - 序列号是可选的,并不总是一个数字。如果它是一组列表,那将正确缩进子列表,但是呈现短属性的最佳方式是什么?

如果是表,那么在表中呈现层次结构的语义存在的最佳方式是什么?

0 投票
1 回答
5953 浏览

google-maps - 谷歌地图和 WCAG 2.0 A 级

我有一张地图,显示带有过滤选项的自定义标记和基于过滤选项的不同标记颜色。单击标记会按预期显示带有图片的文本气泡。

使谷歌地图符合 A 级所需的条件。显然,屏幕阅读器版本将不那么令人兴奋。

WCAG 2.0

我需要做什么才能使我的谷歌地图符合 WCAG 2.0 A 级?

编辑:

我想我需要一个解决方案:

1.1 文本替代

-Map 有数百个标记,因为它们作为 js 对象存在,所以无法访问

1.3 适应性强

- 无法检测到屏幕阅读器并进行相应调整

2.1 键盘可访问

- 谷歌地图不提供热键,虽然我确信可以用 js 连接一些。

4.1 兼容

- 这将排除任何 js 黑客使谷歌地图响应热键。

什么是最佳做法? 通过可访问的版本链接链接到我的标记列表作为文本怎么样?

0 投票
0 回答
168 浏览

colorbox - 无法在 Firefox 中使用键盘导航关闭带有 iframe 的颜色框

在将 iframe 作为 Colorbox 内容加载时,我试图让 Colorbox 与键盘导航(选项卡导航)一起使用。我无法转义 iframe 内容以访问 Firefox 中的关闭按钮。换句话说,使用 Firefox 时有一个键盘陷阱,永远无法关闭模态框。它在 Webkit (Safari / Chrome) 和 IE 中工作。

您可以使用 Colorbox 网站上的 Iframe 示例重现此内容: http ://www.jacklmoore.com/colorbox/example1/

  • 选择 Flash / 视频(Iframe/直接链接到 YouTube)或外部网页(Iframe)

有谁知道如何解决这个问题?

0 投票
1 回答
327 浏览

javascript - 动态创建html时如何实现分层标题组织?

wcag 2.0 规则之一是标题元素,即h1/h2/h3/等,应该指示文档结构。这意味着您不能跳过一个级别,例如:

无效,因为 h1 和 h3 之间没有 h2 元素。这是有效的(根据http://achecker.ca/checker/index.php),即使 h2 在 section 元素内:

以下示例无效,因为最后一个 h3 在 h1 之后:

我正在编写将添加包含标题元素的内容的javascript,我想知道我应该如何选择我应该使用的标题元素(哪个级别),这样我就不会使文档无效?

0 投票
1 回答
1084 浏览

accessibility - 播放/暂停按钮的 wcag 合规性问题

作为使我们的网站符合 WCAG 合规性的一部分,我们正在为轮播添加播放/暂停按钮。这里屏幕阅读器以不同的方式阅读

在这种情况下,屏幕阅读器将暂停按钮读取为双垂直线和播放按钮。如果我们使用精灵图像,它会作为播放/暂停按钮的组读取。这个问题有什么好的解决方案而不是同时使用图像标签吗?

0 投票
2 回答
3800 浏览

html - AA 级可访问性 - 使用文本阴影增强颜色对比度

我有一个网站,我正在编写符合 WCAG 2.0 AA 级合规性的网站,其中一个按钮的颜色对比没有通过。

背景 - #D57405 前景 - #FFF

是否可以使用文本阴影来增强对比度——这会被视为通过吗?

我可以为不支持文本阴影的浏览器提供不同的颜色,但我想尝试保持按钮颜色相同,以匹配大多数用户的品牌指南。作为背景 - 我正在使用没有粗体变化的网络字体,我不想伪造粗体。我也无法将字体大小更改为 18pt。

谢谢


编辑 - 对于任何偶然发现这个问题的人:

“可以选择或着色字母周围的背景,以便字母与它们后面的背景保持 4.5:1 的对比度,即使它们与整个背景没有这种对比度” http://www.w3.org /TR/2013/NOTE-WCAG20-TECHS-20130905/G18

(我使用粗体)

0 投票
1 回答
233 浏览

visual-studio-2012 - WCAG 9.2 - 验证具有自己用户界面的任何元素是否独立于设备

我在 Visual Studio 2012 中使用可访问性检查器

* < script > *标记上,我收到此警告WCAG 9.2 - 验证任何具有自己用户界面的元素是否独立于设备。

相关的 WCAG 文章http://www.w3.org/WAI/wcag-curric/sam68-0.htm讨论了替代键盘或语音输入。

那么我到底要做什么呢?如何摆脱警告?理想情况下,我想在标签中添加一个属性来表示“是的,我已经检查过了”或者让它不再是警告的东西。

0 投票
2 回答
4853 浏览

javascript - 可访问性和使用 javascript

我想澄清一些事情,那就是在网站上使用 Javascript 来处理 WCAG。

我是否正确,只要不阻止用户访问网站内容或在网站上执行操作,使用 Javascript 就可以了。

例如,如果一个网站需要 Javascript 才能登录到一个网站,我会认为这会破坏 WCAG?

此外,如果一个网站有一些东西可以购买并配置需要 Javascript 来完成的选项也会破坏 WCAG?

只要提醒用户页面已更新,使用 AJAX 就可以了(可以使用 ARIA)

我的假设是应该使用 Javascript 来增强体验,但不能依赖它,这样用户就可以在没有它的情况下实现目标?

这些假设正确吗?