易用的表单标签
2004年11月1日 星期一 (格林尼治标准时间 2:46PM GMT)
当我们需要为表单中的元素添加标签时,应该使用哪些最佳术语呢?
HTML Dog 的大部分页面(Dog Blog 除外)都包含一个联系表单,有四个字段,简单地标记为“姓名”、“电子邮件”、“URL”和“消息”。
这些字段都不是必填项(尽管如果“消息”文本区域为空,则不会发送任何内容),因为我希望人们能够轻松地完成他们想做的事情。如果有人想保持匿名,或者发表一个不需要回复的评论(因此不需要他们的电子邮件地址),我想给他们这个选择。我知道我很奇怪——大多数网站都有一些必需的字段和验证。但无论您是否同意这种方法,它都引发了一些关于表单标签可用性的有趣问题。
第一个问题出现在“URL”字段。“URL”是一个技术术语,有些人不知道它的意思,我从收集到的输入中了解到,例如“?”、“URL??”以及“我不知道这是什么意思”。URL 不是一个好的术语——一个不那么技术化、更普遍易懂的术语,比如“网址”,可能引起的混淆会更少,我猜想。
但即使这样可能也不够——有些人会输入他们正在浏览的网页地址,我不需要知道这个,因为表单到邮件的处理脚本会自动将它放入邮件中。也许“您的网址”会更好?
我遇到的更大的问题来自于“电子邮件”字段。在令人惊讶的大量消息中,人们不会留下他们的电子邮件地址,即使他们需要回复。
我甚至收到过几次愤怒的重复消息,内容大致是:“我问你这个问题很多次了,为什么你不回答我?”
呃,因为我无法回答——我不知道你的电子邮件地址。
我确定很多人是因为简单地忽略或忘记填写该字段。但这里有一个完全没有根据的理论——如果存在一些网络用户,他们认为在提交表单时,他们的电子邮件地址会自动发送?我认为大多数人都意识到网页浏览和电子邮件是两件不同的事情,在没有发送者明确说明的情况下,无法从发送的表单中得知某人的电子邮件地址。但对我来说,似乎完全合乎逻辑的是,相对新手可能会认为他们的浏览器和电子邮件程序以某种方式相互关联,形成一个单一的、通用的互联网系统。只是一个想法。
这实际上不是一个关于您是否应该为表单设置某些信息必需项、进行验证并提醒用户他们未填写(尽管我敢打赌会有一两条关于此的评论)的问题。这是关于您应该使用什么作为标签以及如何使它们更容易理解。即使您进行了验证,您首先使事情对用户更容易,这也是在帮自己忙。要记住的是,作为技术娴熟的网页制作者,有很多技术方面的东西我们都习以为常了。
评论
评论2
有人知道浏览器的“自动填充”是如何识别字段的吗?我喜欢使用自动填充来处理表单,使用相当标准的标签似乎可以使自动填充正常工作(我现在使用的是 Safari,但 IE 似乎也一样)。在此表单中,它为我自动填充了“姓名”和“电子邮件”,但没有自动填充“URL”。所以,我建议使用能让自动填充工作的标签,但我不太清楚具体是哪些。
Ben Brophy 于 2004 年 11 月 1 日星期一 4:29PM GMT 如是说。
评论3
请修复此博客的 RSS Feed!它已经坏了很久了(至少在 Thunderbird 中是这样)。我收到
XML 解析错误:未定义实体 位置: https://htmldog.cn/ptg/archives/000073.php 行号 244,列号 21:© Vivabit Ltd. & Patrick Griffiths 2004 | 条款与隐私 | XHTML 1.1 | CSS | Dog Blog 由 Movable Type 提供支持 --------------------^
Garret 于 2004 年 11 月 1 日星期一 4:42PM GMT 如是说。
评论4
我会将网站地址标记为“网站”——而不是“url”或“Web address”。
Marcus:您永远不应强加技术要求给用户。地址是否以“http://”为前缀并不重要,如果需要,请在发送或存储地址之前在服务器端添加它。
关于验证,我曾在内联帮助消息方面取得了一些成功。当用户离开某个特定字段时,就会显示这些消息。(例如:http://www.baekdal.com/x/email.gif)。优点是用户不会看到错误对话框,这通常会让人望而却步。
但是,我偶尔还是会看到一些相当奇怪的字段值。最有趣的是他们输入我的电子邮件地址,而不是他们自己的 :)
Thomas Baekdal 于 2004 年 11 月 1 日星期一 4:51PM GMT 如是说。
评论5
是的,“网址”可能比 URL 更好,尽管仅预填“http://”字段可能会提醒一些更懂行的读者您在说什么。
关于电子邮件问题,为什么不在表单中明确说明,无论是在顶部还是在电子邮件字段旁边,写上类似“如果您需要回复,请务必附上您的电子邮件地址”的内容?当然,这需要您的访客阅读您的页面才能提问,这对于注意力短暂的冲浪者来说并不总是会发生;但也许那个不断提问但没有得到答案的人,在绝望中会阅读网站并找出原因。
另一个选项——给您一些不太常见的表单 <label> 添加 title= 属性,解释所需内容。我刚测试过,甚至 IE6 也会显示一个工具提示。但您可能需要为用户添加一些视觉提示,表明有这些提示。
顺便说一句,既然您在谈论表单,您看过 IE6 中的这个表单吗?您会看到“Comment:”,然后下一行是“t:”,然后是评论 <textarea>。很奇怪。但是,您比在 Mozilla 上有更多的输入空间。这是否与浮动元素和 em 单位的大小有关?(我没看 CSS)。
Chris Hunt 于 2004 年 11 月 1 日星期一 4:57PM GMT 如是说。
评论6
我认为预填 URL 字段只会帮助极少数用户,他们在那里感到困惑的是是否要包含协议前缀。我总是会包含,因为我的网站在一个子域上。对于 www... 地址,这是一个更棘手的问题。
我建议采用类似于 Baekdal 先生的解决方案,但触发帮助消息的时间是用户将鼠标悬停在字段上时,而不是等到他们出错。通常一个例子会很有帮助。
Dave Vogt 于 2004 年 11 月 1 日星期一 5:26PM GMT 如是说。
评论7
Dave,实际上它会同时进行。它会为需要帮助消息的字段显示帮助消息(目前电子邮件不是其中之一),然后如果用户仍然出错,它会显示“错误”消息。
“帮助”文本不会显示在一个框中,而是显示在框旁边。原因在于人们不会注意到框的变化(如果它包含两条消息)。他们会专注于字段本身,而不是框。
我仍在改进这种方法,有很多需要考虑的因素(您指出了其中一个)。
Thomas Baekdal 于 2004 年 11 月 1 日星期一 5:47PM GMT 如是说。
评论8
“也许‘您的网址’会更好?”
“您的网站地址”怎么样?
“在令人惊讶的大量消息中,人们不会留下他们的电子邮件地址,即使他们需要回复。”
如果您希望得到回复,请务必附上您的电子邮件地址。无法保证回复,但我们会尽一切努力尽快回复您。
或者类似的话。
拥有网络技能的人最难理解的是,他们并不真正了解普通用户实际知道得有多少。当您给出非常明显的指示时,您会感觉像是在贬低用户,所以您会省略它。如果您能找到一种客观的方式来陈述它,那么这种陈述要么是“当然,所有人都知道”,要么是“哦,幸好他们提到了,我不知道”,这就是您的行动方针。
我们尽量避免涉及技术细节,但有时不得不提及。最好做到简洁、清晰、明确,这样即使是新手也会觉得自己被告知了,而网络达人则认为这只是陈述显而易见的事实。
Neal 于 2004 年 11 月 1 日星期一 6:00PM GMT 如是说。
评论9
您能否添加
value="示例姓名" onfocus="this.select()"
value="example@example.com" onfocus="this.select()"
value="http://example_website.com/" onfocus="this.select()"
value="在此输入您的评论" onfocus="this.select()"
与这四个字段一起使用?
Peter 于 2004 年 11 月 1 日星期一 9:22PM GMT 如是说。
评论11
为什么要使用评论表单?直接使用 mailto 链接不就行了。
在 Dog Blog 上,我可以看到评论表单而不是 mailto 和电子邮件处理机器人的必要性。
但在其他页面上,为什么要使用表单?对于那些 mailto 不起作用的人(Webmail 用户、在其他电脑上的用户)怎么办?
Will Rickards 于 2004 年 11 月 3 日星期三 6:06PM GMT 如是说。
评论12
我通常会尝试通过将表单分成几个部分来巧妙地向人们展示如何填写表单。
第一部分:请填写您的联系方式。(在商业网站上我还会包含首选联系方式)
第二部分:请填写您的咨询内容。
当涉及到标签时,我认为这完全取决于流量。如果网站的流量主要由不太可能理解技术术语的人组成,我会在大多数标签前面加上(您的),否则我认为 Web Address 等术语就足够了。
我总是在表单顶部包含一个联系电子邮件地址,这样当其他所有方法都失败时,如果他们无法使用电子邮件程序,他们可能就不值得费心了……;)
Nathan 于 2004 年 11 月 4 日星期四 9:51AM GMT 如是说。
评论13
“为什么要使用评论表单?直接使用 mailto 链接不就行了。”
1) 访客在图书馆或网吧。他们没有设置电子邮件客户端。
2) 访客在朋友家。他们不想使用朋友的电子邮件客户端。
3) 访客在工作,并且电子邮件受到监控。
如果您无法提供电子邮件表单,至少应提供一个有效的电子邮件地址,用户可以在以后记录下来并在自己的机器上使用。
Neal 于 2004 年 11 月 5 日星期五 1:52AM GMT 如是说。
评论14
“为什么要使用评论表单?直接使用 mailto 链接不就行了。”
4) 可恶的垃圾邮件发送者会收集您的地址,并用伟哥和可疑的赚钱计划的广告轰炸您。
Chris Hunt 于 2004 年 11 月 8 日星期一 11:55AM GMT 如是说。
评论15
我培训了许多计算机用户,他们的专业知识和经验差异很大。许多用户根本不理解他们的浏览器、他们的 ISP、Yahoo、网站和调制解调器之间的区别。
经验丰富且非常懂行的访问者会在几乎不看字段名称的情况下填写表单。正是那些不太懂行的用户会阅读并需要字段名称/标签。我认为字段越清晰地标记或解释越好。
Miraz Jordan 于 2004 年 11 月 22 日星期一 7:53AM GMT 如是说。
评论16
也许您可以将“URL”部分标记为 <abbr> ?
JavaScript 和服务器端对电子邮件字段的检查会“鼓励”/强制人们填写它。
Chris Neale 于 2004 年 12 月 11 日星期六 11:53PM GMT 如是说。
评论17
您似乎是一位非常有知识的博主。我 Poured to 问如何为我的博客添加一个表单并将结果发送到我的电子邮件... 好主意还是坏主意?如何编写将消息发送出去的 HTML 标签?博客网站是否必须启用特殊功能才能支持?非常感谢任何反馈!
Denise 于 2005 年 7 月 16 日星期六 9:01AM GMT 如是说。
另请参阅
- 下一页:图像替换被认为非常糟糕
- 上一页:注意您的语言

评论1
我想补充一点,像这样的表单中的“URL”字段应该清楚地说明是否需要“http://”前缀,因为它似乎因网站而异,并且可能会让不了解情况的人进一步感到困惑。我建议最佳方法是将 URL 字段预填为“http://”,这样就能清楚地表明必须输入完整的合格 URL。但那样的话,选择不提供 URL 的用户将不确定他们是否需要清除预填的值,而且您还需要几行额外的服务器端代码(或客户端 JavaScript)来过滤掉这些无效值。还有其他类似的替代方法,但没有一种特别令人满意。有什么想法?!
附注 - “URL's starting with”应为“URLs starting with”(无撇号,不是所有格)
Marcus Tucker 于 2004 年 11 月 1 日星期一 3:52PM GMT 如是说。