网站的搜索框设计

在内容为主的网站中，搜索框往往是最常用的设计元素之一。从可用性的角度来看，搜索功能是用户有了明确的内容想看的时候最后使用的功能。如果一个网站没有足够合理的信息架构体系，那么搜索引擎不仅仅是有帮助性的，甚至是至关重要的设计功能。有可能比网站的导航更对用户有帮助。事实上，搜索是用户了解在一些综合性网站内容最直接有效的方式。最好的设计就是给用户提供一个简简单单的搜索框在页面显眼固定的位置上，但却有强力搜索的能力和范围宽广的功能。

在现实中，网站往往会随着时间的推移，新的内容不断的增递，而且这些新内容会更加重要，那么他对你之前设计的信息架构会有一定挑战，可能新的内容不一定适合整个信息架构，这个时候会和你的当时精心设计架构是有违背的。那么你的内容会打散在各个地方，每块内容都会看上去比较特别，感觉不是在网站架构中的一样。

当内容被分散四处，没有内容组织的时候，用户就更加困难找到他说需要的信息了。用户的可用性降低了，没有他所需信息的时候，用户会选择离开网站，或去Google去试试运气。这个时候还有唯一的希望那就是：一个搜索框。

虽然搜索的背后需要很高深厉害的程序算法，但不要忽视了前台的UI设计，我想可以看看更多现有网站的搜索框的设计。

什么时候需要搜索？ 并非每一个网站都需要搜索功能的，但随之网站越来越多内容，它是满足用户以最快速度获得所需信息的最有效的方法。如果网站导航非常简单直观，没有内容能逃出网站的导航的话，那么搜索对于这样的网站没有太大作用。 搜索应该是一种预防性的功能，因为当导航系统十分庞大复杂的时候，搜索是能力立即去解决麻烦的方法。它可以培养用户要如何使用网络获得他们想要的信息。

因此，如果网站够大，或者网站会逐渐庞大的网站，早点考虑优化自己的搜索引擎，那么您的用户会感谢你滴。

搜索框=输入框+提交按钮 在设计中的搜索框变得很重要。输入框必须清晰可见，很容易辨认和使用。有人可能会认为，在搜索框并不需要什么设计。看上去，这只有两个简单的要素：输入框和提交按钮。任何设计都不平凡。设计是很多要考虑的，比如：输入框的长度取舍，输入文字显示的设计。有些设计师就连提交按钮都没有设计上去。

事实上，设计的搜寻框是一个大问题。因为当用户有需求找某些信息的时候，搜索是最有效果的功能。那么搜索框的位置很重要，还有输入框应该让用户感觉可以输入，搜索按钮看上去应该更像是个按钮。

看看TechCrunch的设计，输入框和提交按钮，在配色方案完全符合网站的整体视觉风格。然而，它导致了一个问题：乍看之下，这真的很难看到的搜索框。用户可以搜索它，因为它不站出来是不容易发现。虽然位置的搜索框不错，很容易忽视，但这是不是一件好事。

搜索框容易犯的错误 在设计的时候我发现了几个问题： 1. 把搜索框放到页面底部，或隐藏在导航菜单中。 2. 将输入框设计比较短，暗示让用户使用短词来查询。 3. 提交按钮设计的比较小，迫使用户必须让鼠标指向非常精准。 4. 搜索框比较难让用户发现。 5. 搜索框的形式和其他功能形式一样的设计，比如联系人中的设计。 6. 在全设计中的页面（推广宣传），搜索框被设计的很难发现。 7. 提供功能过于强大的搜索，当用户是需要简单。 8. 提交按钮的名字随意的乱叫。 9. 并非搜索的功能，当看上去很像搜索框。 10. 提供多个提交按钮。

Wikipedia的搜索框就没有很直观的体现搜索。用户点击“Go”和“Search”有什么区别？功能上有什么不同？能不能在设计上让他们不太一样么。 设计体贴的搜索框

让我们来看看一些经常反复出现的困难和问题，设计师可能会在设计搜索框时所顾虑的。

搜索框放在什么位置？ 有比较多的可能性，但只有少许是正确的设计。最方便的地方是网站顶部左上角或右上角。这两个位置比较让用户发现。因为用户最常见的F-型眼扫描模式。很多的博客往往将搜索框放在网站底部，看上去这个不是个好主意，但可能处于广告等的考虑吧。

如何命名提交按钮？ 让提交按钮根据使用场景和用户情感化的设计来命名，是一个不错的主意。如：查找、查询、搜索或者一个ICON来表示。

这样的搜索按钮图片是非常让用户困惑的。

如何让用户如何搜索？ 一个很好的想法就是把提示的文字放在输入框内，当鼠标点击输入框时提示消失。这样能明确告知该怎么利用搜索框。虽然它需要用小小段JavaScript来实现。 许多网站开始使用Google提供的一些搜索服务，但是可能用户不太喜欢这样的搜索结果，而且Google的算法也不太适合某些公司的网站需求。当不可否认Google的出现打破了一些规则

本文来源于成都网站建设公司与成都网站设计制作公司-创新互联成都公司！

网站栏目：网站的搜索框设计
标题来源：https://www.cdcxhl.com/news12/314462.html

成都网站建设公司_创新互联，为您提供网站收录、网站排名、云服务器、网页设计公司、企业网站制作、品牌网站建设

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联