网站搜索栏设计指南：要不要？怎么设计？

在网站的设计过程中，搜索栏是一个很容易被忽略的部分，但用户却依赖它来寻找特定的信息。由于搜索栏是网站中最常用的元素之一，所以搜索栏的设计对用户体验有着重要的影响。

网站是否需要搜索栏？

搜索栏使用背后的思维和心理是帮助用户快速找到信息。搜索栏对于内容复杂、超过100页的网站非常有用。在企业对消费者(B2C)领域，搜索栏用于大型电子商务网站、新闻网站、交易网站和预订网站，帮助用户轻松找到信息。它们也被用于大型B2B站点，这些站点有许多客户细分和产品线。
如果是一个只有很少页面的小站点，那么可能不需要一个搜索栏，但是随着站点的增长，那就将需要它。

创建搜索栏时要考虑的因素

搜索栏通常由两个UI元素组成：一个输入字段和一个按钮。然而，搜索栏的设计对用户在你的网站上找到他们想要的信息的速度有很大的影响。我们认为，设计搜索栏的时候需要考虑如下问题：
突出显示你的搜索栏：让网站搜索栏很容易发现，把它显示在你的网站显著位置。
避免将搜索框隐藏在下拉菜单中或隐藏在搜索图标后面(渐进式披露)，因为这会让用户很难找到它。此外，当你隐藏你的搜索栏时，你添加了一个额外的动作，用户必须在搜索你的网站之前采取。
搜索栏加入放大镜图标：图标作为一个动作或一个物体的心理捷径和视觉线索。对于搜索操作，放大镜是普遍接受的符号，使用它将使用户更容易识别你的搜索栏，即使没有文本标签。当选择一个放大图标，选择一个示意图图标，不是过度程式化，以增加识别的速度。使用大量的对比度和填充，以确保图标突出，并使其足够大。
遵循搜索按钮设计惯例：当为搜索栏创建一个搜索按钮时，要遵循好的按钮设计的惯例，确保它是正确的大小和足够的对比度，以使它突出。确保用户可以使用键盘上的"输入"功能提交他们的搜索查询。一些用户仍然使用enter来提交查询，而且它对于可访问性也很好。

使用占位符文本引导用户搜索：使用一个搜索查询示例作为占位符文本，引导用户在您的站点上进行搜索查询。这对网站搜索栏很有用，用户可以在搜索栏中搜索不同的条目。限制占位符文本的长度，以减少认知负荷，并确保有足够的对比度，使其易于阅读。

设计一个简单的搜索框：创建一个搜索框，看起来像一个搜索框，而且很容易使用。从一个简单的搜索开始，如果需要，给用户提供使用搜索过滤器或高级搜索机制的选项。
搜索栏放在合适的位置：网站用户使用F模式浏览网站，把你的搜索栏放在这个F模式中是很重要的，这样用户可以看到它。这是在顶部中心或右上方的网站。此外，用户实际上希望在页面顶部找到网站的搜索栏。不要把你的搜索栏埋在页脚，用户需要在那里寻找它。使用热图来找出你的网站上用户滚动和点击最多的区域(热点)，并将你的搜索栏放在那里。
搜索栏进行提示：当用户输入他们的搜索查询时，自动提示会引导用户避免在搜索查询公式中出现错误。确保自动建议是有益的，以避免混淆或分散用户的注意力。通过加粗显示用户输入的信息和自动提示之间的差异。
搜索栏放在每个页面上：在搜索栏设计中，让用户总是能够访问搜索框。