我从来没有理由将标签元素放在图例元素中(从未真正考虑过它或看过它)。但是根据我正在实施的设计,这很有可能。
这是我很想做的事情:
<fieldset>
<legend><label for="formInfo">I would like information on</label></legend>
<select id="formInfo">
<option value="Cats">Cats</option>
<option value="Dogs">Dogs</option>
<option value="Lolz">Lolz</option>
</select>
</fieldset>
它在Firefox3,Safari,Opera和IE6 / 7中按预期工作(点击标签聚焦相应的输入)并通过验证,但我只是想知道是否有任何已知原因(可访问性?语义?浏览器问题)为什么不应该这样做
答案 0 :(得分:12)
您的</fieldset>
在哪里?
在语义上,legend
describes a fieldset
,就像label
描述单个字段一样。
字段集应该用于将语义相关的字段组合在一起(例如,“地址”字段集可能包含街道,城市和国家/地区的输入字段。)
假设您在字段集中有多个字段,那么按照您的建议进行操作在语义上没有意义 - 您需要创建描述字段集的单独图例文本,然后创建每个字段的标签。
如果您只有一个字段,则根本不需要字段集或图例。
所以,基本上,你不应该做你正在做的事情。
如果您要使用额外的元素来附加CSS规则或Javascript事件,那么最好使用div
和span
之类的通用元素,这些元素不会混淆文本到-speech和其他非可视用户代理。
即,放入div
或span
在可访问性/语义方面实际上是中性的(它没有任何意义)与滥用语义元素相比(即使只是轻微地,如本例所示),这可能会产生误导。想象一下,即使是文本到语音浏览器中布局的最佳情况场景:文本大声朗读两次,一次作为图例,一次作为标签 - 为什么有人想要短语“我想要“两次大声朗读”的信息?特别是因为它只适用于select
控件中的选择。
答案 1 :(得分:0)
好吧,标签元素本身似乎很好 - 这是“formInfo”元素的描述,所以不用担心。然而,在语义上,关于legend
元素的说法是什么?它应该是整个字段集的标题....