欢迎光临九牛科技,我们是一家专注中小型企业网站建设、营销型网站建设、响应式网站建设公司!

咨询热线:82195810或15022223002    网站导航  社区团购  抖音运营
新闻中心News
天津网站建设-高端网站制作-网页设计-百度seo优化-网络营销-小程序开发推广-公众号运营公司-武清做网站-九牛科技

网站设计思考:如何设计出一个好用的搜索框

作者:小牛 | 点击: | 来源:小牛
0903
2020
搜索的主要目的是为了帮助用户快速的找到他们想要的呢日用,在很多的产品中有着举足轻重的作用,如:用户通过淘宝搜索筛选想要的商品;通过知乎搜索寻找问题答案;通过app搜索...
搜索的主要目的是为了帮助用户快速的找到他们想要的呢日用,在很多的产品中有着举足轻重的作用,如:用户通过淘宝搜索筛选想要的商品;通过知乎搜索寻找问题答案;通过app搜索寻找自己想要的内容......乍一看,或许很多的人会觉得搜索很简单,然而实际上,搜索涉及的逻辑很多的,今天,天津网站建设分享了设计一个好的搜索框需要掌握的要点,相信对广大设计师而言会有帮助的。
 
 
 
一、什么是搜索框?
 
所谓的搜索框,是一张常见的交互控件,主要用于精准提取海量信息中准确的内容。搜索框几乎存在的互联网中每个产品中,几乎所有的网站和APP中都有它的存在,尤其是存在于海量内容为导向的产品之中,如:音乐库、电商类网站、门户类网站.....所以做好搜索(框)尤其重要。
 
 
二、为什么要做搜索功能
 
主要的是为了方便用户,让用户更加快捷高效的从大量信息内容中通过一些关键的搜索,快速的找到自己的感兴趣的内容;其实,可以通过适当的引导设计来完成产品的商业需求。
 
 
三、搜索应用于哪些场景?
 
目前互联网中所存在的搜索框设计有很多的,不过若细分的话,一般可以分为如下的几大应用场景:
 
1)作为搜索引擎入口
 
提到搜索,人们最先想象到的就是搜索引擎,如:谷歌,360,然而在搜索引擎中,首页十年始终如一的搜索框是最深入人心。反过来说,正是因为搜索引擎巨头的成功,搜索才越发备受重视,搜索框几乎也成为网站或app的标配。
 
2)用于活动推荐
 
有些电商网站,巧妙地利用搜索框中预置的词,能够达到活动推荐的效果。
 
3)用于查找内容
 
典型的应用场景,通常是放在网站顶部之类的最显眼的位置,方便用户看到,从而查找网站中的内容,一触即达。
 
4)用于快速定位
 
查找内容的变种,如:在手机“设置”中,当设置的选项较多时,通过搜索框进行搜索,能够快速定位到想要的设置项。
 
 
四、如何设计一个好用的搜索框?
 
1、搜索框要足够简单
 
若你设计了一个搜索框,一定要确保它看起来确实像一个搜索框,并且使用起来一定要足够简单。可用性研究表明,默认情况下,不显示高级搜索选项对用户会更加友好。原因在于,高级搜索选项很可能会混淆要尝试使用它的用户。
 
2、尺寸大小要合适
 
大部分设计人员都是会犯同样的错误,那就是输入框太短,当用户输入长内容时,只能看到其中的一部分,严重影响到用户体验,因为用户无法轻松地回看和编辑其刚刚才输入的查询条件。但是,若输入框的长度是根据用户的预期输入来确定大小的,这样的话对用户而言就会友好很多。
 
3、放在用户预期找到的位置
 
若因为搜索框不够突出,不容易被察觉,用户还得花费精力去找它,那这个设计无疑是不够友好的。
 
小提示:
 
1)理想情况下,虽然搜索框在用户需要的地方应该能轻易出现,但是搜索框的设计也应该完美地契合网站的整体设计效果。
 
2)内容越重的站点,你越希望搜索框显著。如果搜索对你的网站至关重要,请使用大的对比度,以便搜索框和图标能从页面背景和周围元素中脱颖而出。
我要咨询做网站
案例展示
建站流程
  • 网站需
    求分析
  • 网站策
    划方案
  • 页面风
    格设计
  • 程序设
    计研发
  • 资料录
    入优化
  • 确认交
    付使用
  • 后续跟
    踪服务
  • 022-82195810
    82195810
Hi,Are you ready?
准备好开始了吗?
那就与我们取得联系吧

咨询送礼现在提交,将获得九牛科技策划专家免费为您制作
价值5880元《全网优化视频教程》一份!
下单送礼感恩五周年,新老用户下单即送惊喜大礼
咨询热线82195810
合作意向表
您需要的服务
您最关注的地方
预算

直接咨询