项目翻页(Item Pagination)_Yahoo_Pattern(翻译)

<Category: 前端设计> 查看评论

原文地址: http://developer.yahoo.com/ypatterns/navigation/pagination/item.html

当数据太多(或者数据项列表太长)一页显示不下时,将数据项列表拆分进一系列的页中.
提供”上一页”和”下一页”的链接让人们可以访问被分页的数据,最好同时也提供”第一页”和”最后一页”的链接.

解决什么问题?

用户需要从一大组分好类的,但是无法简单的显示在一页的数据中查看一些数据项

什么时候用?

  • 信息多到无法合适的放到一页中
  • 通常感兴趣的内容可以在前几页就能看到
  • 需要深度研究的信息,应该考虑放到一个可以滚动的区域内显示

具体解决办法是什么?

  • 将数据项列表拆分进一系列的页中
  • 提供”上一页”和”下一页”的链接来访问信息
  • 同时提供跳转到”第一页”和”最后一页”的链接
  • 同时提供用户正在访问的信息类型(type of object)

  • 显示用户当前正访问的一组内容的信息.使用表单”[$ObjectName]s [DisplayedItemRange] of [TotalItems]“([内容名称] [当前显示的内容范围]/[全部内容] )
  • 按照以下顺序显示链接: 第一页, 上一页, 下一页, 最后一页
  • 使用箭头图标来增加链接的可点区域
  • 当链接不可用时需要表现出不可用状态

为什么使用这个组件?

  • 箭头图标可以帮助区分链接,同时增加点击区域
  • 跟搜索结果翻页不一样,在翻页时,控制链接是一直可见的(即使不可用).这样可以防止当翻页时,不可用链接忽然被隐藏,干扰到用户

可访问性

  • 正在访问的页面不要加上链接.比如,如果正在访问第3页,那么数字3应该没有链接

原文:http://pd4.me/blog/methodology/itempagination_yahoo_pattern_translate/

本文来自: 项目翻页(Item Pagination)_Yahoo_Pattern(翻译)

您或许也会喜欢:

  • 优秀注册表单设计方法及案例分析(0)
  • 10个完全免费的网页原型(线框图)工具(0)
  • 前端开发中的一些用户体验细节(0)
  • 前端开发大众手册(0)
  • 前端最想看到的UI规格标注(0)
  • 如何设计一个用户为中心的Web应用程序(15)
  • 网站用户体验的76个体验点(3)
  • 10个有用的网页应用程序界面技术(0)
  • 商务Web应用程序的界面设计(0)
  • 15个滑动门效果CSS导航菜单实例教程(0)