版式编排中的网格与秩序——以汉字编排为例

王文婷 成都大学

意大利人Successione di Fibonacci 通过对兔子繁殖现象的观察，发现最为和谐的比例来自于费氏数列，而这早已经存在于自然之中，如：向日葵的种子排列；海洋中常见的鹦鹉螺；人的臂展等于身高……费波那契用自己的“发现”证明了造物主的伟大，因此，也可以说这个来自于自然的数列，就如同构成生命的DNA，是造物主伟大的创造。将斐波那契数列应用在版式编排设计中，结合网格系统定会给读者带来和谐，舒适的阅读感受。

网格，顾名思义，栅格状，有横竖线、有经纬线体现在平面系统中，而在版面中则是在固有的网格系统中添加图形与文字。当然，网格系统被用在设计的各个领域，如网页设计、字体设计、标志设计、版式设计以及产品设计等。一个好的设计在于能把复杂变为简单，并让其更具有秩序性。“网格是一种将不同尺寸比例的文字、图片结合成整齐匀称的整体的手段，但在最终效果中网格应该是被其他图形主题所覆盖或隐形的。”我们做版式编排是为了让设计更具有功能性、更有逻辑性和视觉美感，其目的是为了读者更能直观理解信息内容。

一、网格系统的发展

网格系统也被翻译成栅格系统，英文为“grid systems”，网格系统的前身要算人类对比例的探索，公元前20世纪到公元前16世纪的史前巨石柱就记载了1：0.618比例的黄金矩形的运用。从古希腊著名雕塑断臂维纳斯及太阳神阿波罗的完美比例、达芬奇画像的黄金分割点、再到金字塔，巴特农神庙等都在追寻黄金分割的极致之美。而现代网格原理是在第二次世界大战后的瑞士得到发展和应用的。在20世纪40年代后期，第一次出现了使用网格作为辅助设计的工具。这种趋势体现在做设计的时候严格遵循网格设计原理，用规定来约束编排文本和插图。20世纪60年代，瑞士设计师约瑟夫·米勒-布洛克曼系统地提出了网格体系，成为影响世界的瑞士“客观排版设计”(Objective Typography and Design)非常重要的组成。20年后，布洛克曼影响深远的著作《平面设计中的网格系统》用德语、英语两种语言相对照的形式出版，再后30 余年，中文版出版，为平面排版提供了“尽可能利用版面中的资源来达到秩序与经济的最大可能性”。

二、编排设计中的网格

网格是将平面二维版面划分为单元网格，或者是将三维空间划分成单元模块。这些单元网格的高度相当于文本的整行数，宽度与文本栏的宽度相当。这些高度与宽度则是版式编排中特有的单位，点(磅)数(points)和西塞罗(ciceros)。网格中的单元格之间会有一定的空间，这样就保证了图片或者文本之间不受干扰，能保证易读性，同时又兼具留白的效果。而正是这样的空间让版面划分成无数的单元网格，可以让文本、图片、元素设计这些视觉元素统一在标准网格中，并适应网格的统一布局。同时可以将小的单元网格组合成更大的单元网格，而这些单元网格之间通过层级关系建立联系，让整个版面显得有层次感和逻辑感。只要我们能够合理的组合单元网格，那么版面中的视觉信息就能形成某种统一的关系。

我们可以说网格系统提供了一种更为简单的方式来理性地组织二维和三维空间，让版面或者空间有画面层级关系。简而言之，在如今的媒体载体中，体现在如网页基本分栏、微信公众号的页面分栏和APP 的界面操作系统。总之，网格在编排设计中的作用是可以通过系统和逻辑地构建文本和插图类模块，能解决如何在紧凑的空间中根据文本和插图的特点建立层级关系。

三、网格在汉字编排中的秩序——由倍率构建

现代设计从西方引入东方，我们大多遵循西方设计基础作为基本的设计方法论，然而在版式编排中，我们通常与汉字打交道，汉字编排在平时的设计中就显得尤为重要。网格系统的建立在于将信息传递纳入秩序之中，同时，美比严格按网格排列重要。

正方形的汉字非常适合纵横双方向的精准排列，这是汉字与网格的“诞生”地瑞士所使用的西文系统最大的区别。因此，可以将汉字成倍率地无限缩小或放大，构建属于汉字的、可以用数字描述的三维网格矩阵。

从刘晓翔老师《由一个字到一本书——汉字排版》一书中得到任何字号都可以作为倍率(系数)的基本单位，选择时主要依据文本的属性和倍率是否易于计算，如：艺术类书籍用1.5pt 作为倍率，1.5×4，6pt 适合作为图注说明；1.5×5，7.5pt 可以用于注释；1.5×6，9pt则可以作为正文。文学类书籍用1.5pt 作为倍率，1.5×7，10.5pt 的正文字号会非常适合阅读。以此类推，不同的文本属性都可以得到适合它的符合1.5pt 倍率的字号。既然是由倍率组成的网格，那么2pt或者3pt，甚至任何单位都可以依据倍率来设计出一个编排系统，我们则需要考虑是哪个倍率更适合作为这个文本的系统基点。更重要的是，这些不同的字号由倍率联系在一起，形成可以看到的，如：7.5pt文字、15pt 行距4 行(60pt)，与6pt 文字、12pt 行距5 行(60pt)占用相同的纵向空间；7.5pt 文字、24 字(180pt)，与6pt 文字、30字(180pt)占用相同的横向空间；倍率使不同字号的相同字体、等倍率行距所排列出清晰的阅读逻辑。看不到的、内在的倍率关系把不同的字号联系起来，感性地排列它，会让文本在静止的版面上表现出律动的视觉感受。

刘晓翔老师把汉字用倍率来表示，并发现字号之间神奇的韵律关系，他指出无论在平面设计、还是数字媒体设计等的字号大小如下：1pt、1.5pt、2pt、2.5pt、3pt、3.5pt、4pt、4.5pt、5pt、6pt、7pt、8pt、9pt、10pt、11pt、12pt、14pt、16pt、18pt、20pt、22pt、24pt、30pt、36pt、42pt、48pt、54pt、60pt、72pt，从1pt 到5pt 以0.5pt 为倍率递进；5pt 到12pt，以1pt 为 倍 率 递 进；12pt 到24pt，以2pt 倍率 递 进；24pt 到60pt，以6pt 为 倍 率 递进；60pt 到72pt，以12pt 为 倍 率 递 进。这 些 递 进 倍 率(0.5pt、1pt、2pt、6pt、12pt)之间，又存在0.5pt 的倍率关系。这就意味着，排列12pt 18 字占用横向空间与排列8pt 27 字相同，形成不同字号之间基于倍率的逻辑关系。当然汉字系统不同于西文字系统，而当一个版面中出现不同体例(属性)的文字，需要靠什么成为一个统一的系统，也值得我们去探究。

四、网格能带来的秩序

在版面设计中我们通常会遇到处理文字层级信息，如何让文本能有秩序感和逻辑感则需要通过网格来规范整个画面。在使用网格前，需要设计师先通过对设计信息进行处理——信息编辑设计。信息设计的过程是设计师对文字进行深刻理解，创造出有利于文本的传达，提高文本信息传达效率性，其意义在于：重新梳理文本信息的层级关系，使得信息更适合受众接受，这里的梳理不是对版式的美化，而是深入解读文本并注入主观想法，提升文本的阅读性。结合文字的倍率关系，文本之间的层级同样可以使用倍率，同样6pt、9pt、12pt 之间的文本段落依然遵循1.5 倍关系，依次对应如：注释、正文和标题。文本的秩序美通过位置、大小以及留白来展现，这就是版面中通过层级关系带来和谐的秩序。在设定网格的过程给了每一个文本或图形构成相对准确的位置和大小，那些不断重复的比例与韵律，带来一种理性之美。我们梳理清楚文本之间的层级关系提升文字层级顺序表现力，通过网格处理文本层级关系很显然能让整个版面更清爽，传达更直接。由此可见，网格是一种把秩序之美引入设计的一种规范操作，规范文本信息和图形元素。网格能使所有的设计元素在整个版面中协调、一致。运用一定的数学比例关系使版面在节奏变化中产生逻辑性、秩序感。

五、结语

综上所述，版式编排在如今的媒体载体中发生着微妙的变化，但依然可以用网格规律去建立秩序。汉字作为大量的文本出现在版式编排中，如何高效的输出，需结合媒介的可变性进行调整，区分不同类别的信息，建立文本层级关系，而其目的是提升阅读体验感。