直白来讲，网格系统实际上正是用于构建特定秩序，辅助设计师进行排版的一连串参考线，如同小学生练字所用的田字格习题本那般，因有了边界以及参考线的约束，版面自然而然会更具章法可依，哪怕是刚开始学习写字的小朋友，也能够迅速上手！
比如说，众人在学习拼音（英文）书写期间，所用到的拼音习题本里面，大都配备着带有三行分区的格子。此一问，是另外一种样式的网格系统，这皆是为能够充分适应英文字母结构，进而构建成的具备特定秩序的参考线。
所以，网格系统，它自身就是大家在九年义务教育阶段都曾接触过的事物，它仅仅是参考线罢了。
网格系统，它存在有着意义，一方面是用以协助提升设计师编排图文的效率，另一方面是用来辅助设计师构建具备秩序美感的版面。
尤其是在对待编排图文数量达到几十页甚至上百页的杂志、画册以及面向网页设计的情况时，若能合理运用网格系统，那么会在很大程度上提高设计效率。
怎么建立合适的网格系统？
经由先前的讲述，想必大家都已晓得，书写汉字需借助田字格，书写英文要用三行格。所以，网格系统的构建，理当是因应创作内容自身，从而构建起的一个个单元格。此原则跟家具柜子的设计极为相仿，柜子的每个格子分区，无不被赋予特定用途，这般就能让收纳变得整齐有序。
印刷平面设计中的网格系统
于平面设计范畴之内，针对一个版面而言，欲创建一套网格系统，需逐个去明确三个核心参数，第一是版心的具体大小，第二是分栏的数量n，第三是水槽的宽度，此宽度也被称作为栏间距，或者是留白。
这几者的尺寸关系，在横向上为：
页面尺寸 - 左边距 - 右边距 = 版心宽度
版心宽度 = n * 栏宽 +（n-1）* 栏间距
做设计时，页面尺寸，像纸张尺寸、屏幕分辨率，通常是已知的，或者是经验数据，只需确定上下左右边距，就能确定版心尺寸。接着依据图文内容信息量，确定分栏n的数量，设定栏间距为5至10mm，这是经验数据，并非固定不变的，如此便得出栏宽尺寸数据了。
面对画册、杂志这类呈现载体，其版面规格为285*210 ，一般情况下，栏目的划分设定为3栏会显得更为合理，当然，要是你所要编排的内容之中，信息的密度相对比较大，或者小尺寸图片的数量较多，那么也能够考虑将栏数设定为4栏，如此一来，你便会具备更为灵活多变的组合尺寸，以此去适配复杂化的版面编排。接下来所展示的这张图，它呈现出了在同一网格系统之下，类似图文信息所具备的不同组合编排的可能性。
相同文案在同一网格系统的编排可能性1
相同文案在同一网格系统的编排可能性2
分栏，是针对版面在竖直方向做的划分，当横向上的参考线也被建成之后，这时便形成了真正的网格系统。那么，横向上的参考线划分，其间距该怎么确定呢？在这个时候，你能够依据预设正文字号的行高，以及版心高度，看需要多少个单元格，从而综合确定。具体的方法，请前往下文查看：
酷coo豆：通过实例来讲解，平面设计里的网格系统该如何运用，PC 端网页设计中的网格也就是栅格系统。
之前，我们将这种用于划分版面的，被称作「网格系统」的参考线提及过，然而在网页设计领域，鉴于纵向高度一般具备可延伸性，并且并非固定不变的，所以不存在横向划分的参考线，针对这样的参考线组合，我能够将其恰如其分地称作「栅格系统」。
倘若你，于进行PC端网页制作之际，吾等分栏一般能够划分成12栏。此数字12乃是极为讨巧的经验性数字，缘由在于它能够被1、2、3、4、6、12整除，这便表明页面元素于宽度方向上的尺寸，会存有6种规律重复且易于被前端达成的结构，进而能够满足多数网页设计的布局需要。
这些栅格之间的尺寸，遵循着下图所示的关系：
身为设计师，于规划页面设计之际，其所必须开展的工作，乃是逐个去明确公式里的未知量，藉由如此方式，使得整个网格系统，得以更为妥善地适配待编排的图文元素。
手机端App设计中的栅格系统
手机端所进行的设计，其运用的栅格系统跟PC端是相类似的，不过存在一些App，在屏幕的左右两边会出现留白边距，大家只需把这个尺寸纳入思索的范围之内就可以了。
总结
对于构建网格体系，实际上不存在十分特别的准则，网络上你所瞧见的文稿，多数是各异设计师的某些经验传授，大家全然能够参考领会吸纳之后，梳理出一套自身的想法来。
网格系统，简单讲，乃是一堆参考线的统称，大家可别被这个看上去「高大上」的术语给蒙住，在你做设计之际，只要你用心去做了，并且去实践了，自然而然就能体会到这些尺寸的精妙关系。
具有数理美感的一个维度之网格系统，它还是一种高效辅助工具，大家用过一回，便能明晰其中情形了。
接下来的这些文章，亦或是教程，说不定能够促使你对于网格的了解，朝着更高的层次迈进，各位要是有兴趣的话，不妨去阅读一番。
（完）