企业网站大型网站建设时菜单怎样设计更合理用户体验更好

我们都在网上看过大型导航和全屏下拉菜单。它们在网络上很常见,尤其适用于有大量链接的网站。 但设计一个有效的巨型导航可能是一个真正的痛苦。这些菜单没有严格的指导原则,因此您必须研究其他人正在做的事情并尝试制作适合您项目的内容。 深层次类别 大型导航设备最有价值的设计风格是  柱结构。 这使您可以为链接指定“类别”并创建更深层次的链接,而无需使用多个弹出菜单。大型导航下拉列表可以跨越整个页面,因此您通常可以在一个下拉列表中至少容纳3-4列。 看看  
Wayfair  ,它使用了一种非常独特的下拉菜单。他们有一个“部门”的链接,你可以按类别浏览甚至子类别,如卧室>床头柜。 此链接旁边是“房间创意”的下拉列表,您可以根据房间进行浏览。此下拉列表包含链接旁边的图像,因此您可以更轻松地浏览选项。 没过多久就意识到他们将导航项目分类。这些趋势遵循类似的趋势,Wayfair的人员导航只需要  两个主要链接即可  实现! 另外,另一家电子商务商店  
Puma  也有类似的柱状结构。 但是他们根据人口统计和项目细分类别,然后在每个meganav中找到每种项目类型的列(特色产品,服装,运动等)。 请注意,列具有自己的标题,这些标题从其余链接中脱颖而出。它创建了一个真正的列结构,因为您可以先浏览列标题并从那里浏览子链接。 对
Lucky Brand  有类似的影响,但在设计上  
有所改变。 它们的所有列都具有相同的颜色方案,但它们使用不同的排版。这可以使快速浏览变得更加困难,但它仍然可以使用。 Lucky的动画效果也很不错,所以这绝对值得考虑。 但是,如果您正在努力使用大型导航层次结构,请先尝试将链接组织到更深层次的类别中。 全宽下拉列表 这种趋势并没有在每个网站上使用,但我现在确实看到了很多。 巨大的大型导航菜单可以跨越页面的整个宽度,为桌面和笔记本电脑用户创造更多空间。移动用户通常拥有  
隐藏的菜单,  因此他们从未真正看到完整的效果。
Pluralsight的导航   是一个很好的例子,具有全屏超级菜单。内容保持固定在与页面本身相同的宽度,但菜单确实跨越整个屏幕。 这是一个很酷的效果,因为它在菜单中创造了更多的空间。或者它至少给出了更多空间的视觉错觉。 如果你正在为更大的显示器运行一个巨大的导航,为什么不去全程?
Digital Spy  有一些非常相似的东西,他们的导航也包括类别中断。 “正常”下拉链接和缩略图链接之间存在均匀分布,直接指向文章。 但是,当菜单跨越整个屏幕时,内容仍然固定在与页面相同的宽度。 如果你能让它发挥作用,效果会非常好。 您甚至可以将列结构和全屏效果组合到一个设计中。 这就是你在
OARS网站上看到的内容   ,它是伟大设计+出色用户体验的华丽典范。 混合图像和文本 我鼓励尽可能为所有网站添加更多图片。视觉效果有助于打破我们定期看到的所有文本。 超大导航菜单在大屏幕上效果最佳,因此可以安全地说有图像空间。在  
西尔斯网站 打破了他们的资产净值为多类别,有两个链接和图片。 一些顶级类别有厨房用具,床垫和家具的图像。但更深层次的类别包括与餐具和餐具等东西的直接链接。 请记住,你可以使一个巨大的导航很高,仍然使它可用。所以 几乎所有导航都有一排图像  和一排文本链接的空间。 但你也可以选择较小菜单的路线,就像
PlayStation的下拉菜单一样  。 他们的导航还包括图像与文本的良好混合,其中许多是单个页面的标签。 如果您有时间设计自定义图标,可以尝试使用自己的网站。在每个主要链接旁边添加一个图标,以便您拥有视觉效果和导航文本。 替代下拉技术 愿意尝试你的大型导航。对此没有严格的规定,而且很好的用户体验来自测试,看看哪些有用。 有些网站真正突破了下拉菜单的界限,包括自定义动画,多列,甚至是大型导航中出现的弹出式菜单。如果菜单可用且有效,那么这项工作做得很好。 但是如果你愿意尝试的话,你总是可以进一步推动。
Open  有一个典型的巨型导航菜单,在悬停时会扩展。但它使用了一种替代技术,可以  推下整个页面  ,为新菜单腾出空间。 大多数超级导航都显示在页面顶部,但是这一个会在将所有页面内容降低时动画下来。 对于每个网站来说当然不是一个完美的主意,但它是独一无二的。如果它适用于The Open的网站,那么它可以为其他人工作。 只是取决于你是否想尝试一下,并且可能 会对可用性进行一些  
A / B测试。 另一个示例是在  
Waterworks网站  上,除非您单击,否则不会显示下拉列表。 这些外观和感觉就像传统的大型导航菜单一样。但是他们通过定位不同的用户事件(点击)来偏离规范(悬停)。 它在角落里有一个小的“关闭”按钮,所以有一个简单的方法来关闭它。但这可能对每个站点都不起作用,对于非常高的下拉站点来说它最有价值。 随着您在自己的项目中推进大型导航创意,请牢记所有这些趋势。 大型导航菜单不断推进新的设计风格和技术。学习其他示例非常适合入门,但我们真的想出自己的想法,进一步推动您的菜单。

友情提示:点赞熊源码网http://www.dianzanxiong.com点赞熊源码网 » 企业网站大型网站建设时菜单怎样设计更合理用户体验更好
分享到:
赞(0)
广告位820*80