网页栅格系统研究（3）：粒度问题（2）
作者：玉伯 来源：Taobao.com UED Team 发布时间：2008-10-28 19:46:00
标签：栅格,栅格系统,网页设计,比例
然而，现实总那么残酷
（图5）
上图中的标题高度为22, 这在24列960栅格系统中是无法对齐的。而且总高度为100, 在24列960栅格系统中也不存在（110才可以）。或许高度方向上我们可以细化行宽为20, 但依旧没法解决上面两个问题（22是明显不能解决的，而对于100px的高度，也无法通过细化行宽来解决。可选高度永远是10的奇数倍，如果进一步细化，小于10后，会变得非常繁琐，没什么实际应用价值）
宽度世界里会好些吗
（图6）
上面是Yahoo!首页上的两个小模块，我都不想去标注模块里面的布局宽度了（因为一点都不符合24列960栅格系统）。宽度世界里，和高度世界一样充满希望但现实却残酷无比。
银弹是不存在的
栅格系统是美好的。但如果我们一味地追求将所有设计都栅格化（必须承认我曾有这个幻想），则立刻会陷入地狱一般的黑暗中。这篇文章中的艰难尝试（我分析了20多个小模块），让我突然醒悟到一个粒度问题：任何设计都有适用范围，超出最佳适用范围，强行使用只会带来无尽的烦恼。对于栅格系统（这里指所有栅格系统，包括多种栅格系统混合使用的情景）来说，我觉得以下场景非常适合：
页面的总体宽度布局，比如两栏、三栏等布局
一些固定区块的尺寸，比如广告图片的尺寸
区块之间的间距，可以参考栅格系统的槽宽（Gutter）
一些可以栅格化的小区域，比如图3中的例子，暗合栅格往往能简化布局上的考虑
除了上面这些应用场景，强行使用栅格系统，往往会束手束脚，适得其反。这篇文章的目的，就是尝试用最啰嗦最费神貌似很科学实际很无聊的分析来指出栅格系统应用时的粒度问题。在粒度问题上达成一致后，下一篇中我们将讨论栅格系统的技术实现，最后一篇则讨论栅格系统的压轴好戏：模块化开发。
0
投稿猜你喜欢
- 在学习tensorflow的过程中，有一个问题，tensorflow在训练的过程中读取的是二进制图像数据库文件，而不是图像文件，因此在进行训
- /**//// <summary> /// 生成带CDATA的节点 /// </summary> /// <p
- 大家在使用python的过程中，应该在敲代码的时候经常遇到str内置函数，为了防止大家搞混，本文整理归纳了str内置函数。1字符串查找类：f
- 之前上传图片都是直接将图片转化为io流传给服务器，没有用框架传图片。最近做项目，打算换个方法上传图片。Android发展到现在，Okhttp
- 0. 简介传统的并发编程模型是基于线程和共享内存的同步访问控制的，共享数据受锁的保护，线程将争夺这些锁以访问数据。通常而言，使用线程安全的数
- 本文实例为大家分享了Python实现计算器功能示例代码，供大家参考，具体内容如下1.简单计算器#计算一个表达式的时候，首先肯定是先算括号里面
- 利用百度词典进行中翻英import urllib2import reimport sysreload(sys)sys.setdefaulte
- 本文实例总结了JavaScript数组去重的方法。分享给大家供大家参考，具体如下：数组去重，一般都是在面试的时候才会碰到，一般是要求手写数组
- 一、需求说明：数据库的备份，对于生产环境来说尤为重要，数据库的备份分为物理备份和逻辑备份。物理备份：使用相关的复制命令直接将数据库的数据目录
- MySQL日志文件相信大家都有很多的了解，MySQL日志文件一般在:/var/log/mysqld.log，下面就教您修改MySQL日志文件
Fiddler，这个是所有软件开发者必备神器！这款工具不仅可以抓取PC上开发web时候的数据包，而且可以抓取移动端(Android,Ipho- 1. 索引及切片数组中的元素可以通过索引以及切片的手段进行访问或者修改，和列表的切片操作一样。下面直接使用代码进行实现，具体操作方式以及意义
- 统一捕获接口报错弹窗提示报错重定向基础鉴权表单序列化实现的功能统一捕获接口报错 : 用的axios内置的 * 弹窗提示: 引入 E
- 1 与达尔文对话140年前，1858年7月1日，达尔文在英伦岛发表了自己有关自然选择的杰出论文。他提出，生物的发展规律是物竞天择。经过物竞，
- 前言首先抛出几个问题：console.log(Boolean({}));console.log(Number([]));console.lo
- 部署网站前查看一下系统是否已经安装CGI1、启动iis服务器，打开IIS服务器打开IIS服务器，点击网站，右击“添加网站”2、创建网站点击“
- 众所周知，程序在启动后，各个程序文件都会被加载到内存中，这样如果程序文本再次变化，对当前程序的运行没有影响，这对程序是一种保护。但是，对于像
- 一：unittest是python自带的一个单元测试框架，类似于java的junit，基本结构是类似的。基本用法如下： 1.用import
- SMTP协议首先了解SMTP(简单邮件传输协议)，邮件传送代理程序使用SMTP协议来发送电邮到接收者的邮件服务器。SMTP协议只能用来发送邮
- 话不多说，请看代码------------------------------------------作者:张欣宇-----时间:2013-
