本文翻译自：Site Search Suggestionsby Kate Moran on May 20, 2018

搜索建议也称自动完成或自动建议。这曾经是一个搜索功能中附带的功能。（在本文中，我们使用“站内搜索”一词指的是一个网站自己的搜索功能——只在该网站的内容内搜索——而不是像谷歌、必应或百度这样跨多个站点搜索的全网搜索引擎。）

定义：

搜索建议是指当用户在搜索框中输入文字时，在下拉列表呈现的推荐内容。这些建议显示在搜索框下面，并随着用户键入其查询的每个字母而改改变。

近年来，搜索建议已成一个好的搜索功能不可或缺的期望标志。这个期望可能是源自用户频繁接触谷歌的查询建议的结果，而谷歌总是在定义“好”的搜索功能的标准（不切实际的）应该是什么。

当您的用户从搜索建议中选择而不是键入自己的完整查询时，他们会觉得很方便，原因如下：

• 选择一个适当的关键词，它将显示良好的结果，而不是组成一个可能没有结果或结果不佳的查询。

• 因为可以键入更少的内容，减少了交互成本，

• 因为用户不需要自己键入整个查询，避免输入错误

• 因为用户可以简单地识别出他们想要的词或短语，可以用更少的脑力去搜索

有趣的是，尽管用户期望这个功能，并且有时当它在一个站点上不可用时对它进行评论，但实际上他们并不总是使用它。在我们最近对电子商务网站的研究中，建议的查询只有23%是由用户选择的。（在提供建议的136个实例中，选择了31个建议。这个比例的误差幅度是7%。）

但即使用户实际上没有从查询建议列表中进行选择，这个功能仍然有可能作为参考，为用户提供一些便利。用户可以阅读这些建议，查看网站上的可用内容、如何拼写困难词，以及其他用户搜索的内容。在某些情况下，特别是当查询短语较短时，用户只需自己键入查询，而不必重新获取鼠标或点击屏幕。

对于网站搜索，搜索建议有进一步的好处，可以通知用户网站提供的产品或选项的范围。相反，如果在输入产品名称的前几个字符后没有显示搜索建议，则有些用户可能会得出结论，即该网站不提供该产品，甚至在没有执行搜索的情况下放弃该网站。

如果您计划实施或改进网站的搜索建议，请遵循这些提示以使其尽可能有用。

确保建议是有用的

确保每个查询建议关键词都有实际的良好的相关结果。

可用性测试的一个参与者在JCPenney的网站上买了一个新的手提箱。他在搜索框中输入了“luggage（行李箱）”，并在建议的查询中看到了“luggage sets clearance（行李箱清仓）”这个短语。他选择了这个查询关键词，并被带到一个完全没有行李箱的结果页面——只有两件宠物旅行用品。

“这很奇怪，”他说。“因为搜索建议的关键词，所以我才点击 luggage sets clearance，希望它带我去行李箱购买页，所以这不太好。”

当查询建议关键词返回不相关的结果时，惹恼了用户

搜索框返回的建议关键词宁可以为零，也不要有不相关结果。不相关比无用的更糟糕——它们偏离了用户的方向，用户会觉得很傻 。

使用不同的文本样式区分键入的查询文本和建议的关键词

在“建议的搜索”下拉列表中，每个建议包含两部分：用户已键入的字符和系统为完成查询而建议的字符。

建议1

使用不同的视觉样式来显示属于每个类别的字符是很重要的。您可以使用粗体、斜体、颜色或缩进来传达这些部分之间的差异。视觉差异化帮助用户理解显示建议的原因并扫到可用选项。

网站提供的建议类型应帮助您确定建议的样式：

• 如果建议搜索功能，是在用户键入的查询文本末尾添加附加关键词，我们则应突出显示建议的字符；

• 相反，如果建议搜索功能，推荐的是流行查询词，它的任何位置都可能包含用户键入文本，则最好突出显示用户输入的查询字符；

例如，一个用户在迪克体育用品的网站上输入了他的查询“篮球圈”。

当他输入每字时，建议的搜索词出现在下拉列表中。Dick的体育用品使用第一种建议——它只在用户文本中添加字符，以完成该查询。与此特定用户已经键入的字符匹配的字符以粗体显示（“basketball h”），而建议完成查询的字符具有正常的字体粗细。

使用粗体文本在其搜索建议中为用户键入的字符设置样式

这种方法清楚地显示了这两个部分之间的区别，但不幸的是，它强调了每个建议中的重复字符（已经键入的字符）。因此，Dick的体育用品最好能提供这样的搜索建议，并强调其独特的特征：

• basketball hoodie

• basketball hoop

• basketball hat

但是，如果您的功能是查询中的任何位置都包含用户文本的流行查询，则相反的方法更好—您希望突出显示用户的查询。

使用我们的篮球示例，具有此类建议的系统将返回诸如“篮球连帽衫”之类的建议，还将返回诸如“便携式篮球箍”和“儿童篮球帽”之类的建议。在这种情况下，应突出显示用户的查询，以帮助用户扫描建议并确定查询文本在每个建议中的位置。建议。例如：

• basketball hoodie

• portable basketball hoop

• kids basketball hat

在搜索建议中包含范围

范围搜索应该只在某些网站上使用，即使这样，也只有在它能够很好地实现的情况下。如果你的网站范围内的内容，你会想反映在网站的搜索建议。

对于作用域站点，每个搜索建议可以包含三个组件：

• 用户已键入的字符

• 系统为完成查询而建议的字符

• 建议的范围（如有）

建议2

就像其他两部分一样，您需要从视觉上区分这个范围和建议的其余部分。对于用户来说，重要的是要知道系统将在网站的女性部分搜索“篮球短裤”，而不仅仅是搜索关键词“篮球短裤中的女性”。在建议的查询下缩进范围或类别建议可以将其关系与查询进行通信。

一位用户在Amazon.com上搜索“水瓶”时提出了两个范围内的建议：在家里、厨房和户外娱乐。这些范围建议的文本以浅灰色显示，并缩进到建议的查询下。

通过在查询词下缩进作用范围别来显示其范围搜索建议。

这种方法很有效，因为这三个层次都是相互关联的。用户可以在三个稍有不同的选项中进行选择：

• 搜索 “water bottle” 没有明确分类

• 搜索 “water bottle” 在家庭&厨房分类领域

• 搜索 “water bottle”在室外娱乐分类领域

可考虑不仅仅是简单的查询建议

除了完成用户的查询，搜索建议下拉列表还可以包含指向其他类型相关内容的链接。例如，B&H照片视频使用一个巨大的全宽搜索建议下拉列表，提供查询建议，但也链接到：

• 分类页面

• 产品详情页

• 资源/文章

B&H照片视频在其非常大的搜索建议下拉列表中使用了各种丰富的内容。

考虑一下，这种复杂的搜索建议下拉列表是否会对您的用户有所帮助，或者是一种让人困惑的滥用。如果您决定采用这种方法，那么您的建议下拉列表应该组织得很好，并贴上标签。用户应该能够轻松地扫描和理解所有呈现的信息。

尤其是，在下拉列表中提供相关产品的链接对于那些知道自己在寻找什么的人来说是一个很好的捷径。然而，我们发现，我们研究的参与者很少从丰富的建议中选择特定的项目。相反，大多数用户更喜欢看到完整的结果列表，因为他们可以浏览和比较。

如果决定使用丰富的搜索建议，请使用自适应方法简化移动设备的功能。在较小的设备上，只需提供简单的文本搜索建议。

移动搜索建议

总结

在搜索建议中优先考虑浏览性和易处理性。请记住，他们的主要目的是让您的用户尽可能容易地表达他们的信息需求和看到有用的结果。

https://www.nngroup.com/articles/site-search-suggestions/