如何让搜索框的体验更好？我总结了这些设计套路！(7)

输入完成匹配：仅在输入完成后，点击「搜索」按钮时，才开始进行搜索、匹配，直接展示搜索结果。这种方式省去了对输入过程实时分析、引导的过程，适用于对搜索功能要求不高的情况。

△ 即时搜索与输入完成匹配

目前很多App采用组合方式：输入过程关键词联想+输入完成执行搜索。

这是一个很讨巧的组合。既对用户提供了必要的帮助和引导，又减少了请求次数，避免出现等待加载的状况。

7. 关键词联想

关键词到底有什么作用？简单来说是：联想、匹配、引导、纠正。展开来说，有四个作用：

• 用户不一定清楚要搜的精确名称，关键词可以作为引导。

• 系统可以根据已有的搜索数据，对关键词进行关联分类，并且与数据库精确匹配。如果用户选择了做过关联处理的词，就可以获得内容更精确、数量更可控的搜索结果（而这次选择，对系统本身也是一次反馈）。同时，因为已预先做了分类，搜索时可以直接调取、减少计算量，速度也更快。

• 可以减少用户的输入错误。

• 提供很多很动态的运营位。

关键词的展示形式比较灵活。最简单的是根据输入词，直接展示联想的关键词（如今日头条），但因为页面空间有限，被键盘遮盖后只能露出几条，于是大家又发明了二级标签。它伴随关键词一起出现，提供更多相关的入口。

如下图，搜索「niu rou」，推荐关键词「牛肉」，后面跟着 3 个小标签「风干」「手撕」「张飞」，这 3 个关键词都是对「牛肉」的再次联想。点击整栏，执行搜索「牛肉」；点击二级标签（如“张飞”），执行搜索「牛肉张飞」。需要注意的是，二级标签的操作区域很小，对于操作精准度要求高，数量不能超过 3 个。

△ 今日头条直接展示联想词、京东采用二级关键词标签

有时系统推荐的关键词不够精确，用户需在后面输入其它内容。但无论是关键词，还是二级标签，点击后都直接执行搜索，这就需要用户在搜索结果页再去激活搜索框，继续完善搜索词，中断了搜索过程。YouTube、Facebook、亚马逊、淘宝等采用了「向上补全」功能，点击关键词或二级标签，执行搜索，点击向上补全icon，会将关键词补全到搜索框中。

△ 淘宝的向上补全功能

（编辑：ASP站长网）