平面栅格

网页栅格源于平面栅格。《平面设计中的网格系统》一书的核心观点就是利用网格平均划分界面，然后把内容合理地放置到网格系统中，并对栅格中变化多样的排版做了比较详细的分析和讲解。网格数量不同，最终呈现的内容也不同。懂得运用栅格系统，就能熟练运用平面设计的排版方式，设计多样化的布局。

在日常生活中，当东西越来越多、物件越来越乱时，不加以整理，就很难找到想要的东西。网页也是如此。网页是构成网站的基本元素，文字、图片、视频、表单等是构成单个网页的基本元素。当网页内容越来越多时，为了更加舒适、合理地展示网页信息，就需要一个栅格系统。

网页栅格与平面设计中的栅格系统原理相似。在早期的印刷工艺中，为了让内容排列更加整齐就运用了栅格系统，后来页面设计也沿用了这种系统。按照页面内容和宽度制定好栅格系统，然后再把视觉元素填进栅格。网页栅格的出现让网页信息得到了更加合理的规划和布局，为了更有效地区分和陈列内容信息，对展示空间进行分割和布局。内容越多、越复杂时，就需要对网页进行越精细的框架分割和内容布局，让内容展示变得更加整洁舒适，用户体验更加人性化。

栅格化是为了更加规范化，更加合理、有效地布局内容，内容决定框架结构，所以不同内容的界面其框架结构也不相同。栅格强调规则、秩序，能够让信息更加快捷、系统、有效地进行展示和布局。另外，栅格化过程中负空间（留白）的合理安排也很关键。结构越复杂，栅格的作用越明显。