作者Luke Wroblewski,原文标题International Address Fields in Web Forms
网站表单作为企业与客户之间进行在线沟通的实现者,往往承担着收集关键信息的任务。例如收集电子邮箱地址便于进一步沟通,收集邮寄地址用于投递产品,收集账单信息用于处理付款等等。因此被问到网站表单设计最常见的问题——“如何设计国际地址”时,我并没有感到很惊讶 。
分析地址变化的细微区别之前,值得指出的是人们对地址结构拥有共识。经过多年通信经验及邮政系统的积累,人们对构成地址栏的要素形成了非常具体的概念。这种共识非常绝对。眼动数据表明,一旦人们开始在地址栏的输入框中填写信息,人们往往不再看该输入框的标签信息。人们对地址栏的基本结构很熟悉,并不需要标签提示。
考虑组成地址的输入框是很重要的一点。图1显示了美国地址中通常包括的条目的排列方式。图2是另一种方案,每个条目都分行显示,这种方法缺乏关联理解输入框的优点。因此,人们更倾向于相对独立的对待每个输入条目,而非将地址看作一个整体。
图1:网站表单中的美国常用地址结构
网站表单�的美国常用地址结构
图2:分割的美国地址结构
分割的美国地址结构
幸运的是,世界上组成地址的要素有着相当多的共性。大多数国家,地址栏中的目的地、收件人都是采用从具体到模糊的渐进结构,而俄罗斯、伊朗明显是例外。因此要给一家公司中的某人寄东西,地址栏中第一栏为收件人姓名,然后是公司名称,之后是街道、城市,最后一栏是国家。如图3。这种结构能用于所有国际地址。
图3:国际地址结构
国际地址结构
国际变化
地址栏的国际变化从最具体的条目开始——拥有地址的人。世界上的人名可能是一个、两个、三个或更多个字。Formulate Information Design的文章“The Name Riddle”描述了姓名中的可能变化,从印尼首任总统Sukarno到沙特第五任国王:Fahad bin Abdul Aziz bin Abdul Rahman Al-Sa’ud。
即使在一个国家内,街道地址也会有很大差异。美国邮政邮政地址标准描述了美国街道地址的差异——从1401 Main St to RR 9 Box 23A 到RR 9 Box 23A to 475 Lanfant PLz SW, Rm 10022。
姓名和街道地址差异很大,但是每个单一输入框只要够长即可。门牌号码在街道名之前?没问题。门牌号码在街道名后面?也不是问题。但是对于地址栏中的城市问题,就没那么简单了。
除了城市名称、邮编外,城市一栏同样可包括州、地区、省、或者国家。国家不同,每一项可能有不同的叫法、简称,在地址栏中的位置也不一样。不同国家的邮编形式也不同,包括空格、数字、字母以及长度。这些要素的顺序差异巨大。图4显示的是地址栏中城市项可能发生的变化。
图4:城市项变化样例
城市项变化样例
为解决这些国际变化,网站表单设计师采用了很多方法:特定表单、可变表单以及通用表单。
特定表单
若知道或可以确切推断客户的国家,采用特定表格的办法最为有效。用这种方法,可以为每个特定国家定制地址栏结构。图5显示的是法国、意大利的地址栏。请注意位置和标签的变化。
图5:法国和意大利的地址栏
法国和意大利的地址栏
如果能非常肯定客户的国家,特定表单能提供可快速理解的熟悉的地址结构,从而加速表格填写的完成时间。Frank da Cruz的Compulsive Guide to Postal Addresses是一个了解世界各地独特地址结构的奇妙网站,据此你可以制定针对特定国家的地址栏布局。
可变表单
和特定表单方式一样,这种设计利用可变化的格式,设计特定国家的地址栏。但是,这种格式是基于用户选择而非已知或者推断的位置。如图6所示,eBay的注册表单就使用了可变表单。如果有人更改了默认国家选项——该默认选项基于eBay对用户的访问位置判断——表单会显示被选择国家的地址框,以替代默认地址框。
图6:eBay 允许用户可更改注册表单中地址。
eBay 允许用户可更改注册表单�地址
这种情况下,若在地址栏下拉菜单中选择加拿大而非澳大利亚,“State/Territory”变为“Province”,“Postcode ”变为“Postal Code”。尤其值得关注的是,更改国家时,用户在通用地址结构的表单中输入的任何信息,比如名字或者街道地址,应当被保留。消除用户已经提供的信息极可能会惹恼用户。
通用表格
通用国际地址表单格式是另外一种保持多种地址栏变化以支持特定国家的解决方案。通用格式为组成地址栏要素的栏目提供单独的输入区域,让你能应付姓名以及街道地址的变化。为了适应地址栏布局以及城市项的变化,你可以使用一套通用的输入栏。Amazon.com的表格正是如此,如图7。
图7:Amazon.com的地址栏通过采用通用表单的形式支持不同国家的地址输入。
Amazon.com的地址栏通过采用通用表单的形式支持不同国家的地址输入
不同于根据国家显示不同的下拉菜单,单独输入栏被加上各种标签,比如州、省、地区,用户可以据此填写信息。类似的,“Zip/Postal Code” 标签同样包括了在输入框中针对邮编不同形式的邮编。该输入框可以填写字符、空格,长度不定。在多行项目中填写地址栏各项元素时,你可以应付邮编、地区、城镇,而无需暗示特定的地址结构。
这种通用表单能够为国际地址提供灵活的输入栏,但是错误检查会变得比较困难,因为一些字段会有多种表现形式。而且,由于其灵活性,通用表单没有对国家或文化进行真正优化,它通常有用,但非理想形式。
本文考虑了几种国际地址栏设计方案,但还存在其他类型或者问题。若有其他见解,欢迎发表评论。
———————————————————————
Luke Wroblewski的著作网站表单设计

blueben翻译的基础上做了适当修改,原文出自Smashing Magazine
________________________________________________________
不,不应该! 第一印象中,是否在新窗口打开链接取决于给定的网站以及访问者的偏好。有大量链接网站的访问者更愿意默认链接自动在新窗口打开,而不用手动打开一堆新窗口。而链接较少网站的访问者更愿意在新窗口打开某些特定链接,这样他们就能继续待在当前页面便于以后浏览。然而,这些观点并不正确。
用户不喜欢被一堆弹出窗口包围,而且有时那些无法使用的“后退”按钮真的让人很生气。有些用户甚至都没意识到打开了新窗口,而去点击那个无法点击的 “后退”按钮—当然没任何反应。这对用户并不友好,设计师应该努力消除这种不友好体验。
让用户来控制
从易用性看,强制在新窗口打开链接,违反了用户界面设计的基本原则:用户总能控制与其互动的界面。
用户页面和可用性的领先研究者认为用户友好和有效的用户界面总是让用户控制他们在使用的应用程序或系统,例如
Ben Shneiderman (界面设计的8条黄金规则),
Theo Mandel (用户界面设计原则)
Jakob Nielsen (网站设计的10个最常见错误)
Bruce Tognazzini (互动设计的首要原则)
用户要依赖用户界面的一致性,才能知道在互动过程中不会被干扰或被打断。用户一旦使用了界面元素,就必须能知道、理解、并且预料到正在发生什么,将要发生什么。任何违反此原则的设计都会导致以设计为导向、而不是以用户为中心的设计。
正如Shneiderman所说,有经验的用户强烈希望他们来操控整个系统,而系统能回应他们的行为。作为设计师,我们有责任设计这样的系统,用户是交互的发起者,而不是被动的反馈者。
设计师希望迫使用户使用或浏览他们创建的界面或网站。这种心理背后的理论根据来自与于清晰的商业目标,因此经常受到项目经理的偏好,但是设计师有职责提醒经理用户并不关心这个。
事实上,开发者往往会忘记一个简单的基本事实:如果用户想关闭一个应用或者离开网站的话,他们一定能做到——无论有什么障碍妨碍他们退出。障碍越多,用户体验越差。
作为设计师,我们可以决定为用户提供清晰明了的选择,但是我们没有权力去替用户做决定。
为什么强制在新窗口打开链接是错的
用户需要能控制与其互动的界面,所以替用户做决定是错误的,因为设计师的决定并不总能与用户的意愿相符。强制在新窗口打开链接的主要问题是,这个决定推翻了用户能控制在浏览器上显示什么东西的决定。
一些大型网站(Google, Amazon, AOL, Yahoo) 采用的是在当前窗口打开链接(除非明确说明将在新窗口打开),所以用户会认为未知页面上的链接都在当前页打开。即用户期望链接会在当前页打开。
设想一下,在点击链接之前用户并不知道是否在新窗口打开的两种情况:
1、用户想在新窗口打开链接,但链接在当前窗口打开;
2、用户想在当前窗口打开链接,但链接在新窗口打开。
第一种情况,用户可以使用右键菜单或者快捷方式在新窗口打开链接。此时,用户是交互的发起者,他们决定如何显示被链接页面。网站行为符合用户期望,从而产生好的用户体验。
第二种情况,用户直接点击链接,突然发现打开了一个新窗口。此时,用户是交互行为的被动反馈者,他们需要对被打开的链接方式做出反应——例如关掉自动弹出的窗口。而且,网站行为并不符合用户期望,结果导致糟糕的用户体验。
用户会觉得网站都没询问就做了这些事很讨厌。如果用户想在新窗口打开,让他们自己去打开,不要低估他们的智力而替他们去做决定。除非理由充分,否则不要给用户强加新窗口。
任何规则都有例外
当然,任何规则都有例外:有些情况下在新窗口打开链接是正确的,而在当前窗口打开却是错的。Jakob Nielsen建议如果被链接的文件是非HTML文件时,应该采用新窗口方式。这种情况下,他推荐使用没有浏览器控制栏的弹出窗口。此时,有理由要让用户在点击之前就清楚的知道将在新窗口打开链接。
小图标往往能起到告知作用,但是要确保那个链接不会被误解。采用图标告知访问者链接到外部网站是常见做法。但是一个额外或者相似的图标也会引起反面情绪。这种情况下进行小型的可用性测试也许起到作用。
telepolis
Telepolis 让访问者知道某个链接链向外部页面。但是,这个图标也有可能会迷惑访问者,它看起来代表在新窗口打开链接。
以下几种情况适合强制在新窗口打开链接:
• 提供帮助的链接。如果访问购物车页面,用户点击“帮助”。此时,用户不想离开购物车页面,所以新窗口能被接受。这时候,动态工具提示栏优于弹出窗口,而弹出窗口又优于新窗口。
• 中断进程的链接。例如,用户在填写表单,表单下方有服务条款或隐私策略的链接,有理由在新窗口打开这些链接,避免它们中断填写进程。这在注册表单中很重要,而在支付表单中则有决定性意义。否则,用户会丢失那些填过的信息,并且关闭浏览器窗口。
• 指向非HTML文档的链接。例如:.pdf, .xls, .mp3文档等等。提前告知用户会有新窗口打开。使用电脑文件格式时,如PDF或者电子表格(Spreadsheet),用户感觉像是在使用电脑软件。用户并没有在浏览网站,所以不应该给用户浏览器界面。避免用浏览器打开此种类型的文档。Jakob Nielsen 介绍了应该怎么做。
• 指向需要一定时间下载的大图片的链接。在新窗口打开此图片有助于用户关注内容,而同时图片在后台加载。
原谅他们,他们不知道自己在做什么。
用户想在新窗口打开链接时实际是如何操作的,目前还没有研究能帮助我们更好的了解这一点。但是,可以假设大多数用户并不知道快捷方式,他们更喜欢凭感觉、直接的方式。经验比较丰富的用户更喜欢采用以下的快捷方式。
有三种办法可以在新窗口打开链接。大多数用户采用第一种——并不是因为这种办法更有效,而是因为它最明显。现在的浏览器都可以实现这三种办法,较旧的浏览器可能不支持第二或者第三种方式。
1. 右键菜单。用户在链接上点击右键,选择“在新标签/新窗口打开”。如果在新标签页打开链接,当前窗口保持不变。如果在新窗口打开链接,新窗口出现且成为当前窗口。
2. Ctrl+点击快捷键。用户按住Ctrl键点击链接。链接自动在新标签页打开。当前窗口保持不变。这种快捷方式根据操作系统和浏览器的不同会有所变化。
3. 中键点击。用户将光标放在链接上,点击鼠标中键。链接自动会在新标签页打开。当前窗口保持不变。
第一种办法效率最低但是最常用。它需要更多次点击和注意力,因此也需要更多时间,用户要承担更多认知压力。第三种办法最快,因为用户不需要在右键菜单和页面之间切换。
deli.cio.us
似乎多数用户都采用右键菜单的办法在新标签页或新窗口中打开链接。
用户的不满来自于他们大多数人只知道第一种方式。因此,需要新开窗口的时候,他们要用右键,多次点击,视图要来回切换。这样让人很不快。接受在当前窗口打开链接的默认方式,同样也不好。如果用户不知道如何快速在新窗口打开链接,那就告诉他们—他们会很感谢你的帮助.
但是我能让用户留在网站上,对吧?
不对。即使你强制在新窗口打开链接,如果用户想的话,用户会自己想办法在原窗口打开链接:
1、用户可以复制链接,粘贴到浏览器地址栏,点击“回车”。这样就在当前窗口打开链接。
2、用户可以拖动链接到地址栏,也会当前窗口打开链接。
不幸的是,并非每个浏览器都允许用户这么做。但一些新浏览器有这项功能已经很长时间了。如果用户不想在新窗口打开链接,他们会找办法绕开设计者的设置。
firefox
Firefox 允许用户决定如何打开那些设计师设定在新窗口打开的链接。
因此,从设计师的眼光看,最好提供给用户清晰快捷的办法,尊重用户的兴趣,不要浪费用户的时间。如果你希望用户回来,那就帮助他们,引导他们,但是千万不要打击他们浏览站点的耐心和意愿。
优化方案
我们认为,最有效、最友好的方式是让用户自己去选择如何打开链接。但是,他们并不需要通过浏览器去做这些。设计师可以向用户提供复选框(check-box),选择如何打开链接。你需要确定复选框可见,并且用户能明白它的好处。
JaveScript可以实现此功能。复选框被选中,所有链接都会在新标签页/新窗口打开。现在你可以自己试试。
Open external links in a new tab?
复选框源代码如下:

Open external links in a new tab?

JaveScript源代码如下(需要把domain.com 换成你的网站地址。这样浏览器就可以区分外部链接和本地链接。)

此段JavaScript不使用cookies ,所以用户随意浏览,他们的偏好不会被保存。如果希望复选框能对整个网站起作用,就要考虑用cookies来保存用户偏好。
底线
让用户可以控制正在使用的界面非常重要。用户期望在原窗口打开链接,那就将链接设置成在原窗口打开。除非理由充分,不要强迫用户使用新窗口。帮助之类的链接如果会中断进程或者引导至非html文档,考虑采用新窗口打开这些链接。
允许用户在给定网站上选择链接的打开方式。两害取其轻,应在当前窗口打开链接。而且如果用户不知道如何快速在新窗口打开链接,那就明确告诉他们,他们会感谢你的帮助。