刘钢的博客 – 我是UED

文章标签 ‘页面实现’

没有评论网页栅格系统研究（4）：技术实现

2009年12月7日

前三篇文章中，明确了栅格系统的设计细节和适用范围。这一篇将集中讨论960栅格系统的技术实现。

Blueprint的实现

Blueprint是一个完整的CSS框架，栅格系统是它的一部分功能。我们来看demo页面：
阅读全文…

分类: 视觉设计, 页面实现标签: 960px, 交互, 栅格系统, 网页栅格, 视觉, 页面实现

没有评论网页栅格系统研究（3）：粒度问题

2009年12月7日

研究（2）中讨论了栅格系统的基础知识。这一篇将集中探讨栅格系统的粒度问题。（注：如非特别指明，栅格系统均指24列960栅格系统）

淘宝的首页（截图）目前尚未严格遵守栅格系统，如果重构的话，宽度方向可以考虑采用下面的栅格布局（只考虑页面主体部分，忽略高度的比例）：

（图1）阅读全文…

分类: 前端开发, 视觉设计, 页面实现标签: 960px, 交互设计, 产品设计, 栅格系统, 网页栅格, 视觉, 设计, 页面实现

首先澄清一个应用场景问题。研究（1）中指出，对于结构复杂的网站，不少设计师们喜欢采用960固定宽度布局。但要注意的是，960并不是万能钥匙，大部分网站没有也不需要栅格系统。Amazon采用的是宽度自适应布局，最大限度的呈现信息。Google更是简简单单，主题部分就一个列表。eBay的页面非常简洁，商品页面宽度自适应，信息自然流畅，噪音少，购物很踏实。类似的站点还有很多，对于这些站点来说，宽度自适应布局更受青睐。

阅读全文…