搜索框怎么设计搜索框设计方法.doc

《搜索框怎么设计搜索框设计方法.doc》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、搜索框怎么设计搜索框设计方法搜索框一种常见的交互控件，用于精准提取海量的信息中的准确内容。本文作者分享了设计一个搜索框的几个要点，希望大家从中可以有所收获。1.什么是搜索框？搜索框一种常见的交互控件，用于精准提取海量的信息中的准确内容。搜索框几乎存在所有的网站和APP中，尤其是海量内容为导向的产品之中，例如音乐库、电商类网站，做好搜索（框）尤其重要。2.搜索框的应用场景设计过那么多的搜索框，你所不知道的是，它还有以下几种细分应用场景。（1）作为搜索引擎入口说到搜索，我们一般人首先会想到的是搜索引擎，例如谷歌，而在搜索引擎中，首页十年始终如一的搜索框最深入人心。反过来说，正是因为搜索引擎巨

2、头的成功，搜索才越发备受重视，搜索框也是几乎成为网站或者APP的标配。（2）用于查找内容典型的应用场景，放在网站顶部之类的显眼位置，用于查找网站中的内容，一触即达。（3）用于快速定位查找内容的变种，例如，在手机“设置”中，当设置的选项较多时，通过搜索框进行搜索，可以快速定位到想要的设置项。（4）用于活动推荐一些电商网站，巧妙利用搜索框中预置的词，可以达到活动推荐的效果，例如下图中搜索框内置“油烟机”一词，用户只需通过点击搜索即可直达结果页或者活动页面。3.搜索框的类别（APP）什么？搜索框还分类别？不是都是放大镜+线框组合么？但是，搜索框还有以下这些类别区分。（1）隐藏式搜索框只提供一个

3、放大镜图标，需要再点击图标跳转到搜索页面；或者是需要下拉时才出现，例如微信首页的搜索框。（2）普通搜索框通常固定在页面顶部，包含搜索框的普通要素（放大镜+线框）。（3）有提示搜索框此类搜索框的特征是，中间有提示语，通常这类的都可以复合搜索，例如可以搜名称或者代码。（4）含图片搜索框顾名思义，与普通搜索框相比，增加可以“以图识图”的搜索功能，例如淘宝就可以通过上传图片，搜索与图片同类的商品。（5）带语音搜索语音交互是新的交互热点，相比普通搜索框，带语音搜索框可以明显减轻用户手工输入文字的烦恼，现在语音识别的成功率已经达到了很高的地步。（6）精准分类搜索与其他搜索框相比，此类搜索框可以先选择

4、分类，再输入关键词搜索分类下的内容，亚马逊的习惯做法，在商品分类较多，但又需要分类检索的时候适用，日常生活中可见超市日用品、食品等分类法。