从细节探索搜索功能的用户体验

对于大型电子商务网站来说,搜索是个举足轻重的辅助工具。通过深思熟虑的微文案和正确的语境化,可以极大地改善用户的体验。

很难通过只字片语来形容网络搜索的重要性,网络搜索本身与互联网一样历史悠久,从某些方面来说,甚至更加古老。精心设计的搜索对网站和用户都有好处:它会提升页面的转化率,降低了跳出率,并改善了用户体验。

搜索在大型网站和电子商务体验中尤为重要,其中大部分营收来自于搜索。研究表明,高达 50% 的用户直接进入站内搜索栏,而 15% 的用户更喜欢使用搜索功能来浏览层级菜单结构。也就是说,搜索功能对用户理清网站内容结构起到至关重要的作用,同样需要我们花费心思进行设计、探索。

但现实场景更加复杂,用户使用搜索功能的方式千奇百怪,具有不确定性,甚至可能搜索不出结果。而用户想从搜索引擎中获得预期的结果,通常需要多次尝试关键字,但这也考验着用户的耐心。随着时间推移,搜索技术也不断提升,用户得到的搜索结果越来越趋向于他们问题的答案,即使查询的结果并不是100%完全符合。喜欢使用搜索功能的用户往往对搜索结果一目十行,快速预览页面并寻找想要的内容,并在找不到所需内容时快速跳转。

如何与这些用户“快速”沟通是一项棘手的工作,需要一个专门的方式:微文案。“微文案”这个名称似乎掩盖了它自身的重要性。它可能很小,但却至关重要,甚至影响到整个格局的成败。这是一个可以展现、给人留下好印象、实用性和品牌传导的地方。基于这些,我们一起来深入探讨搜索体验中的微文案。

根据雅各布定律(Jakob’s Law),在设计搜索栏时的第一反应应该是在右上角或左上角放置一个矩形框。您应该添加一个标签或 A11y 友好的占位符文本,并包括一个显示“搜索”的提交按钮。

将搜索栏隐藏在链接后面、放弃占位符文本或选择放大镜图标 CTA 而不是纯文本都是正确上下文中的有效设计方案。只要确保没有非必要地抽象化搜索栏的功能,因为搜索已经比浏览具有更高的交互成本。

每一个看似多么无关紧要的细节障碍,都有可能对用户体验产生负面影响。如果你的用户可能会将放大镜图标与“缩放”按钮混淆,那么您应该尝试减轻这种风险。

占位符文本

占位符文本(placeholder)是增强体验的好地方。它可以是信息性的,也可以是品牌表达的地方,它可以将摇摆不定的用户推向正确的方向。每当我看到一个只显示“搜索”的搜索栏时,我都会看到错失的机会。

那么有什么更好的方法呢?它因站点而异。首先,熟悉您的业务目标、品牌和用户的现有习惯。然后,考虑如何成为最有帮助的人。

轻推用户

暗示性的方法可以减少用户的焦虑。让用户知道他们可以通过多种方式进行搜索,尤其是当他们可能不熟悉网站的全部产品或服务时。

例如:ASOS 建议在产品和品牌之外寻找灵感:

提供信息

准确地告诉用户他们在点击提交时会得到什么。

例如:在Shutterstock 上,致力于搜索大量照片档案的网站,这个占位符文本在与徽标配对时巧妙地兼作标语:

强化品牌

例如,Home Depot 的搜索栏不会引导用户,而是提供有用的个人语气,这完全符合他们的品牌语音指南。考虑到他们的产品目录的大小,这可能是最好的方式:

使用对你有利的搜索日志

如果您不确定优化占位符文本的最佳方式,则可以从搜索日志数据库开始。在制定有用的内容设计时,学习如何分解这些结果可能非常有价值。你将能够亲眼看到用户搜索网站的关键字词汇,更重要的是,你可以看到网站的内容与用户正在寻找的内容之间的差异。

在搜索过程中,你的文案应该提供尽可能多的帮助,而不是霸道。这包括从明显的“取消”或“清除”按钮到记录每个用户最近的搜索,以便稍后显示的所有内容。在选择合适的微文案来配合这些功能时,请稍加润色。

自动建议

使用搜索栏的用户之所以这样做,是因为他们正在寻找特定的东西,这使得自动建议成为一种有价值的(并且越来越受人期待的)工具。在这种情况下,搜索特征可能与“36码女士灰色鞋”一样精准,也可能与“我附近的三明治店”一样泛。

自动建议还可以降低返回不良结果的风险,减轻用户的心理负担,并提供一个展示最受欢迎的产品的机会。

通常这些根本不需要额外的上下文或副本,但可以在用户键入时在搜索栏下方列出,如上面的示例所示。

在结果页面上显示相关搜索是另一种帮助引导用户而不妨碍用户的方式。一种常见的模式是在结果上方提供一些与原始查询相关的可点击关键字。说明“其他用户搜索过”的小副本,这种方式也是将社交融入搜索体验的好方法。

最近的搜索

如果技术允许,保存和重新显示最近的搜索是有助于减轻用户输入负担的另一种方法。确保使用副本添加上下文,可以像这样简单:

处理结果

在显示搜索结果时,我认为需要两份副本:

  1. 查询体本身
    如果搜索栏高度可见,则可以在此处显示。你还可以创建一个声明“{{terms}} 的结果”的 H1。
  2. 查询结果的数量
    如果结果是分页的,你可能还包括页数。
没有结果

无论是不是因为自己的错误输入,用户在某些时候都不可避免地会遇到“没有结果”的页面。幸运的是,有一些方法可以优雅地处理这个问题。通过正确的方法,这条死胡同实际上可以成为发现内容的绝佳机会。

首先,不要指望你的用户在没有得到结果的情况下不断改进他们的搜索——至少在没有对应视觉辅助鼓励它的 情况下是不会的。用户不愿意重复尝试他们的查询。他们更有可能参照所提供的信息,并从那里获取信息,或者完全放弃。

所以,从上面的例子很容易看出一些文案和情境化是如何改善体验的。Nielsen Norman Group 有一份关于如何处理无结果 SERP的综合指南,其要点是:

  • 明确说明没有匹配的结果。
  • 提供改善搜索的方法,引导用户。
  • 不要嘲笑用户。

此外,请记住,可能会出现空的搜索提交,因为用户在没有输入任何查询的情况下错误地提交了。例如,你还应该为此方案制定内容计划,而不是返回数据库中的所有项目。

总结

良好的搜索体验归结为深思熟虑。作为设计师,我们可能已经使用并创建了数百种不同的网络搜索体验,因此我们可以轻而易举地完成整个过程,但是,当我们考虑流程的每一个小步骤时(也许是一个细微的交互或是一个边缘案例),要明白我们所做的微小更改可能会对体验产生重大影响。