一
「web 2
作为「数字原住民」的我也被这盛况感动,思忖着,想在这广袤的互联网空间开辟一块属于自己的地方。
但也只是想想。等我真正拥有了自己的电脑的时候,主流操作系统从Windows XP变成了Windows 7,IE也被Chrome替代。那股人人搭博客的热情也消散得差不多,大家又回到了贴吧、天涯,图的是人多热闹。
但论坛的黄金期也没撑过几年。微博、B站快速成为主流,快手、抖音崭露头角。「人人都有个人主页」的预言的确实现了,只是依附在各个社交平台上。
这很好,每个人都能输出内容,每个人都能被看见。但裹挟在爆炸信息中的我突然想到:我在这片互联网上还是没有一个真正属于自己的地方。
瓜田不纳履,李下不整冠。每个平台有每个平台的规矩与限制。我发现我还是想要一个自己的网站,不寄人篱下,受制于人。
二
博客是个人网站最常见的形式。我也了解到了Git
我想要的究竟是什么?
我在画图上画,在Illustrator上画,在Figma上画。工具换了一轮又一轮,设计稿攒了一版又一版。
外界的趋势也在变:从分页到无限滚动,从网格到瀑布流。我跟着潮流走了一圈,却转身看向了纸。
是第一代的Material Design提醒了我这一点。它把纸与墨、层次与留白重新带回了屏幕,几乎可以与Apple的人机界面指南分庭抗礼,证明了纸上的排版智慧在屏幕上依然成立。
屏幕越来越大,但为了阅读舒适,网页的行长却缩得越来越窄,在屏幕两侧留下了越来越大的空间。两侧要么空着,要么被目录、作者简介等别的信息填满。
纸媒是怎么处理宽版面的?人们在纸上排版了上千年,这个问题早就有了成熟的答案。看看大开本的报纸、书刊、杂志,答案很明显:分栏。
剩下的则水到渠成。屏幕是横的,分栏也是横着分,横向滚动似乎是一件再自然不过的事情。设计稿画出来了,效果很好。我踌躇满志,决定把这设计给实现。
三
这时,静态博客生成器已经很成熟了。我选择了Hexo,生态齐全、部署到Git
所幸前端很容易上手。而Hexo又把网站结构以及Markdown渲染之类的东西都封装好了,我只需要照猫画虎、按图索骥,把主题写好就行。我一边看菜鸟教程,一边把学到的东西转换成EJS和Stylus。导航栏、文章卡片,网站的整体框架很快就搭建了起来。
现代网页工具终究还是为竖向滚动服务的。当实现到文章页时,这个问题就完全暴露了出来。在CSS中,column-width与column-count所定义的数值都是「理想的」,浏览器会根据容器和窗口大小重新计算。在纵向滚动时,这个特性很方便。在横向滚动上,却成为了很大的阻碍。
基于「行长为字号的整数倍」的原则,我将行长设为了24个字,也就是24em。固定行长也带来了一个意外的收获:我开始像排印刷品一样处理中西文混排,调整用词,避免两端对齐拉出难看的大段空白。我甚至考虑起孤行、孤字。这是以前纸上才会有的体验。
然而,浏览器会自动将栏宽和栏数设定为屏幕刚好能装下。这与我的需求相悖,还完美避开了露出半栏内容,提示用户滚动方向的可能。
我找到了一个邪门的方法:在column内再套一层,在里边定死宽度。这是个未定义行为,在所有的浏览器内核上,分栏的整体宽度都会测量失败,导致栏后边与其他元素重叠。但这是我找到的唯一方法。
最大的问题解决了,我很快定义完了Markdown元素的样式,搭建好了其他几个页面,博客建成近在眼前。
一些朋友告诉我Hexo有点过时了。这在我写的时候就已经察觉到了:EJS很笨重、模板年久失修、没有组件化概念、资源管线老旧。我经常要使用一些很脏的办法来修改一些功能,也有一些地方很难自定义。
我是一个逐新的人,我希望我刚写出来的网站至少用的不是现在就已经过时的技术,因为我将来还要数以年计地维护这个网站。
我转向了Svelte,单文件组件、响应式赋值、作用域样式——之前在Hexo里要绕着弯才能做到的事,在这里都是理所应当。
但是Svelte不是静态博客生成器。它是一整个前端组件框架,没有现成的路由、也不管Markdown渲染。这意味着我在享受摆脱Hexo的自由时, 要亲自负责它之前接管的脏活累活。
由于其他事务缠身,我没有很多的精力投入去学习这一崭新的领域。我也急于求成,只想调整视觉效果,不想干这些背后的活计。进展越来越慢,最终搁置。
四
这一放就是一整年。期间我无数次想捡起来,却怯于背后要投入的精力。直到vibe coding爆火,我半信半疑,想找个项目试试。
我立即想到搁置的博客。
导入项目,看着之前半成品繁杂的文件,我手足无措,似乎回到了刚下载好Hexo模版的时候。即便有了LLM做帮手,我还是不知道该让它做什么。
我想了想,试着在对话框中输入:「我现在对这个项目毫无头绪,你能看看我接下来应该做什么吗?」
它读了半天文件,又想了一会,开始输出。把我积压一堆的事情抽丝剥茧,排列得井然有序。也刚好,我的前端水平处在写不出来,但能看懂的位置。我一边感叹时代进步,一边审查LLM写的代码。
接下来的事情就容易多了。如果抛去Antigravity大砍额度至几近不可用,令我逃窜到Codex的故事,整件事进展得飞快。
我把之前的样式迁移过来,并作了改进,又完成了归档页面。LLM也把之前栏后内容重叠的bug用JS解决了。甚至还用Pagefind给网站接上了搜索。当然,LLM还是不擅长视觉上的东西,每次写组件还是错漏百出,要我手动改。但整体还是快到不真实。
再后来,博客就是现在你眼前的样子了。我也终于可以在偌大的互联网中偏安一隅,有了自己的地方。●