网页设计之栅格设计

相信各位都是老司机了，哪个设计师没几个网上的原文件模板，那你们有没有见过这样的玩意儿呢，是不是很熟悉的感觉，我刚开始做网页的时候，参考线拉好首屏高度、内宽就开搞，也没想过太多，我相信很多设计师也是这样

栅格系统英文为“grid systems”，也有人翻译为“网格系统”，其实是一回事。不过从定义上说，栅格更为准确些，从维基百科查到栅格的定义为：栅格设计系统（又称网格设计系统、标准尺寸系统、程序版面设计、瑞士平面设计风格、国际主义平面设计风格），是一种平面设计的方法与风格。运用固定的格子设计版面布局，其风格工整简洁，我百度知道用的是不是十分娴熟，哈哈

关于平面网格系统我就不说了，其实是不会。。。有兴趣的同学推荐站酷上研习社K先生的浅谈网格系统，讲的非常棒，这里截取K先生文章一部分，来，膜拜一下

网页栅格系统

网页栅格系统是从平面栅格系统中发展而来。对于网页设计来说，栅格系统的使用，可以让网页的信息呈现更加美观易读，使用栅格系统的网页会非常有条理，看上去也很舒服，一致性会很好，这会很大程度提升用户体验

来来来，站酷、微博、天猫超市，感受一下：

6不6，我就问问6不6，什么，都是中国的，再看看国外的Youtobe

哈哈，还想说啥，第一次了解到这个我真特么激动，跳起来差点吓着我BOSS。。。站酷，新浪微博，天猫，Youtobe都是最少百万级用户的网站吧，这样被实践证明过

的好东西你有理由不用吗，反正我已经交出了我的膝盖

说了这么多再不告诉你们用什么做感觉我要挨揍，来了啊

科普一下960px网格系统（http://960.gs/）, 也称 960栅格布局, 数年来作为网页设计人员的最爱, 被用来搭建网站和设计网页布局. 。该无疑是非常好的网格系统, 因为相当灵活. 它帮助网页设计者快速地构造以下栏栅数目的布局原型: 9 x 3, 3 x 3 x 3, 4 x 4 x 4 x 4, 10 x 2 等. 960 网格系统可能是现在最受欢迎的网格系统, 并已经在很多网站和设计模板上使用。

就是它了，网址在那里了，FREE的，他的优点看上面就知道啦，有好就有坏，这骚粉色的几条放在页面里，会束缚设计师的思维，要尝试跳出来做设计，和画画差不多，第二个，有时候可能要算数学了...........一些比例要算，再不济手机计算器打开

这么重要的消息都告诉你了都不转发一下吗，今天的网格就说到这儿，在动手之前多做一些规划，把栅格用到得心应手，离大神距离我觉得会近一大步，大家加油，我的QQ设计交流群：398696929，欢迎来一起交流学习