导航并不是您首先要考虑的网站设计要素之一。（尽管您可能应该这样做。）用户将如何在设计中移动？他们将如何找到对他们不明显的元素？
网站导航趋势已经发生了很大变化；从压倒性的大型菜单转移到更轻巧的最小选项。这种想法有一定的价值-太多的选择会使用户不知所措。在他们需要的空间中提供他们所需的信息，以增加参与度。不要向他们扔厨房水槽！
今天，我们将介绍一些现代的网站导航提示和想法，以帮助您做到这一点。
1.微妙的动画
乍一看，您甚至可能看不到网站顶部的Buttermilk和Maple导航菜单。但是有很多小动画可以确保您不会完全错过它。
- 当鼠标悬停在屏幕顶部时，会有一个深色的覆盖层掉落。
- 屏幕右侧塞有一个时间轴滚动条，滚动时带有弹出窗口。
- 导航滚动时会滚动到带有徽标的家庭徽标（带有汉堡包）中，然后在悬停时弹出回到完整的导航。（我喜欢您实际上不必单击汉堡包图标即可返回菜单。）
每个元素都包含简单的动画，该动画可增强导航功能，使您永远不会迷失在设计中。这种设计具有很高的视觉效果，这些简单的提示是增强可用性的主要好处。
2.提供大量线索
隐藏导航时-正如许多网站设计的趋势那样-您需要向用户提供大量提示。
- Rally网站滚动条上的时间线样式导航可帮助用户了解他们在内容流中的位置（提示1）。
- 右箭头告诉用户可以通过水平单击来探索一些内容。
- 汉堡菜单告诉用户，如果他们没有立即找到解决方案，则可以找到更多信息。
3.使其成为唯一选择
网站建设
如果导航是屏幕上最重要的元素怎么办？使它成为视觉设计的重点。
JYBH具有精美的最小设计，在背景中带有纹理动画，并在屏幕中间提供三个简单的导航选项。这可以准确地告诉用户下一步要做的事情。
4.这个或那个
沿着同一思路，正在创建一个设计，要求用户做出选择：您要这样做还是那样？这个二进制导航选项应该可以帮助人们快速准确地将自己想放在的位置。
如果设计有两个具有不同用户路径的目标受众，则效果会特别好。
Seedlip饮料通过购买其产品或使用其产品的选择相当有效地做到了这一点。这是零售的聪明方法。
该设计还包含一个微妙的汉堡图标- 既然趋势已经从两行而不是三行转移了，我们可以继续称呼它吗？–附加信息。
5.简单而传统
网站建设
有时，趋势的最佳用途是坚持使用有效的经典示例。一个简单的传统导航菜单永远不会过时。
周文忠的方法为全屏照片上的主导航提供了一个静态位置，而不会造成阻碍。一些菜单元素包括带有其他信息的“巨型风格”卡。（这些似乎几乎成为障碍。）
6.超大弹出窗口
移动设计实践也主导了许多桌面版本。超大弹出菜单（几乎总是来自汉堡包样式的图标）模仿了较小设备上的体验。
这种方法没有错。（我不会为任何人提供一致的用户体验而对它进行指责。
进行这项工作的关键要素是确保弹出窗口很明显，包括所有必需的信息，并且可用性没有问题（一切都易于单击或点击）。
7.尝试四个角
网站建设
这是仅适用于特定用例的导航思路之一-您需要四个主要位置将用户发送到。
但是，如果您这样做了，那么在屏幕的每个角都可以使用一个导航元素来代替规划和设计现代导航样式，这是一种有趣而有趣的选择。
由于简单的整体外观和易于理解的导航选项（公司名称，公司名称，工作和联系方式），因此它在上述设计中的效果非常好。（毫无疑问，您将从这些点击元素中得到什么。）
8.垂直堆叠
垂直导航菜单看起来像一个想法，当显示器不断扩大时，它真的会起飞。尽管还有更多的设计再次开始体现这种设计趋势，但它并没有达到目标。
TMC在屏幕的左侧使用垂直的主导航（这是一个不错的选择，因为人们从左到右阅读）是使用主要内容区域，然后使用剪切的内容区域，提示用户在设计中水平移动。
设计的其余部分使用时间轴点和箭头来引导用户浏览内容。这是一个有趣的设计。唯一的缺点是，如果您对它的了解太深，那就没有回头路了。
9.“皮包骨头”
时不时地，您会遇到成对运作的异常要素。上面的“瘦身”导航菜单就是这种情况。
前三个导航元素堆叠在屏幕的右侧。它们采用时间轴样式格式，随着滚动或单击而变化。
汉堡图标实际上位于右下角，并在屏幕底部打开至完整的导航菜单。这是我所见过的最不常见的向下导航页面之一，但它似乎可以正常工作。（也许是因为有很多视觉提示，从颜色和元素可以带您从左到右，再到角落的那个汉堡包。）
10. Downpage Nav
既然我们有了下页导航的想法，那么最好考虑一种高度可用的方法来实现这一概念。
续订在网站上有四件事要深入。每个页面都在首页的左下角注明。这种导航方式的优点在于，它根本没有隐藏，不会妨碍上面的内容，并且位于自然的位置以供单击。
它也用作准时间线元素，因为导航是一个更大滑块的一部分，该滑块可帮助用户介绍所有四个内容路径。
结论
在考虑现代导航时，请记住，它不仅仅是菜单。导航是用户轻松在设计中移动所需的一切。
它可能以某种类型的主导航菜单开始，但可以包括时间线和滚动提醒以及任何其他可以帮助用户找到所需内容的内容。
原创文章，作者：ItWorker，如若转载，请注明出处：https://blog.ytso.com/258828.html