把搜索放在人们期望的地方
建立良好搜索体验的第一步是确保人们能够找到它。根据Neilsen-Norman的研究，人们倾向于在网页的右上角寻找搜索 - 正好在你的主要导航元素通常去的地方。
将搜索放在您期望的位置。
对于绝大多数网站来说，坚持这个经验法则应该可以解决问题。如果您正在构建一个更倾向于解决问题的网站 - 例如帮助中心，维基，词汇表或知识库 - 那么更加突出的位置会让您更好。
如果您在确定使用搜索栏的方式时遇到任何问题，请考虑以下经验法则：
搜索是为了解他们正在寻找什么的人。
如果您的网站更倾向于发现和探索，或者有一个更集中的目标，如驾驶注册，右上角就可以了。否则，将其放在前面和中心位置，以支持基于任务的集中解决问题。
配对放大镜图标和文本提示
正如我们在“ 网页设计中图标的优缺点 ”中所讨论的那样，通常最好不要依赖图标来向用户传达意义。对搜索使用的研究倾向于支持这一点 - 虽然放大镜图标已成为搜索功能的近乎通用的标志，但仅图标搜索设计仍然会减慢任务完成速度。
加入少许文字您的搜索启示的便利好处是，你可以用文字来引导有关访问者什么，他们可以搜索您的网站。
IMDb的搜索表单将一个仅带图标的按钮与占位符文本配对，指导您的搜索，同时肯定是，这实际上是一个搜索栏，并告诉您要查找的内容。
鉴于搜索的显着位置，这个占位符副本提供了几乎类似于标语的功能。它不仅告诉您在IMDb上可以找到什么，而且确实是整个网站的内容。
为输入框选择合理的大小
一般来说，您希望自己的搜索框足够大，以包含针对您的内容的平均查询。毕竟，输入你看不到的东西很难。
如果您的空间不足或想要最小化盒子默认状态的大小，您可以设置交互以在访问者点击它时展开该框。
点击触发搜索并返回/输入
虽然我们大多数受过Google培训的人都会在我们完成打字时点击返回/输入，但提供高度可见的可用性很少会很痛，就像提供点击搜索的按钮一样。与数字设计中的情况一样，最好是为每个功能都支持新手和“专业”用户！
将搜索放在移动设备前面和中心
网页搜索框怎么设计
Shopify的帮助中心在移动设备上提供搜索优质房地产。
当导航网站信息架构的想法听起来充其量时，搜索真的是最强大的。移动设备通常就是这种情况！
因此，不要让访问者遍历您隐藏的菜单并冒险一遍又一遍地翻阅错误的链接，而是通过在移动视图上突出显示您的搜索表单来帮助人们更快地到达目的地。
永远不要单靠搜索
尽管它的强大和轻松，但在您的网站上搜索并不能免除您拥有合理，立即可见的网站结构。
如上所述，搜索最适合那些知道他们正在寻找什么的人。清晰，清晰的导航功能可以帮助那些正在探索的人，如果设计得很好，通常可以帮助人们比搜索更快地到达他们想要的地方。
学习flexbox的有趣方式......
掌握Flexbox的基础知识，在28个越来越具有挑战性和乐趣的层面，无需编写一行代码。
设计搜索引擎结果页面（SERP）
当然，如果结果体验对搜索者没有帮助和明确，那么美妙的搜索体验并不意味着什么。值得庆幸的是，这些提示将帮助您完善网站的搜索用户体验。
在结果页面上添加搜索栏
搜索通常不会在第一次尝试后结束。无论结果是否不符合搜索者的需求，或者搜索者只是决定寻找其他东西，不要强迫他们回溯是有道理的。
通过在结果页面上放置一个搜索栏 - 默认情况下Webflow会执行此操作 - 您可以轻松（并且不那么令人沮丧）让搜索者再次使用它。如果他们正在寻找有关多个主题的信息，他们可以轻松打开结果，然后在新选项卡中生成结果，而无需离开SERP。
如果一些文本可以传达大量所需信息，请使用以文本为中心的列表（如果有用则添加图像 ）
