我读到过这样的文章:总是在<input type="email">
元素沿着包含<label>
元素是一种可访问性最佳实践,但是如果没有label
元素要包含在<input>
元素中,该怎么办?
我的意思是,目前,我正在设计一个网站,它实际上没有任何文本可以放入<label>
元素(所以我根本没有创建一个),但我真的不知道该怎么做,因为我的HTML在通过Web可访问性检查器运行时生成了一个可访问性错误。
是否必须创建一些文本并将其放入label
元素中,以使HTML可访问?或者是否有其他方法使单个<input type="email">
元素可访问?
1条答案
按热度按时间ecfdbz9o1#
标签是用来识别输入的,它不一定是一个聪明的名字,它可以字面上只是说"电子邮件"或"电子邮件地址"。
有几个原因有一个标签:-
1.屏幕阅读器用户需要某种识别输入的方法,如果没有标签,他们只会听到"输入",这并不像你想象的那样有用!
1.焦虑症患者最好有一个可见的标签,这样他们就能确信自己填对了,否则他们就会陷入这样一个循环:先填一个字段,担心填错了,然后删除文本,看到你的占位符文本(假设你有),再重新填一遍。
1.准确性差的人会得到更大的点击目标。如果一个标签与一个输入正确关联,那么你可以点击那个标签来聚焦输入。
对于您的使用情形,它非常简单
或者
我总是看到没有标签或只有占位符的表单,它们是如何做到的?
您可以使用WAI-ARIA(例如
aria-label
)向输入添加标签。相反,你可以visually hide the label using CSS,因为这将在所有浏览器回到IE6(甚至在纯文本浏览器)。
然而,由于上面的原因2和3,这也是不建议的。我已经包括了它的完整性(并用于搜索框中,没有可见标签是可以接受的)。
一个二个一个一个
占位符文本
占位符文本应用于示例输入或预期输入的解释。
如何隐藏标签的例子应该只在特殊情况下使用(我能想到的两个是网站搜索输入和可能的电子邮件注册表,只需要一个电子邮件地址,即使这样,它取决于其他因素和标签会更好)。