Godzilla. 2017-01-04
网站建设
怎么样设计网页的搜索框？
搜索框是网站上最重要的元素之一。无论您拥有什么类型的业务，设计精良的搜索框都是必不可少的，以便访问者可以轻松找到他们正在寻找的内容。 这并不意味着设计者只需添加一个搜索功能，而不考虑它的外观。您需要考虑功能，用户友好，美观，甚至搜索框的位置。这一切都是为了提高您网站上的用户体验，甚至可以提高转化次数。那么，在设计搜索框时你需要做什么？虽然根据您的需求和目标，确切的建议可能是主观的，但有一些一般的提示可以适用于不同类型的网站。怎么样设计网页的搜索框？以下是搜索框设计和展示位置的一些最佳做法：
1.使它突出
搜索框设计中的第一个也是最重要的规则是使其显而易见。你可能过于专注于设计美学，你创建一个搜索框，与网站的其余部分融合。但重要的是要记住，您要为想在您的网站上找到某些内容的用户添加一个搜索框。让他们寻找搜索框的位置不会有任何意义，甚至可能对他们的体验产生负面影响。
这并不意味着你必须在美学上妥协。设计一个搜索框，需要让它看起来美观同时仍然突出，足以让人们注意到。因此，框的大小应该很大，但不能太大，因为它占用了页面上太多的空间。颜色应该是对比的，但仍然与页面上使用的其余颜色互补。
下方例子是一个很好的例子，因为白色与页面的蓝色对比，同时仍然与页面设计中使用的其他颜色对齐。搜索框的大小不会太大，但仍然足够突出，以便人们在进入网页后立即注意到。
2.突出显示提交按钮
如前所述，搜索框的整体目的是使网站访问者更容易地搜索。避免过度复杂的事情与微小的提交按钮，用户必须专注于点击。使提交按钮脱颖而出提高了搜索框本身的可见性，也使用户更容易点击。无论您选择使用放大镜图标还是在提交按钮中拼出“提交”，都是由您决定的。但是，重点放在按钮的大小和颜色，以确保用户在搜索字段中输入后没有问题。一些网站用到放大镜图标为游客搜索的东西，这可能被证明对于网站美学有很大的好处，如在Levi's Strauss的情况。但这不是一个最佳的搜索框设计示例。
3.将它放在用户最习惯的位置
有一个关于在网站上放置搜索框的最佳地方的争论。但是，如果你看看一些最热门的网站，你会注意到，搜索框通常放置在页面的顶部中心或右上角。这从SLI系统公布的研究中是显而易见的。分析发现，54％的零售商将搜索框放在右上角，30％在中心，只有16％在左边。
这意味着访问者可能希望在网站右上角找到搜索框。将它放在意想不到的地方意味着用户可能需要投入额外的时间来找到搜索框。尽管如此，仍然是一个好主意，使用热图或眼睛跟踪工具研究访问者活动。这将帮助您确定他们最有可能看到的位置，帮助您了解应该搜索框放置的位置。
无论你选择左，右还是中心;确保它是朝向页面的顶部，因为这是访问者更可能扫描的位置。你会好的进行A / B测试不同的搜索框布局，然后确定这个位置似乎是为你执行最好的。
4.将自动完成与图形组合
您的网站可能是搜索框中使用自动完成功能的62.5％之一。为了获得竞争优势，您可以通过在搜索功能中添加产品的图片预览和自动完成建议来进一步增强功能。这是因为只有28.2％的参与网站目前正在实施此功能。
5.避免隔离或过度拥挤
第一点提到了使搜索框突出的重要性。这意味着您应避免使用图标或其他可能会使访问者从搜索框分散注意力的元素来过度拥挤周围区域。搜索框需要确定优先级和重点。同时，避免过度使用搜索框，因为您可能最终将搜索框隔离到难以找到的程度。
如下图所示，是一个精心设计的搜索框的一个很好的例子，没有太多的元素拥挤它放置的区域。但你仍然可以看到它的页面左侧中心，而不是放置在某个地方，用户将很难找到。提交按钮也与网站上的其他颜色形成对比，使其脱颖而出。
6.选择扩展搜索框
当您在寻找节省空间的方法，同时仍然为用户显示搜索框时，您可以选择不断增长的搜索框。这是一个理想的选择，网站的搜索可能不是太重要，但你仍然想给用户选择搜索的东西。而不是只添加一个放大镜图标，你会添加一个小搜索框旁边作为一个视觉线索的网站访问者。当用户单击字段时，该框将展开，并使用户能够输入他们需要的字词。如果你有更多关于网站建设（定制网站、模板网站）、广告设计包年服务(经济套餐)、网站优化、logo设计、品牌设计、印刷、APP/微信开发等产品服务的需求，欢迎咨询摩恩网络官网，新上线企业VI设计套餐和网站营销推广系统（强）！
7.考虑添加一个下拉菜单
在搜索框旁边添加一个下拉功能对于某些网站可能是一个好主意。它给用户一种方向感，并给他们关于寻找什么的线索。这一策略证明对巴西房地产公司Casa Mineira的成功。网站上进行的案例研究中，将标准搜索框替换为下拉菜单有助于生成更多潜在客户。事实上，变化导致比以前多57.25％的潜在客户。
现在，您可以借助示例和提示更好地了解搜索框设计和布局。那么你从这学到了什么？您可能已经注意到对搜索框的突出和可见性的压力。这意味着搜索框的颜色对比，美观和尺寸是一些最重要的方面。你的焦点应该让功能与美学结合，这可能不容易执行。有关于搜索框设计的任何问题？ 请随时留下评论。
下一篇：5个改进网站制作 设计的方法
上一篇：黄浦区网站建设人员分享建网站的不同阶段
文章标签：
搜索框
浏览次数： 2043 次
文章评论：