"上一页"和"下一页"的位置也很重要。位置最好相对固定,让用户可以很方便地使用上一页和下一页来进行页面切换。在这一点上,上述几个网站都做得不错。而百度的前 20 页分页页码会随着页码的下翻而向右移动,这一点体验并不是太好。可能百度的出发点是想让用户在20页之内方便地进行页面的切换。 另外,淘宝和京东还在页面的右上角提供了简单的上翻和下翻功能。下面是完整的分页功能,上面是简化功能。产品页下面需要完整的分页功能很好理解,因为用户都是浏览完该页产品再翻页,所以把完整功能置于底部。那什么时候用户需要在产品页上面使用分页功能呢?可能是在用户不想看产品页内容就翻页的时候,可能是在用户想了解自己所处位置的时候。另外由于产品页上部的分页模块常常和产品筛选条件模块放于一处,所以这里的功能需要尽量简化、节约空间。此外,淘宝和京东还在此处显示了搜索结果的总页数,可能是为用户提供是否重新输入检索词或者修改搜索条件的决策支持信息。
淘宝页面右上角的简单翻页功能
京东页面右上角的简单翻页功能 7:当前所在页 用户当前所在页的页码应该与其它页码的样式有所区别,以此来提示用户当前所在的位置,便于导航。Google、Bing、Yahoo 和百度都使用了黑色的字体来表示用户当前所在页的页码,京东用了橘黄色的字体来表示,而淘宝将当前所在页的小方框背景设置为黄色。 另外,当前页应该是不可链接的,所以鼠标放上去之后,应该不会变成 hover 状态。而在京东的网页上,鼠标放到当前页上面时,当前页会像其它页码一样,背景变成蓝色,鼠标也会变成手指的形状,这样会误导用户,以为当前页是可以链接的。 值得一提的是新浪微博。新浪微博的默认方式是,随着用户向下浏览,自动加载两次,之后再出现分页。对于大多数用户,在闲暇时浏览微博,加载两次的内容已经能够满足他们,对于需要浏览更多信息的用户,也让他们知道自己到底浏览了多少。这种方式无疑更加灵活,既保证了用户浏览信息的连续性,又提供了快速导航和预估信息量的作用。
新浪微博信息流中的页码导航 8:区分访问过/未访问过的页码 按照 HTML 的默认设置,访问过和未访问过的链接颜色是不同的。但是,上述网站中,只有百度和 Bing 将访问过和未访问过的页码导航链接用颜色区分出来了。我个人认为做这一区分是有必要的,尤其是当我用搜索引擎搜索信息的时候。 9:导航页码中的品牌宣传 前面提到过,Google 的导航页码上方是一个变形的 Google Logo,每个页码都对应 Logo 里面的一个字母o。用户甚至可以通过点击这些o来跳转到其对应的导航页码所在的页面上去。 另外,配色也可以和品牌宣传结合起来。Google 的导航页码的蓝色和其Logo 中的G和g的颜色很相近,百度的导航页码上方显示的是百度的Logo,京东的导航页码中使用的橘黄色和蓝色是其 Logo 的主要颜色,淘宝的导航页码中使用的橘黄色也是其 Logo 以及网站的主要颜色。 10:其它 在进行产品设计的时候,我们一切都是从用户需求的角度出发来进行思考和设计的。但是,产品是同时满足用户需求和公司需求(通常是盈利)的东西,所以,有时候,不得不考虑其它的一些东西。比如,在你浏览某些新闻资讯类网站的时候,你会发现,每一页的内容只有可怜的一两段,然后就又得翻页,一篇不长的文章,被分割成了十几页。这种为了增加网站 PV 而故意分割文章增加页数吸引用户点击的行为真的是令人发指。 恰好最近在进行产品设计的时候也遇到了类似的问题,所以把这一问题梳理了一下。 (责任编辑:admin) |