对于WCAG AA标准，在<select>元素附近标记<label>元素时，元素是否需要可见？</select> </label>

Question

研究WCAG AA元素的可访问性标准。

我使用以下页面作为参考

http://achecker.ca/checker/suggestion.php?id=91

http://achecker.ca/checker/suggestion.php?id=208

http://achecker.ca/checker/suggestion.php?id=209

我们的目的是将<label>包裹在<select>左右，或将其作为兄弟姐妹。

双重问题，标签必须可见吗？如果有，是否有像素建议来赞美元素？如果它可见，我们打算保持关闭，但我想反馈给设计团队

Answer 1

是的，label元素需要可见。没有关于其放置的像素建议，但是它与控件在视觉上相关联是至关重要的（如此处的select元素）。毕竟，可能超过99％的访问者将使用常见的图形浏览器，并且许多访问者在理解表单结构时会有认知或其他困难。

您应该使用WCAG 2.0建议和相关文档，而不是某些辅助功能检查器作为基本参考。特别是，“理解WCAG 2.0”文档在H44: Using label elements to associate text labels with form controls处说：“无论标签元素是否可见，这种技术对于成功标准1.1.1,1.3.1和4.1.2都是足够的。也就是说，可以使用CSS隐藏它。但是，对于成功标准3.3.2，标签元素必须是可见的，因为它为需要帮助理解该领域目的的所有用户提供帮助。“

Criterion 3.3.2说：“当内容需要用户输入时，会提供标签或说明。”显然，如果使用基于视觉的浏览者（即大多数人）看不到它们，则不会“提供”我们）。

WCAG 2.0文档还说，由于某些浏览器存在问题，“显式”label元素（即具有label属性的for元素）优于“隐式“（label元素，包含与之关联的控件）。它也更符合逻辑：控件不是其标签的一部分。