我们检测到您可能使用 AdBlock 或者其他广告屏蔽插件,导致网页出现错位、变形以及丢失的情况,影响网站内容的阅读。
本站无任何商业广告!为了伍林堂平台的生存,恳请您能够理解,将伍林堂旗下交互产品加入白名单(方法点此),万分感谢!
网站优化

网站优化

首页 > 新闻资讯 > 网站优化 > 如何设计出正确的搜索模式?

如何设计出正确的搜索模式?

2018-04-21 热度:9422 ℃

注:如果你正在阅读这篇文章,那么你一定正在设计一个有搜索功能的网站或应用程序。在这篇文章中,我将介绍 5 个最佳实践,这些实践可以帮助大家设计了更好、更实用的搜索机制。

如何设计出正确的搜索模式? 网站优化 第1张

最佳实践

1.视觉线索

无论创建任何类型的用户界面,为用户提供快速扫描屏幕所需的工具是你设计的一部分。这样做可以确保你的用户知道在什么地方找到他想要的东西,何时需要使用以及与其交互后会发生什么。

放大镜图标

使用放大镜图标,我无法保证这样会加快了搜索栏查找的速度。但是图标越简单越好,较少的细节可以让用户更快地浏览。虽然,一个图标本身没有输入容器或按钮,实际上会使搜索更加困难。

如何设计出正确的搜索模式? 网站优化 第2张

极简主义搜索图标的示例

人们通常认为放大镜图标表示搜索工具,即使它没有标签说明。但是,只显示图标的搜索框会使搜索变得更加困难。(言论来自NNG凯蒂谢尔文的“搜索设计中的放大镜图标”)

一个实际的搜索按钮

不是所有用户都是资深网民,这也就意味着并不是每个用户都知道,一旦在输入框里输入查询内容,按下回车键就可以得到相关信息。因此,在搜索输入旁边设计一个实际的按钮可以帮助用户确认他们的下一个动作,从而减少用户所需的认知负荷。

如何设计出正确的搜索模式? 网站优化 第3张

注意:避免将按钮放在输入框的左侧,上方或下方。

提示

在文本输入获得焦点前,你可以隐藏输入按钮。

确保按钮的大小适中,以便点击起来感觉自然。

2.输入特性

有时候,越是闪亮,强大或面积大的东西也不一定能引起人们的注意,搜索模式也一样。不如将它改为你理想的风格!但切记搜索框的设计必须与你的网站或应用程序的主题相吻合,并同时确保它足够引人注目。

如何设计出正确的搜索模式? 网站优化 第4张

Youtube新的(令人惊叹的)黑色主题通过保持搜索模式与其他元素的一致性就完美地阐述了这一点。

“搜索框也并不是越长越好”

但也要确保输入长度也不要过短。据NNG的研究表明:拥有能够容纳 27 个字符的输入,可以满足90%的用户的需求。

如何设计出正确的搜索模式? 网站优化 第5张

如图:一个常见的 5 词 26 个字符搜索的例子。

3.透明占位符

为输入的占位符文本使用适当的副本很重要,它们通常是暗示用户可以搜索的内容。 这确保了他们知道要搜索什么,并且不会因编写错误导致查询失败而感到沮丧。最近,Web工具可以通过在HTML5 中添加提示作为占位符来轻松完成此操作。

如何设计出正确的搜索模式? 网站优化 第6张

添加占位符可以帮助用户过滤查询的内容。

如何设计出正确的搜索模式? 网站优化 第7张

发表评论

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

相关文章

用户体验是玄学吗?

用户体验是玄学吗?

恍恍惚惚又是一年年底。又到了设计师们的“季节性迷茫期”,最近我经常接到好多朋友的信息,自己行间透露着迷茫和不自信。大的趋势和节奏还是和去年一样,有些视觉设计师询问我如何转UI,有些UI设计师问我如何才...

什么是吸引外链的正确方式?

什么是吸引外链的正确方式?

做SEO的都知道,最好的链接是吸引来的,不是”发”出来的。网站能吸引链接,说到底靠的是内容。内容的形式可以是各种各样的:好玩的或者有用的视频有价值的博客帖子,就像SEO每天一贴这种好玩的测试题,看看朋...

Linux利用Postfix、Dovecot自建邮件服务器

Linux利用Postfix、Dovecot自建邮件服务器

老左个人而言,邮件系统一般直接使用免费第三方的邮件或者使用腾讯域名邮局,且在收发邮件问题上也没有特别严重的问题,毕竟并不是业务必须需求。但是,对于业务必须且具有严格要求依赖邮件的,那如果使用免费邮...

18位设计师为你预测2018用户体验设计趋势

18位设计师为你预测2018用户体验设计趋势

设计师总再盼望未来 - 在整个工作流中我们重复相同的事情。最后,困扰设计师往往是围绕着一个简单的问题:我们如何才能提高用户的体验?为了解决这跟题,Figma采访了 18 位设计师,让他们来来预测 20...

一年400元,监控APP让你知道对方的所有隐私

一年400元,监控APP让你知道对方的所有隐私

本文作者:Longas_杨叔,微信公众号:全频带阻塞干扰(RFJamming)注:有读者留言问,“总感觉自己的行踪被人掌握,是不是有什么能够监控微信、QQ、通话记录的东西?”有,肯定是有滴,一些政府级...

从零开始,这个产品经理手把手教你做小程序

从零开始,这个产品经理手把手教你做小程序

文 | 王伟我能做的就是,做好手头的事情确保,就算这事对公司来说又黄了,我也要通过这事有所收获。(一)产品定位:微信小程序是一种全新的连接用户与服务的方式,它可以在微信内被便捷地获取和传播,同时...

如何跳出思维局限,开创新品类?

如何跳出思维局限,开创新品类?

世界上本不存在什么东西,可以凭空创造出来,新事物的出现,无非都是在原有的事物上重新获取洞察,进而对他们的关键环节进行更迭、替换。当我们面对产品创新这个课题时,总不免陷入一种恶性循环:看到人家的品牌开发...

如何七天快速了解一个行业?

如何七天快速了解一个行业?

其实最快速了解一个行业的方法,是直接约见大咖,和行业里最有经验的人对话。所以应聘本身,就是一个帮助我们快速了解行业的过程。还是开头那句话,不要害怕应聘,即使被拒绝了,就当练习了、学习了。在写完《从记者...

 
QQ在线咨询
公司总部
0513-66814553
战略合作
0513-86212895
本站会员尊享VIP特权,现在就加入我们吧!登录注册×
»
会员登录
新用户注册
×
会员注册
已有账号登录
×
请先 登录 再评论,若不是会员请先 注册