如何设计出一个完美的搜索框

2017-05-15 17:14 41 1 收藏

当用户遇到一个相对复杂的网站时,他们往往会首先寻找这个网站内的搜索框,以便能快速高效地到前往自己想去的页面或找到自己最为关心的内容。因此,搜索框的设计及其可用性问题其实是一个不容忽视的要点。如何设计出一个完美的搜索框?

【 tulaoshi.com - 搜索框 】

使用放大镜图标

  一个搜索框应该始终与放大镜图标放在一起。所谓图标,其实就是代表着一个对象、动作、想法等多种含义的图形符号。我们通过图标看到的不仅仅是图标本身,而是它所代表的内在含义。然而,对于用户来讲,具有通用性代表含义的图标为数并不多,幸运的是,放大镜图标正是其中之一。

  即使没有文本标签,用户也能轻易地识别放大镜图标

  提示:使用示意型的图标即可,这也是最简单的放大镜图标版本。更少的图形细节能够加快用户的识别效率。

如何设计出一个完美的搜索框

搜索框要显著

  如果搜索是你的应用程序/网站的一个重要功能,那么搜索框的显示务必要足够显著,以保证用户能够最快的发现它。

  直接显示完整的搜索框很重要,因为默认只显示搜索图标(点击图标才展开搜索框)的话会使搜索功能不那么明显,而且增加了用户的交互成本。

如何设计出一个完美的搜索框

提供一个搜索按钮

  搜索按钮可以帮助用户识别出触发搜索操作的下一步——即使他们可能往往会通过按Enter键来执行此操作。

  提示:

  1)提交按钮的尺寸大小要合适,以便用户不必非常精确地移动鼠标位置到它上面。较大的可点击区域会使得按钮本身更容易被发现和点击。

  2)使用Enter键或点击搜索按钮都应该能执行搜索操作才对,毕竟许多用户仍然有点击搜索按钮来提交搜索的习惯。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com)

如何设计出一个完美的搜索框

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com)

将搜索框放在每一页上

  用户在每个页面上都应该能获取搜索框,因为如果用户找不到他们要找的内容,他们往往会自然而然地想要尝试使用搜索功能来进行查找,他们才不关心自己当前是在你网站的哪个地方(以及该不该有搜索)。

如何设计出一个完美的搜索框

搜索框要足够简单

  如果你设计了一个搜索框,请确保它看起来确实像是一个搜索框,并且使用起来要足够简单。可用性研究表明,默认情况下不显示高级搜索选项对用户会更加友好。高级搜索选项(例如下面的示例中的布尔搜索查询)可能会混淆要尝试使用它的用户。

如何设计出一个完美的搜索框

放在用户预期找到的位置

  如果因为搜索框不够突出、不容易察觉,用户还得花费精力去找它,那这个设计无疑是不够友好的。相关阅读如何设计搜索框 搜索框设计要素

如何设计出一个完美的搜索框

来源:https://www.tulaoshi.com/n/20170515/2648200.html

延伸阅读
一个定制 CFileDialog对话框的实例 编译:northtibet 下载源代码     很多程序员都喜欢让自己的代码运行效果与众不同。Windows系统的应用程序打开某个文件一般使用的都是默认的CFileDialog。但是这个默认的CFileDialog往往满足不了用户的要求。我...
首先应该建立一个combo1的comboBox控件,作为下拉框的最终实现工具。 Private Sub Combo1_Click() MSFlexGrid1.Row = MSFlexGrid1.RowSel MSFlexGrid1.Col = 2 MSFlexGrid1.Text = Combo1.Text End Sub 'Private Sub Combo1_LostFocus() 'Combo1.Text = MSFlexGrid1.Text 'End Sub Private Sub Form_Load() Combo1.Vis...
睡觉 你没有看错,睡觉也是一种腿部减肥方法。相关专家介绍,睡觉除了能帮助有效减肥还可以帮助有效瘦腿,只要你调整一下睡觉的姿势,或在双腿的下面垫一个垫子,且使腿部高于心脏即可。这样可以有效减少小腿的负担,从而起到瘦腿的作用。 按摩瘦腿 此种腿部减肥方法的减脂原理是:通过对腿部穴位的直接按摩可促进腿部的血液循...
标签: PS
PS教你绘制一个WEB登陆框   1、新建tulaoshi一个文档,这里我用的是400*300像素,填充一个#d0c0be的颜色填充调整层。 2、选择画笔工具,使用圆角柔边画笔,设置前景色为#364e35,画出如下图中的形状出来。 3、执行滤镜模糊高斯模糊,我用的数值是46.9像素,赋予这个颜色层一个模糊效果,跟我们的背景融合。 ...
设计一个成功的Logo,其背后往往隐藏着很多不为人知的策略。其实,我们设计Logo就是一个走向成功的过程,每一个脚印都是成功的关键,每一段路程都影响着走向成功的历程。简略而言,这被分割的路程可以分为以下几个必备:不同阶段的聆听、研究、发展、反馈和修改。 可能大家觉得这有些抽象,那么我从自己的角度来分析一个成功Logo的历程。 步...

经验教程

228

收藏

28
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部