WCAG 2.0 3.3.3 - 电子邮件地址建议?

WCAG 2.0 3.3.3 - email address suggestions?

如果用户没有通过省略 @ 或域来填写电子邮件地址 - 并且我们没有在提交时提供正确电子邮件地址的示例(示例@example.com),这是否会失败WCAG 2.0 3.3.3 关于错误建议的成功标准?

我查看了许多主要站点和主要网站,但只看到与缺少正确电子邮件地址有关的验证错误。看起来很多网站都使用占位符来指导用户格式化,但是,一旦提交,用户就没有关于正确格式的明确指示。

在我看来,是的。这假定它因已知原因(格式化等)被拒绝,因此应将原因传达给用户。

遗憾的是,查看主要站点并不是最佳实践的良好指标,只是表明他们没有遵循此检查点(或者更有可能的是,他们没有意识到它、WCAG 以及所有相关的事情)。

placeholder 从来都不是一个合适的标签,而且随着它的消失,它也很少足以用于说明。相反,一些与该字段相关的说明性文本(如有必要,可能与 ARIA 相关)可以更快地避免错误,但错误消息仍应传达出了什么问题。

想想那些你输入密码的时候,只是在不遵循一些神秘的格式规则的事实之后才被告知。预先告诉您并不能保证您会做对,但可以减少每个人都做错的可能性。它也是您可以重新使用错误消息的内容。

WCAG 3.3.3 并没有真正失败

3.3.3 Error Suggestion: If an input error is automatically detected and suggestions for correction are known, then the suggestions are provided to the user, unless it would jeopardize the security or purpose of the content. (Level AA)

这一点意味着你可以提供一个建议。例如,用户类型 "user AT example.com" 并且您建议 "Do you mean user@example.com?"

在这里,您的 WCAG 3.3.1 失败了:

3.3.1 Error Identification: If an input error is automatically detected, the item that is in error is identified and the error is described to the user in text. (Level A)

您必须用纯文本描述错误,这意味着 "Enter a valid e-mail address (example: user@domain.com)".

你可能还担心3.3.2,就是缺少说明

3.3.2 Labels or Instructions: Labels or instructions are provided when content requires user input. (Level A)

这意味着如果标签不够,您必须给出说明(有效格式)。

请注意,当您对 HTML5 input[type="email"] 元素使用浏览器自我验证过程时,情况可能会有所不同。因为在那里,浏览器辅助功能 API 应该提供明确的错误消息。