浅谈不同媒体上的文章排版

我们首先要确认一点,那就是阅读媒介的根本目的,是以最有效的方式将内容传递给用户。
  所有的排版布局的目的,就是为了有效性——而美感,其实也是有效性的体验,因为一个爆丑的东西用户看不下去,那就是无效了。。。

有效的并不表示一次性输出的信息的量很大,而是说一次性输出的信息中被用户吸收的信息可以足够大。
  比如说,我用4px的font-size,0px的字间距、行间距、段间距和页边距,将文字铺满一页,这样的一次性信息输出量绝对是最高的,但这样的情况下用户能真正吸收的信息量却几乎为零——所以着不是最有效的信息输出,而是最糟糕的信息输出。

排版、布局以及字体字号的目的,就是让用户可以最方便地掌握所看的信息的整体与细节——所以我们会有粗体,斜体,不同字体,各种段落样式,目的就是为了让信息的传递可以尽可能地高效。

而美感,就是高效的一种体现。
  因为美感的排版布局字体设置,可以让用户持续专注于阅读,并且也会尽可能用心地去接受那些信息(这里不考虑内容本身带来的厌恶感)。
  一个好的排版布局给人的是一种沉浸式的阅读体验,而糟糕的排版布局则总会让用户停顿下来吐槽一下(或者不吐槽)。

然后,有趣的问题就来了。

不同信息媒介上的相同的内容,是否应该使用完全一样的排版布局以及字体设置?
  答案显然是否定的。
  我们知道,人们看电子书、实体书和看网页其实是完全不一样的过程与体验——甚至于连看时的姿势也是不同的:看书的时候你是捧着的,书到眼睛的距离和夹角都依据“捧着”这个姿势而定,但在看网页的时候你不是捧着显示器在看网页,而是显示器固定在一个地方,你去看它,所以这是两个完全不同的姿势,而这里距离和夹角的不同就决定了应该选择什么样的字号和行间距,甚至于这也决定了光照强度(一般来说光都是从头顶来,于是捧着书和立着的显示器上的光照强度是不同的,自身发出的光亮也是不同的),这也决定了看内容时的感受体验,从而不同的信息媒介上需要有不同的排版布局和字体字号设置。
  这里再来看一个例子,就是关于“换页”。
  传统的实体书有换页,打字机的打印稿有换页,PPT有换页,但网页可以没有换页,也可以有换页,这是和前面很不一样的地方。
<blockquote>这里提一下:现在有一些互联网大牛开始为网页引入换页机制了——不是制作网页的时候就将内容分页呈现,而是将现代浏览器的Scroll行为替换为Page行为,这是浏览器级的改造,当页面内容过多的时候自动实现换页。所以可能在未来,对于网页是否有换页的讨论也要改造一下了。</blockquote>

这种不同就导致了页面信息呈现方式的巨大改变——比如说,有页面这个概念的文章中,在“尾注”之外会有“脚注”这个概念,但在无换页的内容呈现形式中,其实只有“尾注”而没有“脚注”——“脚注”的“脚”是页脚,没有页,怎么有页脚呢?
<blockquote>对此的讨论其实还牵扯到更深层次的问题,这里没有深入。这样的问题中就包括了“我在页面的底部加上一个脚注显示Banner,那么是否就是脚注了?”这样的问题。但这个问题之所以说更深层次,因为它其实牵扯到了“脚注”和“留白”的区别和联系这样的定于性问题。</blockquote>

当然,随着“页”这个概念的丢失,除了一些页面组件和文章组件(“页眉”“页脚”是页面组件,“尾注”“脚注”是文章组件,但同时“脚注”也是页面组件的衍生品)的丢失,也会带来一些组件概念的改变,比如说在无页的网页(这句话好绕口)上,我们可以有“旁注”和“批注”——这些原本都属于“修订”范围内的东西,即在原始内容上的二次编辑,但现在却可以成为页面本身的“原始”内容,而不是后期由修订者加上的内容,这是相对于传统页面组件和文章组件的拓展——这点的极端之作就是A站与B站上的横飞如蝗的“弹幕”,偶滴个肾哪!

不单单如此,随着信息媒体的改变,我们也会发现一些传统文章结构概念的变化——不单单是文章组件会有修改,文章结构也会有所不同,这是随着媒介发展而来的一个必然。
  比如说,关于“段落”的定义,其实电子时代和纸媒时代已经有了一定的不同。

传统写文章的时候,文章的结构是怎么样的?
  最小的单元当然是字和词了(这两者在英文等拼写文字系统里是一体的,而在方块文字系统里则是有所分别),然后是句子,然后是段落,然后是章节,然后是文章。
  当然,在纸媒时代的后期,段落和章节之间其实还有一些亚结构——这个的专有名词估计要去问问专业人士了,我们可以姑且成为“段群”。
  比如说,我们经常可以在很多文章里看到如下结构的内容:
<blockquote>第一章 BLABLABLA
  首先,我们要blablabla
  其次,是要blablabla
  第三,是blablabla
  
  可是,我的上帝啊,怎么可以blablabla
  这是在是blablabla
  绝对的blablabla啊!
  
第二章 MiaoMiaoMiao
…………
</blockquote>

这样的结构在现代的很多小说里并不罕见,几个段落构成一个整体,和下一个整体之间通过一个(或者多个)空行来做风格。
  这样的结构又不是章节直接的划分,因为很可能在内容上,这两个整体在章节意义上是相同的或者相关的,不能被分割为两个不同的章节。
  所以说,在传统的纸媒时代,文章的结构大致可以从小到大分为:
  字词、句、段、段群、章节、全文
  但这样的结构在网页时代却变得暧昧不清了。
  因为,传统的纸媒时代,段和段群这两个概念在感官上的差异,就在于段和段之间的段间距相比段内的行间距,并没有太大的差异(这点在作为传统编辑器代表的Word里可以看到,那就是段间距和行间距一般都是相同的值,或者段间距比行间距略大。而作为比较,使用标题样式的时候,段前距和段后距一般都很大,特别是段前距,往往是行间距的两倍以上),而段群之间的段间距却是非常显著的。
  甚至于,在某些情况下,人们会在段群之间加入分割线,或者在一本书中使用分割线作为比段群更大但比章节较小的一个次级结构来使用。
  可是到了网络时代,就正常书写(更应该说是打字)来说,你的每一次回车所产生的都是分段,而不是不分段的换行,而现代浏览器的默认样式,是将段落当作段群处理,从而过去的段落在视觉体验上就等于了过去的段群。

或许现在是时候来回顾一下为什么人们要又段落段群和章节这样的文章结构了——在一些较高级的排版工序中我们会发现,理清这个概念是很重要的。

人们为何要分段?
  这是因为一个分段表示一个具有相同属性的信息群落的结束和下一个具有相同属性的信息群落的开始。
  这么说很抽象,就简单来所,就是当作者所要写的一段意义上相关的内容结束,要开始下一段意义上不同的内容的时候,就会选择换行。
  一般来说,一句话表达了完整的一个意思,而字词并不能独立做到这点。也就是说,字词给予句子所要的术语的独立意义,但术语必须在句子中才能在逻辑上构成一个完整的独立实体。
  因此,一句话和下一句话在意思上肯定是分离。
<blockquote>当然,这点也是存在例外的。比如对于超长句来说,可能一个完整独立的意思需要几句话联合在一起才能构成,而不是一句话可以做到的,这样的情况也有。</blockquote>
  而段落,就是将意思上具有关联性的句子构成一个整体,并且通过一定的句间关联词组织起来。
  但,这样的关联结构往往并不是严格的,而是较松散的。
  比如大量逻辑性推导的时候,可能一个因果关系甚至一个因一个果都可以独立成一段,而在普通叙事中,一个逻辑推导则可以合并成一段。
  因此,分段不单单和语句本身的意思相关,也和这段内容在正篇文章中的定位有关——在上面的例子中,前者是将逻辑关系理清,所以每一个逻辑要素都是一个独立的整体,而在后者中,逻辑推演只是文章的一个组成部分,所以不需要做另行拆分。
  基本上,这样就构成了我们为何要分段的理由。
  而段群则是比段落更大的一个概念,其意义和作用其实就仿佛段落之于句子,是将在意义上相关的段落构成一个整体。
  章节也是如此,但是层次更高。
  比如说,我们经常看到的现代小说中的多视角叙事,就存在两种不同的写法。
  一个,是以每个人物(视角)在一段时间内的行为作为一个独立的章节,而另一个则翻过,以时间作为独立的章节,在一个章节中存在多视角并行。
  无论那一种,这都取决于作者打算以什么样的节奏来叙事,以及作者打算对整篇文章的大致结构分划。而在这个大前提下,我们可以看到每一个章节中要么是一个人物的多个时间段,要么是一个时间段的多个人物,放在一起总是不妥的,但分开成几个章节又很奇怪——这点在学术论文中的处理方式是引入第二层甚至更多层的章节结构,但在一般小说中则不可能如此,所以就引入了段群。
  这个例子说明了我们为何需要这些复杂的文章结构,而且也明确了一点:一个段落的内容是在意思上相关的,而两个段落之间这种相关性会有一定程度的断裂。
  在一篇涉及内容较多的文章中也可以有类似的应用,将文章的内容做出恰当的分割。
  而这个特性在我们处理一下比较高级的排版布局的时候很重要——当然,我们可以感到欣慰的是现代的网络时代,人们写文章的时候几乎都忽略了这些东西。这让我想到以前我学做网页的时候老师还教过这些现在基本上没人用的内容。。。

即便是现代,我们也会看到,一张页面的内容中往往是需要加入图片或者视频,甚至于是公式的——在一些学术性内容中,对公式的需求甚至于比现在很多旅者对照片的需求还要强烈。
  这些内容的布局就是所谓的“图文混排”,是排版布局中的一个重要项目。
  而,在传统媒体以及Word时代,这种图文混排的方式有很多,比如环绕式,悬浮式,分割式,等等等等。
  其中,无论哪种都会面临一个问题,那就是如何告诉读者这张图片下面或者旁边的内容是和上面的内容构成一个段落的,还是分属两个不同的段落?
  在许多时候,这并不构成问题,因为一般来说段落不会是两端对齐的(一些“高级”的中文页面排版布局“规范”中提出过,中文文章需要遵守两端对齐,这在IE系的CSS规范中就是text-align: justify; text-justify: inter-word/inter-cluster/inter-ideograph;,但这个规范并没有被除了IE外的别的浏览器所支持。当然了,很多和排版布局相关的CSS其实都只有IE系浏览器支持,比如图文混排神器:region。当然,那些规范同时也提出了中文不要用斜体),所以读者可以通过段落末尾是否顶行尾来确定段落是否结束——但这样的行为同时也反应了文章结构的不完整。
  这就是段落提示的意义所在。
  这在具有公式的文章中是非常常见的,因为公式相关的排版的一个常见规范就是:一条完整的公式必须独占一行。所以在一些理科学术书籍中,我们经常会看到这样的结构:
<blockquote>
  The blablablablablablablablablablablablablablablablablablabla equation
    $G T_{\mu\nu} = R_{\mu\nu} + \frac{1}{2}R g_{\mu\nu}$
is discovered by famous physicist Albert Einstein.
  And blablabla......
</blockquote>

可以看到,这些书籍中如果是一个段落中插入分割式图片(也就是公式)的话,图片下的一行是顶格的。这是告诉读者,这整个一段构成一个整体,是一个段落,而不是两个段落——这就是最早的段内换行的由来(当然,段内换行还有更多的特性,比如段样式不会因为段内换行而被打断,只有分段才能打断段样式)。
  因此,段首空格(以及别的方案)的主要目的是为了实现段落提醒,让读者在略读过程中可以大致掌握文章的结构与脉络——更由于一般来说人们行文的时候一个段落的第一句话总是最概括的,所以当你告诉别人你的段落结构的时候别人也就可以在略读的过程中快速掌握你的文章的大意——当然,想我这种习惯于短段落的人这样的方案无效,所以我才会如此偏爱在文章中使用段群。

在现代的网络Blog时代,这样的需求其实有所降低,因为除了旅者,大多数人并不会在文章中插入过多的图片,所以不会注意到类似的问题——甚至于,大部分人写文章的时候并不会去计较内容是否构成一个段落,所以即便被图片打断问题也不是很大。
  这点其实很容易理解,因为在过去,将文章整理成可出版形式的都是专业人士,他们可以按照专业规范来布局(当然,这点并不是说这个规范就真的多么“专业”,很多规范的出现是相当随机的,比如现代键盘的QWERT布局,就随机得不行,但这货现在是规范和行业标准),但对普通人来说这是不现实的,所以在普通人人人可以出文章的自媒体时代,专业规范显然不再合适,我们需要更加适合普通人遵守并执行的简化规范,于是一切从简原则就诞生了——而从简原则的流行自然也会在一定程度上影响专业规范,因为规范说到底是为人服务的,而不是自存自在的。

就另一方面来说,我们可以来看一下为何几乎所有的英文文章段首不要求空格了。

这事其实就和一些中文排版布局规范里会说中文和英文之间要有半角空格一样,纯属意外——浏览器的语言HTML中是不识别连续空格的。
  HTML的一个特点,就是它是标记式的,文章结构和样式都通过标记的方式写在一个纯文本里。
  但,早期的HTML都是人写的而不是机器根据规则生成的(比如现代的Markdown和ORG就是生成的HTML页面)。人在写页面的时候,如果文章中充满了各种标记符号,那是难以阅读的,所以人们会根据文档结构,在写的时候以换行和缩进让HTML源码页面变得容易阅读和理解。
  而这就导致一个问题:换行和缩进(Tab与空格)并不希望被显示在最后浏览器呈现的页面上,所以HTML规范中换行、Tab和空格都会被自动转义,无论你怎么输入换行Tab和空格,这些东西连续在一起的话,最终只会被转义成一个空格,而不会是多个(为什么还保留一个空格?因为HTML是拼写语系的人发明的,他们字和字之间需要空格来断开——我们可以不负责任地遐想,如果是中国人发明了HTML,那么很可能所有内容中空格都会被去掉,因为中文本身并不需要空格,除了段首缩进)。
  这就导致,在英文(等拼写语言)世界中你要实现段首空格(按照当时的打字机时代的规范,是四个空格),就必须输入四个空格的转义符——Non Breaking SPace,即nbsp。
  这使得输入变得非常麻烦,从而不切实际。

更重要的是,字体这个东西相对于打字机时代,也有了长足的发展——打字机时代的字符的宽度是固定的,也就是说都是定宽字符,这样才方便打字机在输入完一个字符后将滚轴滑到下一个字符输入位。
  可在电脑出现后,字符不再只有定宽字符,还有变宽字符——所以我们可以看到,wi中,字符w的宽度和字符i的宽度是不一样的,这样整篇文章看上去才漂亮——如果你有幸看过打字机打印的书籍的话(我有一本,是一本很老的广义相对论讲义,还有一本很老的量子场论讲义,那本里很多地方甚至都是手写的)就会发现那些书籍一打开之后就有一股扑面而来的机械朋克味,而这就在于那些字符都是定款的,于是看上去一块一块的很“僵硬”。
  事实上,即便是中文字符也不都是定宽的,没记错的话一些草书和行书对应的字体也是变宽的,但,当然,相对来说,这个变宽的变化也不是很大。
  变宽会导致什么问题?变宽会导致打字机时代很合适的“四个空格”在现在就变得不具可操作性——是相对w的四个字符宽,还是相对i的四个字符宽?
  由于上述这些理由,段首空格变得不再合适,从而人们开始转而使用更合适的段落提醒——这就是现代浏览器里段落的段间距这么大的由来(p的浏览器默认样式里是有margin-bottom这个属性的)。
<blockquote>这里说一下,这个行间距规范其实也不是浏览器时代的新发明。在打字机和手写时代,商务信件有多种各种,其中有一类格式就是段首无空格。这类商务信件格式的最大特点就是通过不同的行间距和字号大小来给出文档样式和文章结构,这点其实现在的Markdown和它很像。当然,同一时期的另外一些文章样式中则通过不同的段样式来实现这点,比如常见的有段首缩进和悬挂缩进,还有比如段首字母特写。
作为比较,中文书信样式似乎较少有段首不缩进而使用各种行间距的。当然,这也涉及到一些舶来问题。</blockquote>

但,同样的理由在中文排版上其实不存在——中文全角空格不需要输入nbsp,而且几乎所有中文字体都是定宽的,或者就是变宽但差距不大的(做个比较,简书现在的英文自己一个空格是5px,w的宽度是13px,i的宽度是6px,而中文字符一律18px,包括全角空格)。所以英文排版中抛弃段首空格的理由在中文排版中其实不成立。
  当然,考虑到国际化大背景下的各种统一与接轨,中文排版也使用浏览器默认的段间距甚至于不使用段首缩进并无不可——但,这里我们可以看到,问题现在不是“段首缩进必须不用”,而是“段首缩进可以不用”。

另一方面,我们也需要明白一点——段落提示是段首缩进的功能,而这个功能在现代浏览器上由段落的行间距来实现了。但这也就表示——如果段落行间距无法正常实现段落提示的功能,那么我们需要使用别的段落提示的方案来做到这点——当然,如果只是随便写写的话这点不去管也不是大问题。
  这里就牵扯到一个很有趣的现象了——我们不再需要段首缩进的一个理由就是输入太麻烦,所以说白了就是为了方便我们偷懒。而在Markdown的更受人欢迎的版本GFM[1]中,我们只需要一个回车就能实现换行,两个回车实现分段(标准的Common Markdown里一个回车是空格,两个回车是分段。GFM的这个Feature被称为“New Line”)。

这样就导致了一个很有趣的现象,那就是我们为了方便而使用段落的大段间距来实现段落提示,但又由于方便而在GFM中使用不分段换行来表示分段,从而导致了冲突——这当然不是规范本身的错,因为一个是排版布局规范一个是语义表达规范,两个规范分属不同范畴。这所表达的观念是:我们需要留意规范的使用前提,从而避免不同范畴的规范混合使用时产生意料之外的效果。
  同样,这并不是说就要放弃段间距作为段落提示而使用段首缩进——你可以使用别的段落提示的方案,或者修改页面的br样式来实现段落提示效果。

事实上,就比较严谨的角度来说,规范的使用必须要严格遵守规范成立的前提条件,否则就是滥用规范。
  当然,就人文与美学领域来说,这样的前提条件往往不是严格的,而是很松散的,所以很多时候就算你不管规范的前提而使用规范也不是什么大问题。

现在,让我们回到文章排版布局的问题上来做一个结尾。
  嗯,似乎关于标题所说的话其实谈得比较少,我擦。。。

由于现代阅读媒介和传统阅读媒介的不同,我们不难发现,许多规范都必须做出相应的调整才能满足现代的需求。
  最常见的影响我们阅读体验的因素,就是不同设备的阅读场景和阅读习惯。
  我们看实体书的使用习惯和看电子书是不同的,看网页又是一种完全不同的习惯,而看报纸和看杂志,有和看书是不同的体验。
  这些体验不单单是因为媒介材质的不同给,也是因为人在使用这些媒介阅读的时候,所采取的行为本身是不同的,从而获得整个感受是不同的——这就是我们要在不同的媒介上给予不同样式的原因。
  这里一个常见的案例,就是同样是制作PPT,放在大屏幕上的和发给每个人的PPT的要求就是不同的,因为前者的使用场景是有主讲者,后者则是读者自己看,从而PPT的结构样式和内容分布也就有了不同的要求。
  另一方面,不同的媒介上,由于历史原因,也会有各自不同的行业规范,这也会导致呈现方式的不同。
  但,无论在什么情况下,我们都需要明了的是——规范的真正目的,就如本文开头所说,是为了更有效地将信息传递给读者,而不是为了保持规范本身。


  1. GFM的全称是:Github Flavored Markdown。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,233评论 4 360
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,013评论 1 291
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,030评论 0 241
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,827评论 0 204
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,221评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,542评论 1 216
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,814评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,513评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,225评论 1 241
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,497评论 2 244
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,998评论 1 258
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,342评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,986评论 3 235
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,055评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,812评论 0 194
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,560评论 2 271
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,461评论 2 266

推荐阅读更多精彩内容