占位符VS标签,用于HTML5中的输入

Jit*_*yas 11 forms html5 accessibility semantic-markup screen-readers

我正在创建一个具有多个输入的表单,我需要在输入本身内提供一些表单元素,我就是这样使用的

一个例子

在此输入图像描述

<form class="TTWForm">
<input type="email" name="email" required="required" placeholder="Email Address">     
</form>
Run Code Online (Sandbox Code Playgroud)

以上代码在HTML5的W3C验证器中有效.

是否Label在HTML 5没有要求?

如果我使用HTML5 Placeholder来显示内部标签input是好的吗?

是否label仍然需要placeholder使屏幕阅读器兼容?

ste*_*eax 8

HTML验证程序不会检查可访问性.有效的HTML仍然无法访问或不是最佳.标签仍然很重要,HTML5 placeholder不是它们的替代品.请参阅H44:使用标签元素将文本标签与WCAG 2技术中的表单控件相关联.如果您的布局要求视觉用户无法看到该标签,您可以随时添加标签,但在屏幕外移动时使用负边距/文本缩进.

更新:

关于使用without 的W3 Public HTML邮件列表的一些测试结果placeholder讨论placeholderlabel.


App*_*rew 3

Placeholder无法替代,Label所以我想对于屏幕阅读器来说,它应该存在或至少设置该title属性。参考号

为了实现跨浏览器兼容性,您需要使用 javascript。请查看http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html