Html 无标签的辅助功能和单选按钮

所以我决定我最好让我的小调查表格生成器符合可访问性。无论是单选题还是复选框，单选题都没有问题，因为每一个单选题本身就是一个标签。但是，当一系列或一组问题都有相同的多项选择时，情况会怎样呢

例如：

我有以下代码：

<tr><td></td><td>Small</td><td>Medium</td><td>Large</td></tr>

<tr><td>3. What size Coke do you prefer?</td>
<td><label for="Q3.1"></label><input id="Q3.1" type="radio" name="responses[0]" value="1"></td>
<td><label for="Q3.2"></label><input id="Q3.2" type="radio" name="responses[0]" value="2"></td>
<td><label for="Q3.3"></label><input id="Q3.3" type="radio" name="responses[0]" value="3"></td></tr>

<tr><td>4. What size popcorn do you prefer?</td>
<td><label for="Q4.1"></label><input id="Q4.1" type="radio" name="responses[1]" value="1"></td>
<td><label for="Q4.2"></label><input id="Q4.2" type="radio" name="responses[1]" value="2"></td>
<td><label for="Q4.3"></label><input id="Q4.3" type="radio" name="responses[1]" value="3"></td></tr>

SmallMediumLarge
3.你喜欢多大号的可乐？
4.你喜欢多大号的爆米花？

我的问题是:

1.-W3.org验证程序将代码作为有效代码进行传递，但它真的“可访问”吗？有能力的网页读者会向视力受损的用户正确解释这一点吗

2.-如果没有，是否有一种方法可以让读者阅读某种隐藏标签，但肉眼看不见

3.-如果不是，是设计决策时间，你要么有此类问题，要么有良好的可访问性，但不是两者都有

你做的很好

您可以创建一个值为hidden的输入。虽然我不知道你说的眼睛看不见是什么意思

---

这可以被服务器看到，但用户看不到。

您的标签没有内容，因此没有视力的用户将不知道输入代表什么。我会将小、中、大文本放在相关标签中，然后在视觉上隐藏标签。使用屏幕外或剪辑技术，这样屏幕阅读器软件会将其拾取，但有视力的用户不必看到每个问题都重复出现

不，它是不可接近的。带有空内容的

标签

元素无效或更糟。当用户关注某个控件时，如果用户请求控件的标签，并且用户代理按预期支持

标签

元素，则这比无用更糟糕。然后，它将宣布一个空字符串作为标签，这增加了用户的困惑。（辅助功能检查器执行的测试非常有限。大多数辅助功能问题无法通过编程方式进行检查。）

提供“隐藏标签”有几种方法，但这仅涵盖真实标签的某些用途。视力没有问题的用户可能需要知道单选按钮的含义，例如，由于认知障碍。另一种方法是使用属性。在这种情况下，您需要为包含文本“Small”、“Medium”和“Large”的元素指定

id

属性，并在

aria labelledby

属性中为单选按钮使用每个

id

属性值。但对此的支持相当有限；此属性只会帮助一小部分用户

这是一个设计决策，您主要需要决定控件的类型和总体设置。如果使用

select

元素而不是每组单选按钮，则问题将消失。对于那些认为屏幕上的表单需要模仿纸质表单或出于其他原因的人来说，这可能是不可接受的。如果您改为使用文本输入字段，希望用户键入S、M或L，则问题会更改其类型。这将产生潜在的可访问性问题，即用户可能记不起替代项是什么，即使在表单开始时解释了它们

---

在没有撤回我接受的答案的情况下，我添加了一个答案，因为我发现了更多的信息，可以更完整地回答我的问题。问题是在单选按钮没有各自的标签的情况下，在可访问性方面该怎么做。如何添加视障读者可以看到但肉眼看不到的标签？合理地说，答案是使用CSS对后者（而不是前者）隐藏标签

事实证明，w3.org在其网站上有一个名为WCAG（Web内容可访问性指南）的部分，在那里我找到了技术H65，“当标签元素无法使用时，使用title属性来识别表单控件”。它特别提到了一个调查表单，并建议使用

title

属性

示例4：表单控件的数据表

表单控件的数据表需要将每个控件与列和行相关联 该单元格的标题。如果没有标题（或屏幕外标签），非专业人士很难- 可视化用户暂停并查询相应的行/列标题值，使用 他们的辅助技术，同时通过标签形式

例如，调查表单的第一行有四个列标题：问题、同意、， 犹豫不决，不同意。下面的每一行中都包含一个问题和一个单选按钮 与三列中的答案选项相对应的单元格每个项目的标题属性 单选按钮是答案选项（列标题）和 用连字符或冒号作为分隔符的问题（行标题）。

---

好的，我希望这能帮助别人。我在StackOverflow上回答了这么多问题，不是因为我发布了它们，而是因为其他人也有同样的问题

这里有一个链接，讨论如何隐藏文本，但让screenreader软件可以使用它：谢谢。你的回答没有详细说明，但是你提供的链接是无价的。这是我需要的一切。