网页导航设计如何选择


[日期:2020-09-16 17:40]   来源:    阅读:

网页导航功能对于提高用户体验还是有很大的帮助作用的,而今天我们就通过案例分析来了解一下,网页导航设计如何选择。

网页导航设计如何选择

1、主导航中有几个选项?

在选择导航时回答这个问题很重要。这里介绍一个有趣的的交互概念叫做视觉固定(VisualFixation):注意力一直保持在同一个地方。

在顶部导航中,一个视觉固定点通常只适合一个选项。然而,侧边导航上的单一视觉固定点可以同时容纳两个选项。

结果很明确。与顶部导航相比,用户在一次视觉观察中可以在侧边导航上查看和感知更多菜单选项。当然顶部导航也有自己的优势,为每个菜单项赋予各自的权重,而不是让它们的重要性被其他选项分散。

对于具有过滤选项或带有二级菜单的电商网站,视觉固定的概念起到了非常重要的作用。因为在这些情况下,我们希望用户能够在单一的视觉点上尽可能多的选择。

Tips:这里的选择仅仅取决于界面上有多少选项。如果主导航的菜单项不多于5个,只需使用顶部导航,这样能够更好地控制用户在整个平台上的体验旅程。

2、主导航与选项优先级的关系?

用户在浏览网页或App时会有各种各样的浏览顺序,其中一种就是“F型模式”。

F型布局的特点是将注视力集中在页面的顶部和左侧:

用户先以水平移动的方式浏览内容区域,这个动线构成了F型布局的顶栏;

接下来用户扫描页面左侧的垂直线,进行二次水平移动浏览。随着路径越来越长,阅读覆盖的区域一次比一次短,构成了F型布局下面的部分;

后用户以垂直移动的方式浏览整个页面的内容。

这种模式的含义是同一页面上的一行文本比后几行文本受到更多的关注;每行文本左边的几个字比后面的文字接受度更多。

因此,在顶部导航中左边的选项比其他选项具有更多的视觉权重,因为它位于主要视觉区域,优先级更高。

侧边导航采用了垂直移动,这是用户浏览网页的一个自然方向,但是选项优先级的排序是个限制。当选项的优先级相同时,可以使用侧边导航,这样用户就可以完整浏览列表并确定对他们重要的内容。

3、是否考虑使用二级导航?

如果是的话,可以考虑利用以下两种设计样式:

水平导航——在页面顶部设置一个主导航,在主导航下面设置二级导航进一步来区分内容。

侧边栏——在顶部设置一个主导航,然后在侧边设置一个侧边栏菜单来处理其他内容。

4、总结

顶部导航和侧边导航之间的选择实际上取决于以上三个基本的问题。

另外由于现在的设备有了更大的屏幕尺寸,如今许多设计趋势已转向侧边导航,因为它看起来更干净并优化了更多的屏幕空间。

后将导航的选择归结为两点:

主导航包含的选项数量;

是希望用户根据优先级浏览项目,还是希望用户可视化地浏览并根据其偏好选择项目。

【免责声明】:本内容转载于网络,转载目的在于传递信息。文章内容为作者个人意见,本平台对文中陈述、观点保持中立,不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。更多内容请在707945861群中学习了解。


友情链接: