各类三级导航的效率对比
三级菜单最快的导航布局
• 2020 年 7 月 8 日
当用户浏览界面时,他们需要速度。他们找到所需内容的速度越快,在任务上节省的时间就越多。
需要速度的常见导航模式是三级菜单。您经常会在仪表板界面和桌面应用程序中找到它。提高三级菜单导航速度的方法是使用最佳布局。
一项研究(网页设计的三级菜单导航结构的比较)揭示了哪种布局导航速度最快。他们根据几个标准类别评估了各种三级菜单布局。
导航布局包括上-上-上、上-左-左、上-上-左、上-左-上、左-左-左、左-上-上、左-左-上和左-上-左边。级别符号按优先级和层次结构排序(即,主要[1]-次要[2]-第三[3])。标准类别包括导航时间、用户犹豫、光标移动、选择错误和用户偏好。
导航时间
研究发现,左侧主要导航比顶部主要导航更快。此效果也适用于左侧二级菜单级别。研究还发现,当一级与二级和三级分开时,导航速度会更快。总体而言,left-top-top 和 top-left-left 速度最快,top-top-top 和 top-top-left 最慢。
用户犹豫
犹豫是指用户犹豫是否要将光标从一个菜单级别移动到另一级别。在所有布局中,左上上的犹豫最少,而左上上的犹豫最多。当第二级和第三级处于同一平面时,犹豫的情况显着减少。
光标移动
光标移动到不正确平面的频率代表光标移动。当主菜单位于左侧时,光标移动较少。当辅助级别与主级别分离时,光标移动也会减少。当二级和三级菜单位于不同平面上时,会发生许多光标移动。但当他们在同一架飞机上时,用户的表现会更好。
Left-left-left 和 top-top-top 的光标移动最少,而 top-top-left 和 top-left-top 的光标移动最多。这种效果是有道理的,因为当所有菜单级别都在同一平面上时,用户很难将光标移动到错误的平面。
选择错误
点击次数过多表示选择错误。当主要级别位于左侧平面时,发生的选择错误最少。与顶部初级相比,左侧初级可减少 80% 的选择错误。
当初级和次级都位于顶平面时,会发生大量选择错误。顶顶顶和顶顶左表现最差。当二级和三级与一级位于不同的平面上时,发生的选择错误会较少。左上左和左左左表现最好。
用户偏好
大多数用户更喜欢使用左侧初级而不是顶部初级。左上上和左左左是最优选的。人们强烈倾向于将小学和中学、中学和大学进行分组。左上-上和左-上-左是最不受欢迎的。这种效果意味着用户不喜欢在平面之间来回跳跃。
最佳与最差整体表现
根据每个布局在所有标准类别中的表现,对每个布局进行总体评分。性能最佳的导航布局是左上上,其次是左左左。表现最差的两个是左上上和左上上。在最好的两个中,left-top-top 比 left-left-left 快大约 17 秒。
Left-left-left 比 left-top-top 慢,因为当所有菜单都在左侧时,它需要用户滚动项目列表。随着级别的扩展和深入,用户必须滚动更多内容,并且无法再在单个屏幕上查看所有主要项目。然而,左左左的好处是用户可以在每次屏幕视图中消耗更多内容。用户在内容屏幕上花费的时间更少,但这是在菜单上花费更多时间的权衡。
左上上的屏幕视图优势允许用户一次查看更多主要项目,无论他们导航的深度如何。然而,由于顶部导航栏,他们在每个屏幕上看到的内容较少。因此,用户体验到的菜单滚动较少,但内容滚动较多。
作者推荐
无论您选择哪种导航布局,左-左-左和左-上-上都是赢家。屏幕视图和滚动之间存在取舍,因此评估什么对您的用户体验更重要非常重要。
如果您的用户经常在不同的主要类别之间导航,请使用左上上以最小化菜单滚动并最大化菜单查看。如果您的界面显示大量具有大而重视觉效果的内容(例如照片、视频、图形),请使用左-左-左以最小化内容滚动并最大化屏幕视图。
您可以增加左上上的内容屏幕视图,并且仍然可以获得更少的菜单滚动的好处。当用户向下滚动屏幕时,通过暂时隐藏顶部导航栏,他们可以获得完整的内容视图。当他们向上滚动时,该栏将重新出现。假设用户在向下滚动时正在查看内容。当他们向上滚动时,他们更有可能进行导航。
在我看来,左上上是获胜的导航布局。它不仅比左左左快几秒钟,而且允许用户识别他们所在的主要类别。当您在左侧边栏中展开多个菜单级别时,需要花费更多的精力来识别您所在的级别。由于第二项和第三项非常接近,因此也更容易混淆。
从左上到上的布局使扫描主要类别变得容易。它将二级和三级类别与一级类别区分开来,并将它们放置在不同的垂直层次上。因此,用户在水平扫描时不太可能混淆第二项和第三项。
当然,左上上并不是每个用例和界面上下文的最佳选择,因为每个规则都有例外。但总体而言,它的性能似乎优于所有其他三级菜单。
用户体验设计的影响
这项研究具有三个重要的设计意义,将极大地优化三级菜单的导航速度。
1:主菜单应该位于左侧而不是顶部。 (节省约 17 秒)
这个结论是有道理的,因为以列列表的形式组织菜单项使它们更容易浏览。当项目位于列而不是行中时,用户可以在单个视图中看到一组项目。使用顶部主选项时,用户在扫描行时只能单独查看项目。
2:主菜单应与二级菜单和三级菜单位于不同的平面上。 (节省约 23 秒)
这个结论是有道理的,因为主菜单是父类别,其优先级高于子类别。当二级和三级与一级分开时,可以清楚地区分层次结构并防止同一平面上的视觉混乱。
3:二级菜单和三级菜单应在同一平面上。 (节省约 9 秒)
这个结论是有道理的,因为二级和三级都是父类别的子类别,使它们更加相关。将它们放在同一平面上可以使从一个子项导航到另一个子项更加直观且更容易遵循。
如果您正在为桌面应用程序设计三级菜单,请记住这些用户体验见解。它们尤其适用于效率至关重要的仪表板界面。如果您当前有一个使用缓慢导航布局的三级菜单,请考虑重新设计它。快速的导航布局将为您的用户提供完成任务所需的速度,让他们更加满意。
 
 
2024-05-11
浏览33
交互理论
登录后评论
评论
分享