(翻译)悬停菜单弊大于利的原因

  你是否了解悬停菜单对用户导航的影响?悬停菜单属于常用导航方式,但是它的打开方式会产生设计人员意识不到的可用性问题。在确定使用悬停菜单导航前,应该了解它们如何影响用户。

悬停神话

  很多设计人员认为悬停打开的菜单更能让用户方便快捷地使用。这种想法咋看是对的,但深入思考之后,就会发现情况正好相反。鼠标悬停后打开的菜单省去了用户点击鼠标的操作,但点击操作很有必要,它用于确认用户确实想打开菜单。
  没有点击操作,用户鼠标划过导航区域时很容易意外打开菜单。这种意外行为会妨碍用户访问想要的内容,更有甚者,还会挡住用户想看的重要信息。
在这里插入图片描述
  悬停菜单不请自来,会让用户震惊甚至崩溃。强给的便利功能没有带来任何好处[1]。所谓的便利,与其说是一种好处,不如说是一种烦恼。悬停菜单还有其它很多让用户难以使用之处,它没有看起来那么好用。

强迫用户经过悬停通道

  悬停菜单最严重的问题之一是强迫用户使用鼠标经过悬停通道。悬停通道指用户移动鼠标点击菜单经过的路径。技术水平较低的老年用户往往很难做此操作。即使是技术水平较高的用户也会发现他们不得不在一条受限的路径上移动鼠标,十分烦人。
在这里插入图片描述
  悬停通道使用户导航变得艰难、缓慢。悬停菜单出现后,用户无法将鼠标直线移动到想要的菜单上面,如果这么做了,鼠标就会移出悬停通道,从而导致菜单关闭。
  用户必须移动鼠标经过悬停通道,否则菜单就会关闭。没有任何理由让用户这么难受地使用网站导航。
在这里插入图片描述

边缘位置菜单项难以点击

  鼠标移出菜单范围后,悬停菜单就会关闭。这种行为使接近菜单边缘位置的菜单项难以点击。点击边缘位置菜单项时,用户得缓慢移动鼠标才行。如果不这么做,鼠标很容易错过菜单项并移动到菜单范围之外,导致菜单关闭。
在这里插入图片描述
  有些悬停菜单在菜单周围添加了额外的填充,如果鼠标错过了边缘位置的菜单项,菜单也不会关闭[2]。但是额外的填充也不能完全解决该问题,许多用户还是会在不知不觉的将鼠标移出菜单范围。不应让用户使用特定的方式点击菜单项。
在这里插入图片描述

隐藏索引页

  很多网站都有索引页,用户可以概览网站内容,便于用户浏览。但如果用户找不到索引页,那它们也爱莫能助。索引页通常隐藏在用户鼠标悬停的类别名称中[3]。
  大部分用户不知道类别名称只是指向索引页,它看起来像是被选中一样。鼠标悬停时高亮显示让人搞不清楚类型名称只是个链接。上述问题会让新用户很受伤,他们需要概览网站导航层次结构。
在这里插入图片描述

菜单应当点击后再出现

  与鼠标悬停时出现菜单相比,鼠标点击后出现菜单可以解决上述所有问题。点击式菜单不再要求鼠标经过悬停通道,也不用担心点击不到边缘位置的菜单项,更不用怕找不到索引页。下面是几种方法可用于点击式菜单。

标准点击式菜单

  第一种方法是当用户点击主类别项时直接打开菜单,鼠标点击菜单范围之外时关闭菜单。不同于悬停菜单,点击式菜单允许用户随意移动鼠标。关闭菜单和打开菜单一样简单!
  点击式菜单将索引页链接放在菜单之内,持续可见的位置是将链接放在菜单项列表最后。本方法清楚明白地展示索引页地位置,不会让用户错过它们。[4]

在这里插入图片描述

大型折叠式菜单

  如果菜单中有特别多地菜单项,适合使用大型折叠式菜单。这种菜单不会遮挡页面内容,而是在菜单出现时将页面向下伸展,保持页面所有内容可见。用户可以随意移动鼠标,不会导致菜单关闭。
在这里插入图片描述

结语

  点击式菜单地好处大于悬停菜单。当使用悬停菜单时,设计人员需要知道它对用户的危害。 菜单应该在用户明确的决定使用菜单时出现,此明确的决定是以鼠标点击的形式作出的。 当站点按照用户希望的方式运行时,能使用户更方便快捷地完成任务。

原文地址:https://uxmovement.com/navigation/why-hover-menus-do-users-more-harm-than-good/

[1]原文:There’s no benefit to getting something you don’t want a click faster if you don’t want it.
[2]原文:Some menus add extra padding around the menu so if users miss the item, it’ll stay open.
[3]原文:Index pages often hide in the category name that users hover their mouse over.
[4]原文:Click menus force you to put the link to the index page inside the menu. A consistent and visible location is to place them at the end of the list. This approach makes it clear where all index pages are so users can’t miss them.

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值