桌面和大屏导航栏如何设计其实是一个经常被讨论的问题，现在这也是B端设计中绕不开的设计问题。JenniferRoseKingsburg曾经对网页的三级菜单导航进行过研究，得出的结论是将导航设置在左侧有很多好处。还有很多类似的研究，你可以在这里看到很多相关研究的总结。值得注意的是，这些研究大多是2017年之前的研究成果，现在很多设计范式都发生了变化。1、左侧导航更易浏览EyetracKING的研究表明，用户习惯于使用F风格的浏览路径，这使得左侧导航在正常情况下相对更好用，并且不需要用户在视线，因为用户下意识地意识到他们的存在。2.顶部导航更节省空间。如果我们经常使用笔记本电脑浏览页面，我们很容易注意到不同导航模块所占用的空间比例。左侧导航占用的页面控件通常是内容相同的顶部导航。占用了三倍的空间，因为垂直的侧边栏导航需要兼顾水平的头部空间，而随着搜索等功能模块的加入，这种空间占用成为了必然结果。即使左侧菜单栏是可折叠的，这种方法并不总是有效，因为这可能会隐藏相关项目的标签信息，降低导航的可用性。3.侧边导航更方便缩放和收藏。也是左侧导航本身的布局逻辑。它通常可以显示两倍于顶部导航的项目。如果你的信息架构本身涉及较多的一级菜单项时，使用左侧边栏导航显然是更合理的选择，而且这种导航非常适合随着时间的推移逐渐增加条目的需求。4、侧边导航支持自定义导航结构虽然侧边导航本身占用空间较大，但也有更多的空间可以根据需要自定义各种需求。与顶部导航相比，侧边导航甚至可以直接直接展示分层二级菜单，就像Outlook的侧边栏和Slack的侧边栏导航一样。5.侧边栏与桌面系统更加一致。你会注意到，在macOS和Windows操作系统中，系统默认的用户界面大多采用了灵活的侧边栏导航设计。许多Web应用程序也是如此，它们会将顶部空间留给系统默认的菜单模块。带有侧边栏导航的UI界面可以和操作系统的逻辑保持一致。6.最好悬停在顶部导航中激活子菜单。抽屉下拉菜单的设计在顶部导航中非常自然，但在侧边栏导航中，这种设计可能会受到一定程度的遮挡。下级菜单如果在其旁边展开可能会占用大量空间。总而言之，它更适合顶部导航的交互方式。7、顶部导航栏适用于超级菜单。正是因为顶部导航栏与悬停启动子菜单的功能配合得很好，所以很多电子商务公司和大型网站都会用它来呈现包含很多项目的超级菜单。这是一次容纳多个项目的子菜单的有效方式，布局也为产品展示和广告留出了足够的空间。8、重新设计时尽量避免更改导航模式。如果一种导航模式似乎不太好用，是否应该利用重新设计的机会切换到另一种模式？根据Jira的用户测试，95%的早期用户都会对这种情况感到很迷惑，导航功能哪怕是一个小小的修改都可能直接影响到大量用户的日常使用，所以无论选择哪种导航方式，都请尝试不要改变它。9.无论什么样的导航栏都面临着响应式设计的挑战。对于没有太多项目的顶部导航，在移动端还是可以直接在顶部呈现，但是如果太多，就需要使用汉堡菜单来承载，或者切换到垂直侧边栏导航。侧边栏导航在移动端相对好一些，因为导航模式本身是一致的，但是如何在有限的空间内呈现大量的导航项也存在挑战。结论：用哪个导航栏，看需求。顶部导航：占用空间小，在页面中最显眼，在涉及的项目不多时效果很好。对于层级结构简单的中小型网站来说，顶部导航还是很有用的。对于层级较少但二级入口较多的超级导航，顶部导航也是最佳选择。侧边导航：侧边导航支持一级入口多、层级多的导航需求，扩展性好。适用于复杂产品和定制化需求较多的产品，涉及管理功能，桌面级产品。侧面导航。
