carousel不仅是指机场或游乐场中的设备,它还代表网站中的轮播功能。设计人员使用轮播功能展示可视化内容,便于用户快速浏览。设计人员经常使用轮播功能,但能把它用好得却很难。设计人员设计轮播功能时存在5种严重可用性错误,你是否也在犯这些错误?
1、轮播功能控制权被用户取得后,它仍然保持自动滑动
与滚动新闻条在电视上自动滚动新闻标题类似,轮播功能可以在页面中自动滑动显示可视化内容。这种技术通常用于在网站主页中显示特色内容以吸引用户。但问题在于,当用户取得轮播功能控制权后,它默认的自动滑动效果并没有停止。当用户浏览轮播模块中的内容时,应该停止轮播功能的自动滑动效果,并切换到手动浏览模式,使用户能按自己的节奏浏览内容。用户还在查看上一个内容,此时轮播模块自动滑动到下一个内容,这么做很烦人。
2、一行一次仅显示一个新内容
轮播功能一行显示多个内容,能够便于用户进行批量浏览。但有时候用户点击浏览下一批内容时,一行一次仅显示一个新内容。单个单个地显示新内容耗费了用户的大量时间及点击量。逐行显示新内容更有效率,这样用户进行少量点击就能一次查看更多新内容。
3、令人迷惑的内容显示进度
由于轮播模块每次只能显示有限数量的内容,因此让用户了解浏览进度很重要。内容显示进度不直观会让用户感到困惑,这种情况发生在显示总项目数量中的已浏览内容数量时[1]。在轮播模块中显示当前浏览的内容范围对用户而言也没必要,相反,用户真正想了解的是他们还有多少内容没有浏览[2]。设计人员可以直接列出轮播模块中的内容总行数及当前行,这样更简单明了。
4、无限滑动
对用户而言,重要的不仅是要了解他们在轮播内容中的位置,还要知道轮播内容什么时候结束。轮播功能的无限滑动效果是通过滑动到末尾后又跳转到第一个内容处实现的,没有告知用户内容已经浏览完毕, 这可能会导致用户再次无意中浏览相同的内容。给轮播功能加上约束,当浏览到最后一个内容时,将指向下一个内容的箭头设置为失效状态。
5、鼠标点击目标小
毫无疑问,目标越小,越难点击。如果轮播模块中的箭头符号比鼠标还小,用户就会遇到难题。将箭头符号放在按钮上面,使箭头的目标更大、更容易点击。这夸大了用户的点击区域,使他们不用精确地点到箭头上就能出发箭头对应的功能。箭头图标尺寸变大也更容易让用户看到。
避免常见的轮播功能设计错误
既然意识到了轮播功能设计中的5种严重可用性错误,应确保不要在你的设计中出现这些错误。轮播功能应支持用户便捷地浏览内容。轮播功能的内容滑动方式、进度展示方式及箭头图标的尺寸都是构成优秀轮播功能的重要因素。在后续轮播功能设计中牢记这些因素,不要让用户在使用过程中遇到可用性问题。
原文地址:https://uxmovement.com/navigation/big-usability-mistakes-designers-make-on-carousels/
[1]原文:This happens when designers point out the number of items shown out of the total number of items
[2]原文: Showing users the range of items they’re looking at with the total number of items in the carousel is a lot of unnecessary information for the user process. Instead, what the user really needs to know is how many item rows they have left to view.