哈尔滨财富通科技发展有限公司,黑龙江网站建设,哈尔滨网站制作,哈尔滨网络运营,哈尔滨微信营销

一个特别好用的搜索框必须考虑的五个方面

来源:艾艺信息       更新时间:2015年10月27日    点击:504       分享新闻到:

这篇译文开门见山,从搜索框的可见性、范围搜索、局部搜索、高级搜索以及输入五个方面聊聊如何设计出一个特别好用的搜索功能,内附大量实例(想知道谷歌搜索有哪个交互不好吗),结合实践,深入浅出,帮你掌握在线搜索的这五个方面。


可见性


在UX领域,可见性是其根本概念之一:由物体的外形特征推导出其行为上潜在的可能。比如大门上的推板意味着门是可以推的;把手则说明门是可以拉的。 你有没有遇到过走到一扇门跟前却发现开门的方式与你预料的大不相同的情况呢(译者注:有的,我的大学就是,不过每年HCI的课都会拿出来举例,给人一种 “我是故意的”高逼格假象)?这是由于事物的外形特征和实际功能不匹配造成的。


同样地,搜索框的设计应该遵循其功能性。其目的是允许用户以关键字词的方式输入请求,那么它就应该看起来像是能被输入的,并且有一个能够明确表明其功能的相关按键。它还应该足够宽,这样才能容纳较长的文字。

eBags.com里的搜索功能结合了外形和功能

basmatitree.net的一个相比起来不那么常见的搜索框设计


可见性这个概念应贯穿于用户体验的方方面面。然而,目前有很多主流的网页搜索引擎为了标榜个性或品牌需要而选择另类的设计。Google就是个例子,它在首页采用了两个按键,其中包含了个莫名其妙的“I’m Feeling Lucky”选项。这两个按键都被居中置于输入框下面,所有组件的边框是如此之窄致使其功能性只能被含糊地理解到。



极简的谷歌搜索框设计


然而,这些设计已然被大众接受了,毕竟都这么多年了,仗着谷歌的名声人们似乎已习惯了把这种所谓的“简约”当成其“优秀”品牌文化的一种诠释。首页 搜索框的位置和排版只是暂时的;当用户一在输入框里进行输入时,页面的排版就会变掉,而结果和搜索框会跑到页面的左上角。搜索按键的标签会变成一个放大镜 的图标。直到这时,作为一个搜索功能的行动按键,它具备了合格的可见性。

谷歌显示结果的页面上一个更加常见的搜索框设计


Bing也同样在首页提供了一个相似的居中搜索框,一旦进行搜索后,搜索框等一系列组件会立马乾坤大挪移到左上角。


Bing结果页面上的搜索框




雅虎可能算是所有这些搜索引擎里正常的了——采用了简单的布局和始终明确可用性的按键,这两者在搜索前后都会保持相当的一致性。

雅虎搜索界面上的搜索框



这三个网站都会在页面一加载好就自动定位光标到搜索框上,同时也都允许用户通过点按回车来提交搜索请求。


另外,它们都会在提交搜索后在输入框里保留搜索请求的内容,这能让用户对其搜索的信息进行确认,同时还能为下一次关联性的搜索提供便捷。


在互联网上,用户可以搜索到近乎所有的东西,除了特定情况下对主题或内容类型有所限制。在网站搜索中(比如某个特定网站内的搜索),这类限制往往还 会以更加严苛的形象频繁出现。这正是那些占位符文字和其它提示性标签大展身手的时候,它们能帮助用户仅对有意义的关键字词进行搜索。以Pipl网站为例, 它通过占位符的方式告知用户他们可以搜索人名、位置、邮件、用户名或者电话号码。当用户点击输入框进行文字输入时,这些提示性文字会立马消失。