翻页设计的分析

来源:百度文库 编辑:神马文学网 时间:2024/04/28 23:11:59
Flickr 照片列表的翻页

Flickr翻页的问题分析:
1、用户不能清晰的知道当前浏览的具体情况,不知道究竟看完了多少页,也不知道究竟还要看多少图片。对自己目前所处的位置一无所知。
2、flickr的翻页区域只提供了总共多少图片,一排非常小的字,大概是因为这些图片的具体数值不是用户最关心的吧,但是那排小字很容易被人忽略,用户几乎会无意识的选择性回避。
3、对于“上一页”、“下一页”,不知道在这种多页可供用户选择的设计中,其意义何在?如果仅仅有“上一页”、“下一页”的两个按钮的话估计用户会不加思索的点击,但是加入了提供给用户能够进入7个页面的连接选择,那么是否用户还会去有意识的去点“上一页”、“下一页”呢?
4、对于“7”的页码的选择,不清楚是否有什么具体的含义?为什么是7而不是5或9?再或是8或10?是因为被点击的页面前后都有相同的三个页面吗?要平衡?
优点分析:
1、按了“上一页”或“下一页”之后则边框加粗(成为重点),引导你继续往下点;
2、数量少得情况下,提供了“最后一页”的链接(图上没有);
3、颜色,给人反馈比较明显。用偏暖但是靠近冷蓝的亮丽的枚红色突出了当前正在显示的页面。非常醒目。而且选中和不选中还有图形的区别,给一些色盲的用户提供了区分的方便。
新浪文章留言部分的翻页

优点分析:
1、有人说新浪评论部分的翻页是显摆用的,我到不认为如此,因为既然用户本身来浏览评论也是随便翻翻的,抱着目的要一页一页翻阅的用户毕竟是少数,那么这样的一个滚动条式的翻页正好满足了用户的需要,用户不需要去想要翻到哪个页面,随便拉拉,随便看看就完成了目的。而对于一些抱着一定要翻到某个页面的用户,上面的可按页码点击的设计就可以满足其需要了。
2、滚动条式的翻页设计,可以明显让用户直观的感觉到自己浏览了多少了,还有多少没有浏览。尤其对于页面数量非常多时,如上百页以上的时候就更显得重要了。
3、共多少条留言的设计明显。
4、提供了最后的页码显示,和最初的页面显示,方便了用户的使用,并且最后页码的提供也能提供给用户一个明确的量的信息。
缺点:
1、选中的当前页的页码反馈不足,明显看出设觉设计的缺陷。
2、没有提供用户直接跳到某个页面的页面设计,造成了一些用户的适用不方便。
3、如果滚动条上能够提供鼠标反馈就更好了。
4、提供批量翻页(“上 10 页”)。
淘宝商品列表的翻页

优点:
1、永远显示“上一页”“下一页”,并且状态和形状有区分;上一页使用率较低,所以设计的较小; 这种设计虽然是好的,但是上一页、下一页在这种情况下的必要性如何?还需要经过用户的使用分析。
2、永远提供“第一页”“最后一页”的链接
3、提供了页面跳转
4、在列表的顶部右侧提供了一个简化的翻页,并且与底部的翻页设计一致。
缺点:
1、由于设计的可变性太多,可能不利于页面的排版设计,比如当翻页用于小的、空间有局限的地方时由于长短不一的可变性比较大,会影响到一些页面放不下这样的翻页设计。
2、桔红色的图标的颜色的运用是不错的,但是却用在不是经常点击的上一页、下一页的设计上,当前的页面页码设计确是最普通的黑色。
3、光靠颜色的区分是国内设计的通病。
Amazon 商品列表页的翻页(引)

是五个网站中唯一一个区分访问过、没访问过的链接的颜色; 不需要“上一页”、“下一页”的时候就不显示; 第一页的链接永远存在; 告知用户列表总数量和当前显示的数量(Amazon有些页面将数量显示在列表顶部); 不提供所有的页,上图中 400 页是极限,400 页之后的内容可以通过分类选择来缩小范围(同时给出提示)。
Google 搜索结果的翻页(引)

富有创意的设计; 不需要“上一页”、“下一页”的时候就不显示; “上一页”“下一页”的链接区域很大,容易点; 不提供所有的页,上图中 100 页是极限,100 页之后的内容或许可以更换关键词重新搜索,但是没有提示。
小结(引用)
必须提供“上一页”和“下一页”的链接,并根据状态和使用率区分设计; 数据量大且更新快的情况下,并且当列表按照特定排序时,一定要提供返回“第一页”的链接;“最后一页”的链接根据访问情况而定; 突出当前页的数字,并且尽量使页码容易点击(不要紧紧地靠在一起),也不要一下子把所有页码都显示出来; 一般不需要在列表的上下都提供翻页,增加程序负担并且干扰视觉;淘宝列表顶部提供的简化的翻页想法不错,但不知道使用率如何; 对于“第一页”和“最后一页”的链接,如果是在页码序列中显示,一般会附带显示第二页和最后第二页的链接,比如本文中的淘宝翻页的截图,显示为“1 2 ... 96 97”。如果单独提供,可能视觉上会以为这不是页码序列的一部分,特别是最后一页的数字,用户可能没有概念; 对于用户比较熟悉的内容,或者用户自己的内容,尽量提供“最后一页”的链接,比如 Flickr 对于个人照片就是这样处理的(文中的翻页取自某个 tag 的照片)。
如果可以通过数据确定用户的行为是较为随意和没有目的性的浏览,那么提供多种方式的翻页很有必要。