左边还是右边?
发表于 2007年08月08日 09:14 PM @ 分类:用户体验及交互设计

上次从上海回来,就装了 PPLive,以前用的是 PPStream。
PPLive 和 PPStream 的最大不同之处在于一个频道导航在右边,一个频道导航在左边。初次使用 PPLive 一段时间后我觉得很别扭,当然我可以说是因为它的导航在右边导致的。那肯定有人说,你用 PPStream 用习惯了。那时并没有想出左边右边的道理,因为能想到的也就是视线的从左至右从上至下。
刚才偶然翻到了一篇文章:Navigation: Left is Best。文中提到的 Kingsbury 和 Andre 在 04 年是做的两次测试很有意思。
测试的假设是:如果用户要经过三次选择(三次点击)才到达想要的内容,那么如何设计这三次选择的位置?
第一次测试他们俩评估了 8 种导航结构(但不包括右侧导航,我猜测应该是 TTT、TTL、TLL、TLT、LLL、LLT、LTT、LTL),并分别制作了购物网站原型,给 16 名参与者测试。(统计)结果如下:
使用效率最高的三种设计
- 第一次选择在左侧(即 LLL、LLT、LTT、LTL)
- 第二次选择也在左侧(即 LLL、LLT)
- 第二、三次选择的位置,不同于第一次选择(即 TLL、LTT)
测试用户最偏好的三种设计
- 第一次选择在左侧(即 LLL、LLT、LTT、LTL)
- 第一次和第二次选择相同(即 TTL、LLT、LLL、TTT)
- 第二、三次选择,或一、二、三次选择是在一起(即 LTT、TLL 或 LLL、TTT)
这样总结下来的话,left-left-left (LLL,5) 和 left-top-top (LTT,4) 是效率最高并且用户最偏好的。
第二次他们把右侧导航也加到测试中去(据 Kalbach 和 Bosenick 在 03 年的一份研究报告说左侧和右侧导航没有太大区别),这次的测试仍然表明第一次选择在左侧,要比在上侧或者右侧效率高。同时,所有选择在同一个位置是效率最高并且用户最偏好的。
这两次测试并没有明确结果说右侧导航不可行,仅说明了左侧导航的效率要比右侧导航效率高,并且有三种导航结构设计不太合适:TTL、TLT、RTR。
好了,回过头来我抒发一下我的看法:
- 虽然大部分用户操作鼠标时,指针在右侧,但并不表明所有需要点击操作的东西放在右侧就可以省力;
- 根据谷腾堡原则,相近内容区域的右上角是视觉潜伏区,我觉得导航不太适合放那里是因为竖的导航从右上角开始不便于引导;左上角开始就比较好;
- 由于视线的从左往右从上往下,所以左上角作为一个操作行为的开始会比较符合用户心理;如果是点了右侧,然后再移动视线到左侧看操作结果,有背于视线习惯;
- PPStream 和 PPLive 由于是树形频道列表,所以要找到节目需要 1 次以上点击,上边的测试结果应该对设计有所帮助。
大致就是这样,我个人也不是非常喜欢新版的 Google Groups 模板,也是导航在右侧,不过因为那里操作几率比较少,所以影响不大,就像 Taobao 的改版,在商品搜索结果页上把原来在左侧的一条移动到右侧一样。

评论
如此说来你的blog文章分类应该放在左边还是右边?
我觉得对于我这样习惯用右手和触摸板的人来说,导航放在右边还是蛮方便的。
其实,你文中陈述的原理都很有道理。但忽略了一个前提,导航是否就一定是我们视觉首要关注的重点。
按照视线从左向右转移的原则,我觉得,对于第一次条目选取,导航放在左边是有效率的,选了标题再看内容。但是在浏览内容的过程中如果想重新选取标题,导航放在右边就更有效了,因为我们关注的重点是内容,视线在内容区域停留的时间应该远大于在导航区域停留的时间,这种情况下让内容停留在主视区,导航放在视觉潜伏区应该更方便些吧。对于PPlive这样的媒体,如果不是频繁更换频道,导航还是“躲”在右边比较可爱:)
如果哪一天YouTube的Related Video List跑到当前播放Video的左边去了,我会很不习惯呢:)
2007年08月09日 03:58
@lica 你说的很对,所以他们测试的是总计有三次选择;我Blog这边放右边是因为那块使用率不会太高,所以放在潜伏区比较合适。至于说 PPLive 和 PPStream,我认为在选台的时候,导航在左侧更合适一些,因为决定下长时间看某部电影的话,会使用全屏,这样导航就不受影响了。
2007年08月09日 09:02
我反倒是习惯了pplive的右边:)
隽辰兄说的是“引导”,大概是从左至右的一个过程
看pplive大概是有2个阶段,1、收看前 2、播放中
1阶段关注的是导航,2阶段关注的是内容
楼上的兄台说的也有道理
但“浏览内容的过程中如果想重新选取标题,导航放在右边就更有效了,因为我们关注的重点是内容,”
其实这个时候又回归到1阶段了,关注应该是导航吧?
2007年08月09日 09:04
我当初也思量过这个问题~不过之后,却没有再拘泥于这个。
首先因为这如果改的话,影响老用户太多了。其次,右边的频道列表还有一些相关操作,比如悬浮的信息、右键菜单操作等(本人相信左侧适合导航和信息,右侧适合操作)
感谢Junchen兄的关注,以后也请多多提出意见:P 十分感谢~
2007年08月09日 09:19
补充1:我们的用户没有明显目的性的居多,在右侧翻翻看看、几分钟就换台的不少。
补充2:欢迎大家把使用PPLive的感受和意见和我说,咔咔~:P
2007年08月09日 09:26
@Ami PPLive应该右侧导航信息居多一些吧。确实没必要拘泥,本身设计就是一体化的,体验也是综合的感觉,所以我们可以移山填海嘛。(我就属于那种翻翻看看,几分钟就换台的人,PPLive 的内容……唉,特别是晚上)
2007年08月09日 09:35
@JunChen 呵呵,关于晚上的问题...我们正采取举措,私下交流
2007年08月09日 10:19
好文,收藏至20ju.com
2007年08月09日 12:57
在2006年雷钧的互联随想中曾经有一篇文章也是关于这个导航位置问题的【http://blog.donews.com/rssf/archive/2006/08/29/1021864.aspx】两位的论调似乎针锋相对但是有一点是共同的,其实是承认左面是页面上关注焦点的,这也是由长期的阅读习惯和桌面操作系统的使用习惯所决定的,(此页面有网页热区图【http://www.seovista.com/post/clickstream-heatmaps.html】)而看两位的内容细节会发现两位所说的网站类型是不同的,junchen所说的实验中是以购物类型网站作为实验原型的,而雷钧所说的典型网站事实上是个人blog,前者是以引导消费者消费为主的网站,导航是网站的关键部位,所以必定需要放在左手边,而个人网站或者个人blog是想让更多的人看到自己的内容,内容放在左手边而将导航放在右手边也就无可厚非了,所以我觉得关键是网站的类型决定左右,而像pplive这样的软件,最重要的还是看,再加上没有如购物网站或者门户网站的超大量信息列表,放在右边还是比较合适的,请各位前辈指教。
2007年08月09日 15:03
@小镇 我看你给的文章里面有 Windy 的一段回复我比较赞成:
1、左导航适用于改变当前页面内容
2、右导航适用于引导用户到一个新的页面
这么讲就比较简单清楚了,我的观点就是左侧(或左上)作为一个(或一些)操作行为的开始,是比较符合用户心理的。
2007年08月09日 15:29
用户习惯才是王道
人和人之间是不同的
我猜想这里大多数都是右撇子,不能代表左撇子的观点
同样的,你把这些东西放到那些连操作系统都是从右到左读的那些操作系统,和使用这些操作系统的人那里,一样是不适用的,要不就应该更加严谨,加个限定,对于汉语操作系统下大部分右撇子用户的UE
有些关于UE的东西一直想找junchen谈谈,不过没啥时间,有空见面聊
2007年08月10日 00:28
@ShiningRay 你说的有道理,但我并不是在写论文,而且我对左撇子接触不多,没办法做到处处严谨。左撇子不是特殊人群,粗略估计占大约10%人口,但是从设计角度讲,他的行为模式是特殊的。如果要同一个界面100%满足左撇子和右撇子基本是不可能的,但是我们可以参考一些通用的原则比如 Fitt's Law 等。
还有一点说明的是,并不是说右撇子偏好右边(或左边),左撇子偏好左边(或右边),视线(左眼主导、右眼主导)和操作又是不同的,这里面涉及到的因素太多了。钢琴,我们见到的绝大部分三角钢琴都是按右撇子设计的,左撇子要去适应比较难(也有少量的左撇子钢琴)。
Ami 说的很好,就是别拘泥,不然就无法创新。
我非常希望操作系统、浏览器能够做到弥合左右利手的差异,可惜还不够好。
2007年08月10日 10:28
http://jodi.tamu.edu/Articles/v04/i01/Kalbach/
The hypothesis that the left-hand navigation would perform significantly faster than the right-hand navigation was not supported. Instead, there was no significant difference in completion times between the two test conditions.
2007年08月10日 14:05
@bld 这在文中已有提及。
2007年08月10日 18:10
我觉得吧,互联网初级用户更适应sidebar放左边,高级用户适应右侧栏。
2007年08月12日 20:45
我个人比较喜欢右侧的东东,不管是音乐、电视台列表还是GGAD,看网页时,习惯性的舍弃左侧的导航了,除非需要跳出页面的时候。
2007年08月15日 11:08
你忽略了強制加在用戶身上的東西. 特別是中國的計算機用戶.
第一: 我們不難發現,平時在Win平臺下面, 鼠標點擊率最高的不是左邊的開始按鈕, 而是右邊的close按鈕。
第二:大多數用戶是用右手去點鼠標, 可以想像的是當用戶移動鼠標到左邊是什么情景? 就相當與你把右手移動到左邊去拿東西一樣, 視線完全給擾亂了。 當然,一些初級用戶和操作速度比較慢的用戶可能影響不大。
第三:一些軟件的長期使用會引導用戶的操作習慣的。 例如在中國,1億用戶都在用QQ, QQ默認是放置在右邊的, 什么消息出來也是從右邊的狀態欄出來的。 因此用戶可能(沒有統計)更傾向與移動鼠標到右邊吧.
2007年08月27日 00:33
有没有考虑过为什么当初win or mac 的竖滚动条是在屏幕右侧,
而关闭按钮win在右侧,mac 在左侧呢?
用户习惯?专利问题?
在鼠标没有滚轮的时候,是不是菜单在右侧就更方便;
而有滚轮的时候就都一样呢?
我觉得这类测试的用户其实已经被操作系统驯化了……
2007年08月30日 22:44
@xorms 关于滚动条的问题,有专门的测试的,请找一下;我忘掉那篇文章的地址了。
2007年08月30日 23:36
我也在搞自己的博客网站,我想在这里可以学到很多的经验和知识的。
2007年09月22日 10:36
我可不可以弱弱的问一个很小白的问题……
就是……那个……“TTT、TTL、TLL、TLT、LLL、LLT、LTT、LTL”这个具体是什么意思……
2007年10月09日 10:54
@CIN
TTT = Top, Top, Top
TTL = Top, Top, Left
以此类推
2007年10月09日 11:11