关于分页
作者：小F 来源：ue-ui 发布时间：2011-07-01 12:39:03
今天小池提出一个问题讨论，如何使分页做的更友好。做了一些调研和思考，做了些总结。
分页在电商网站3级页、搜索结果页面等信息量大的页面是很重要的。我们在设计时要考虑：
分页的长度
首末页存在的必要
自定义页面的必要
设置场景去验证可用性。
1 用户模糊搜索一个关键字，往往会出现很多相关的结果。用户会逐页的去翻页去寻找，此时用户会使用“上一页、下一页”或附近的数字进行逐页检索。
根据心智模型 ，保持用户点击的连贯性。“上一页、下一页”距离相对固定，让用户使用上一页下一页不断切换时很方便；分页长度不宜过长，过长会导致用户视线游离；也不宜过短，过短会导致页码显示过少，给用户造成网站信息较少的错觉。
京东这一点可用性较好，“上一页、下一页”距离相对固定。同时页码数量显示适中。新蛋、淘宝距离不定且距离较长，容易使用户实现游离，可用性不好。
2 用户往往会选择根据价格从低到高排列或销量从高到低排列来作为自己的购买参考。用户翻页到后面20几页发现销量越来越不好，价格越来越高，此时他会想返回第一页去看。此场景说明首页是有存在的必要
京东、苏宁没有给出回到第一页的快捷途径
上述例子中有2中快捷途径：
a / 第一页始终显示
b/给用户一个自定义页码，用户输入页码直达。
3 实际情况表明，在这种信息量大的页面上，用户往往不知道具体页码上的具体内容，不会去自定义某个页码去查看，会逐页或间隔两、三页去查看 ，翻到一定页数时用户发觉结果越来越背离自己的初衷，所以会返回第一页或重新检索。同时要显示出最后一页，系统需要计算出所有的页数，在商品很多时，会导致页面性能降低。
在设计时，我们要注意:
少就是多，精简。避免花哨
以方便用户使用最先。避免为交互而交互
优点，符合用户在模糊结果是翻页的情景，视觉焦点相随聚集；始终显示第一页，给用户快速回来的途径；用用省略号表示还有没有显示出来的页面，引导用户去查看；交互方式良好，做到了精简，没有附加花哨交互。
根据上述理由，以及苏宁VI色，给出苏宁易购分页的优化方案，抛砖引玉。求PK，求调教…
从谷歌图片检索的弱化分页，让用户顺着屏幕一直不间断的浏览下去，到轻博客点点网随着用户的滑动自动加载更多的内容，这些微妙的交互可以让我们的体验更加愉悦也使我坚信交互设计师是可以用户做更多的，是很有价值的。
0
投稿猜你喜欢
译者按：在iOS HIG已经强大经典了N年之后，Android终于推出了一套比较系统的HIG（大概是为了配合Android 4.0 Ice- 表单递交合法性检测-只接受数字。如下代码加入HTML的<head>区：<SCRIPT LANGUAGE=&quo
- 很久之前就对jQuery.animate的实现非常感兴趣，不过前段时间很忙，直到前几天端午假期才有时间去研究。jQuery.animate的
- MySQL 是完全网络化的跨平台关系型数据库系统，同时是具有客户机/服务器体系结构的分布式数据库管理系统。MySQL 是完全网络化
- DW2004的中文乱码情况你遇到过么？乱码一般是怎么出现的呢？也许很多时候用其他软件（比如Editplus）写程序的时候，忘了meta标签里
- 在网站开发的时候经常要用chr(),但本人比较懒没时间记那么多。于是到用到的时候就查，这样麻烦。现在将它写出来方便以后用到查，也方便大家!c
- 文本框 textarea 限制输入文字个数的的javascript代码，我们经常在评论留言页面我们需要在客户端限制访客的留言长度，当然最好我
- 一、Browser Capabilities组件 该组件最主要的作用是：提取识别客户端浏览器的版本信息。其原理是这样的：当客户端浏览器向服务
- 昨天打包下载了一个服务器整站，拿到这个*.mdb的文件后，却不知道怎么用，百度了一下，才知道是一种木马打包的形式文件，不能用WINrar来解
- 做沙盒的时候遇到一个小问题——在IE9里面竟然抓不到事件的keyCode：element.addEventListener('key
- flash_url : "../swfupload/swfupload_f8.swf" upload_url: &quo
- 近来看论坛上经常有人提问关于如何无刷新,自动更新数据.传统上,我们浏览网页,如果加入最新的数据.只能是等我们重新向服务器端请求时才能显示出来
- 阅读上一章：Chapter 9 精简标签Part 2: Simplebits Of Style 简短精悍的样式Chap
- XML文档对象模型（DOM）是什么？可扩展标记语言XML的基础是 DOM。XML 文档具有一个称为节点的信息单元层次结构；DOM 是描述那些
- MaxDB和MySQL是独立的数据库管理服务器。系统间的协同性是可能的，通过相应的方式，系统能够彼此交换数据。要想在MaxDB和MySQL之
- session请求过程当第一次访问网站时，Seesion_start()函数就会创建一个唯一的Session ID，并自动通过HTTP的响应
- 阅读上一篇：你是真正的用户体验设计者吗? Ⅵ很可怕，是吧！图中翻译：（从内到外）第一层：用户体验第二层：内容管理界面设计顾客关系管理交互设计
- 有两张表a表id val 1 a 2 b 3 c 4 d 5 e b表 a_id val 1 null 2 null 3 null 4 nu
- 使用SQL Server事件探查器工具，你可用一个捕获到的跟踪来收集有关服务器的重要信息。与索引优化向导(Index Tuning Wiza
- 最近做了一次口碑网注册流程改造，简单说一下激活邮件的设计上的一些小心得：1、尽量不要用图片，尤其是别把激活链接做成一个点击按钮。2、尽量少的
