前两天翻博客的老文章,发现排版很乱。同一页里,有的段落开头空两格,有的顶格,还有的一数空了六格。看了下 HTML,问题都出在我自己历年留下的各种写法上。
2023 年写的文章,段落没有包 p 标签,文字直接放在页面上,模板的缩进规则作用不到,整篇顶格。后来有段时间手动打空格,一段开头四个空格,加上模板自带的缩进,缩进去六个字的宽度。还有篇老文用了九个大标题,往下滚全是标题。图床挂了的文章里,图片没了,占位的空块还留在页面上。
让 AI 把全部五十五篇检查了一遍,问题都找出来修完了。修完我想,还得知道标准的做法是什么,不能只按自己的感觉改。
这一查才知道,中文网页排版是有规范的。W3C 有份文档叫《中文排版需求》,缩写 CLREQ,和 CSS 规范是同一个组织出的。GitHub 上也有现成的方案:一个叫 typo.css,sofish 写的;另一个叫“赫蹏”,六千多个 star。赫蹏是古人对小张纸的称呼,汉代就有记载。
一、几个冷知识
翻规范的过程中看到几条冷知识:
- 斜体是拉丁字母的传统,源自手写体。中文方块字斜过来很别扭,所以正式的中文排版里,强调用加粗或者着重号,不用斜体。
- 段首缩进两个字的宽度,是铅字印刷传下来的规矩。杂志那种窄栏,两个字缩不起,才缩一个。
- 中英文之间要不要加空格,吵了十几年没有结论,两边都有人写规范。
印象最深的一条是两端对齐。中文是方块字,适合排齐,段落右边参差不齐看着难受。这次给正文加了两端对齐,行尾整齐了。
二、缩进还是段距
最有意思的是“段首缩进”和“段间距”之争。有个叫 reuixiy 的博主写过一篇《网页字体排版的哲学》,把这事讲清楚了:这是两种分段方式,对应两种阅读方式。
书上是缩排。段落之间不空行,只在段首缩两格。读书是连续的,一个字接一个字往下走,缩排的分离感弱,不打断这个流。段间距分离感强,读长文容易断。
网页是滚动阅读的。段间距分隔明显,扫一眼就知道哪段是哪段,适合快速找信息。新闻站、技术文档基本都是段间距加顶格。
我的博客最后选了两者都用:段首缩两格,段间也留空。按严格的标准这是犯规。但我自己读下来确实舒服,缩进保住读书的连续感,段距让手机上滚动的时候不至于挤在一起。博客是给自己写的,读着舒服比守规矩重要。
三、全套样式一起定了
这次把正文的全套样式一起定了:引用块、列表、表格、图注,全部统一。以后写文章只管用标准结构,样式交给模板。引用块现在长这样:
“中文出版品上,段首缩排以两个汉字的空间为标准。”
W3C《中文排版需求》
表格也有了统一样式,细边框,表头一点底色:
| 参数 | 我这儿的取值 | 出处 |
|---|---|---|
| 段首缩进 | 2em | 铅字印刷传统,CLREQ 原文照抄 |
| 行高 | 1.8 | 中文行距 1.5 到 2 之间,取中偏松 |
| 段距 | 1.2em | 模板原有,读着合适就没动 |
| 对齐 | 两端对齐 | 方块字天生该排齐 |
这篇文章本身就是个展示:缩进、段距、加粗小标题、引用块、列表、表格,都用上了。