把屏幕做成一张牛皮纸
不要印好的线,只留纤维、色斑和压暗的边。
一开始想找的是那种“坐下来继续写”的感觉,不是好看。
试过印着细线的底,也试过各种带装饰的纸。它们都有个共同问题:纸先替你决定了字该落在哪儿。眼睛会不自觉去对齐,写的时候像在填表。最后我把所有印好的线都拿掉了,只留纸本身——浅土黄、有纤维、边上略暗一点。字直接落在上面,位置由段落自己决定。
三层做出一张纸
做法不复杂,三层叠起来就够了:
- 一层主色,再叠四处极淡的椭圆渐变,模拟纸浆厚薄不匀造成的亮斑与云斑
- 一层细颗粒噪点,用一段内联的矢量噪点生成,不用外部图片;再补两道极淡的斜向纤维纹
- 四周向内压暗一点点,让整页像一张摊开的纸,而不是一块填充色
一层主色打底,四处极淡的椭圆渐变铺出亮斑与云斑,四周再向内压暗一点点。
关键在噪点本身要带透明通道。直接铺一层灰度噪点会把纸弄脏、弄灰;我用一层颜色变换,把噪点映射成“透明底 + 稀疏的深褐细点”,只在有斑的地方轻微压暗,其余地方纸色原样。也别依赖图层混合:浏览器分块合成时混合层会局部失效,纸面上会浮出一块边界笔直的浅色矩形,滚动时尤其明显。
别把纸做脏
最容易翻车的是把质感做得太明显。颗粒一大,正文边缘就开始发毛;色斑一深,读两屏就眼酸。我的经验是给自己定个规矩:
把纹理调到“刚能察觉”,然后再降一半。
所以所有纹理都放在纸张的伪元素上,压在文字层下面,绝不跟正文抢对比度。缩到手机宽度时它们自动退到几乎看不见,只剩一片暖色。
墨与朱砂
墨色也别用纯黑。换成深褐,字会像渗进纸里,而不是浮在纸上。再留一点点朱砂给链接、引文线和印章,整页就有了一处呼吸的地方。
剩下的都是排版
纸搞定之后,真正决定好不好读的还是老几样:行宽 660 像素上下、行高接近 2、段落首行缩进、标题之间留够气口、日期用小号字退到后面去。
纸只是邀请你坐下来,排版才决定你能不能待得住。
夜里读的时候,也不会觉得刺眼。灯暗了,纸还是纸。
← 新一篇 为什么我又开始写博客了
旧一篇 给博客做减法:只留四样东西 →
← 返回归档