一行中的多个表单字段是否具有良好的可访问性?

问题描述 投票:0回答:1

我理解应该避免使用多列表单,以及为什么它不利于可用性和可访问性。我的问题是关于将 2-3 个连接的表单元素彼此相邻放置。例如,“名字”和“姓氏”的文本字段、“是”和“否”复选框以及“开始日期”和“结束日期”的日期选择器。

Form with some form fields next to each other

Form with all fields stacked vertically

我读到,水平堆叠不利于可访问性(屏幕阅读器、屏幕放大镜和键盘用户),因此应该避免,但仍然经常提到城市、州和邮政编码的例外情况。如果将元素彼此相邻放置会给某些用户带来障碍,那么规则就是始终避免它,对吧?为什么要允许例外?问题是否可能是这些情况下所需的无障碍措施被忽视了?

在我当前的项目中,我编写了一个网页,其中两个日期选择器彼此相邻,并且键盘导航存在一些问题。我正在决定是否尝试修复它或更改为完全垂直的布局。

在可访问性方面,一行中的多个表单字段是否是“禁忌”,或者如果有动机,它实际上可以是良好的做法吗?如果是这样,需要进行哪些调整才能确保表格可供访问。

forms datepicker accessibility
1个回答
0
投票

这取决于您所指的可访问性的“部分”。 WCAG 具有可访问性一致性,并且具有可访问性可用性。

请参阅我对 这个 UX StackExchange 问题的回答,了解两者之间差异的简要说明,因为 if 会影响您问题的回答方式。

WCAG 中没有任何内容表明信息应垂直堆叠或水平布局不好。有一个准则,1.4.10 重排,它规定当内容缩放到 400% 时,用户不必在水平和垂直方向上滚动,但这并不意味着水平布局是不好。

您提到屏幕阅读器在水平布局方面遇到困难。对于完全失明的人来说,布局根本不重要。他们将使用屏幕阅读器导航到页面上的所有元素,无论它们如何布局。在第一个屏幕截图示例中,开始日期和结束日期水平相邻,NVDA 用户可以按 F 转到下一个表单元素,或按 E 转到下一个 字段,无论布局如何.

从屏幕放大的角度来看,水平布局也并不重要。用户可以向左/向右或向上/向下平移放大镜。

对于键盘用户来说也是如此。他们可以 tab 到下一个表单元素,如果该元素离开屏幕(无论是垂直还是水平),浏览器会将其滚动回视图中。如果字段彼此相邻,那么水平制表符并不是什么大问题。

所以这实际上归结为可用性问题。水平布局是否会降低可用性?我无法回答这个问题,因为我专注于可访问性一致性。但这里有两篇文章提到了来自一家备受尊敬的可用性公司的水平布局:

“我了解到水平堆叠不利于可访问性(屏幕阅读器、屏幕放大镜和键盘用户),因此应该避免,”

你有这方面的参考资料吗?

*就可访问性而言,一行中的多个表单字段是否是“禁忌”*

不,这不是“不不”。

需要进行哪些调整才能确保表单易于访问。

没有任何特定于水平布局的内容,但通常需要使表单易于访问

  • 正确标记元素(通常使用
  • 处理错误情况
    • WCAG 3.3.1
    • WCAG 4.1.3
  • 提供指示
    • WCAG 3.3.2

还有许多其他适用于表单的 WCAG 检查点,但这些都是重要的。

© www.soinside.com 2019 - 2024. All rights reserved.