标签: wcag

将焦点设置在AngularJs表单中的第一个无效输入上

我已经阅读了几篇与AngularJs焦点设置相关的文章和StackOverflow问题.

不幸的是,我读过的所有例子都假设我可以添加一些属性来获得焦点,例如一个focusMe指令.

但是,如果我事先不知道将焦点设置为哪个输入呢?特别是如何将焦点设置为具有$ invalid set的表单中的第一个输入元素 - 即一个未通过验证的元素.可能有几个输入未通过验证,因此我无法使用仅基于此尝试调用.focus()的指令.(我这样做是出于辅助功能/ WCAG的原因,这样做的好方法就是单击提交时最小化按键以找到验证失败的第一个字段).

$ error对象将为所有未通过验证的控件提供帮助,但它们按照表单上任何外观顺序的失败类型进行分组.

我相信我能想出一些这样做的方法.表单上的指令,当需要设置焦点时接收一些广播 - 该指令然后可以搜索第一个$ invalid元素.然而,这似乎非常复杂,我想知道这些是否是更好的"角度"方式.

validation wcag angularjs angularjs-directive

60
推荐指数
4
解决办法
6万
查看次数

为<ul>或<ol>编写标题/标题的最佳方法是什么,就像我们在<table>中有<caption>一样?

什么是编写的标题/标题是最好的方法<ul>还是<ol>?就像我们<caption><table>,我们不想让他们大胆.

这个可以吗?

<p>heading</p>
<ul>
  <li>list item</li>
  <li>list item</li>
  <li>list item</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

或者应该始终使用标题?

<h3|4|5|6>heading</h3|4|5|6>
<ul>
  <li>list item</li>
  <li>list item</li>
  <li>list item</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

css xhtml accessibility wcag screen-readers

54
推荐指数
4
解决办法
10万
查看次数

为什么WCAG成为3级"A","AA"和"AAA"?

WCAG制定3个优先级的目的是什么?

是吗?

  • 如果客户不支付额外费用,或者如果我们没有多少时间,那么请去A
  • 如果客户支付当时或我们有时间使网站兼容至少 AA
  • 如果客户支付和需要根据政府.规则然后去AAA

如果我们正在制作网站,那么我们应该尝试实现哪个级别,或者我们应该只根据客户请求进行?

虽然我在这个网站上发现了这些定义,但这些对我来说很困惑

•优先级1:对于所有用户访问Web内容和Web开发人员达到一致性级别"A",必须满足这些要求.

•优先级2:Web开发人员应满足这些要求,以便没有任何组发现难以访问Web内容并达到一致性级别"AA".

•优先级3:Web开发人员可以满足这些要求,以便于访问某些组的Web内容并达到一致性级别"AAA".

usability w3c accessibility wcag screen-readers

33
推荐指数
2
解决办法
4万
查看次数

在HTML中组合表和分层列表

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

数据本质上是分层的,但具有需要用户容易看到的属性.所需的布局类似于下面.

Seq     Item Name         Min  Max  - Anything under here isn't shown
 1      Identifier         1    1     (Required)
 2      Name               1    1
  2.1    First Name        1    1
  2.2    Middle Name       -    -     (Optional but unlimted)
  2.3    Last Name         1    1
 3      Age                -    1     (Optional)
Run Code Online (Sandbox Code Playgroud)

目前,这是一个完整的表,并且Seq通过插入额外的表格单元来实现对顺序()数字的交叉处理.

我面临的挑战是如何有效地显示这些信息.

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

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

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

html css html-table wcag wcag2.0

20
推荐指数
3
解决办法
2万
查看次数

WCAG 2.0验证的任何工具建议?

我相信现在每个人都在努力使WCAG 2.0符合网页.您是否可以分享任何与您遇到的相同的好工具?

以下是我遇到的一些好工具 -

1. http://www.powermapper.com/products/sortsite/index.htm

好处:

1. It does WCAG 2.0, WCAG 1.0, browser compatibility and many other checks
2. Low cost
Run Code Online (Sandbox Code Playgroud)

坏处:

1. it seems it doesn't have command line API.(as per my initial evaluation)
2. Web mode doesn't support HTML upload
Run Code Online (Sandbox Code Playgroud)

2. http://achecker.ca/checker/index.php

好处:

  1. 自由!!!
  2. 支持WCAG 2.0
  3. 有Web服务API

缺点:

  1. Web服务API不支持HTML文件上载.它期望HTML文件部署在Web上的某个位置

w3c accessibility wcag

18
推荐指数
1
解决办法
1万
查看次数

符合WCAG 2.0 AA会妨碍使用JavaScript吗?

符合WCAG 2.0 AA会妨碍使用JavaScript吗?

我基于理解一致性的理解是,只要我们不生成任何不合规的内容并且我们明确声明我们支持JavaScript,我们仍然可以使用JavaScript.那是对的吗?

javascript accessibility wcag

13
推荐指数
3
解决办法
7531
查看次数

如何在VS2008中清除错误列表的警告部分?

具体来说,一旦我将WCA​​G Anaylsis网站的警告发送到我的警告窗口,我就无法摆脱它们,直到关闭工作室.在同一解决方案中构建另一个项目时,他们会留在那里

有人有任何想法吗?

wcag visual-studio-2008 visual-studio

12
推荐指数
2
解决办法
2万
查看次数

WCAG:应用样式时,Firefox和Edge不会在焦点输入元素上显示轮廓

我正在创建一个表格,遵循一些WCAG指南.其中之一是:

G165:使用平台的默认焦点指示器,以便高可见性默认焦点指示器将继续.

该规则的摘要是:

操作系统具有焦点的本机指示,其在许多用户代理中可用.焦点指示器的默认渲染并不总是高度可见,甚至可能难以在某些背景下看到.但是,许多平台允许用户自定义此焦点指示符的渲染.辅助技术还可以改变原生焦点指示器的外观.如果使用本机焦点指示器,则其可见性的任何系统范围设置都将转移到Web页面.如果您绘制自己的焦点指示器,例如通过对页面的部分进行着色以响应用户操作,这些设置将不会延续,并且AT通常无法找到您的焦点指示器.

(强调我的)

为了遵守这条规则,我想保留操作系统表单元素的默认焦点指示符.


但是,我在这里遇到了不同的问题.

在macOS上的Firefox中:

一旦我改变了元素的样式(例如通过更改边框设置),默认焦点就会丢失1.

这很奇怪,border并且outline是不同的样式属性.

在Firefox和Edge on Windows上:

浏览器在输入表单元素时显示一个焦点指示符,它只是一个不同颜色的边框 - 只要它没有样式.另一方面,Chrome确实有一个指标作为轮廓 - 就像在macOS 2上一样.


这是一个演示行为的片段(或者尝试这个小提琴):

.b {
  border: 1px solid red;
}
Run Code Online (Sandbox Code Playgroud)
<form>
    <input class="a" type="text">
    <input class="b" type="text">
</form>
Run Code Online (Sandbox Code Playgroud)

作为旁注:如果 - label元素存在与否,则行为没有区别.


我的问题是:

  • 为什么Firefox和Edge在macOS和Widnows上的反应如此?为什么他们使用边框而不是文档的轮廓?
  • 即使应用自定义样式,如何强制这些浏览器显示操作系统的默认焦点指示符?
  • 当有人创建了一个自定义指标时,它是否仍会显示在Firefox和Edge中,即使默认值不再存在?

有了这些问题,我想知道这个规则是否有可能实现.最终,也许我必须手动设置outlinefocus,以获得在所有浏览器相同的行为,并跳过此规则.


1这是一个显示macOS问题的屏幕截图:

2这是在Windows上显示问题的屏幕截图:

html css focus wcag outline

12
推荐指数
1
解决办法
1261
查看次数

像药丸/徽章这样的 HTML 元素是否需要额外的 Aria 角色?

我正在尝试为我的网页添加可访问性,但我不确定如何处理此徽章元素。它类似于您在在线购物车图标上看到的数字圆圈。(参见下面的示例图片)

我无法决定应该给它分配什么样的咏叹调角色。或者我是否需要特别为其指定一个咏叹调角色?很确定它不是“role=button”,因为这里没有点击事件。

在此输入图像描述

html accessibility wcag wai-aria wcag2.0

12
推荐指数
1
解决办法
3847
查看次数

11
推荐指数
3
解决办法
1万
查看次数