2 分钟#life #design
把博客推倒重来
第五次重做个人主页。这一次不换框架，换材质——从一张暖纸，换成一块会反光的玻璃。
这大概是我第五次重做这个站。
前面四次分别死在：主题太花、构建太慢、样式无从下手、以及最经典的——改完首页之后，文章页还是旧样子，像两个网站拼在一起。
这一次我给自己立了一条规矩：先把"美工"拆成可独立替换的积木，再动第一行代码。
拆成五块之后，事情变得简单了
| 模块 | 职责 | 能不能单独换 |
|---|---|---|
| A 背景 | 会发光的多色渐变，给玻璃当折射源 | 能，纯 CSS 变量 |
| B 装饰 | 柔光圆斑、光斑、气泡，唯一动起来的东西 | 能，一个 div |
| C 页面 | 玻璃与纸，同一个材质的两种含水量 | 能，换一套 token |
| D 图章 | 朱红落款，盖章入场一次 | 能，一个 span |
| E 鼠标 | 指针光斑与压按涟漪 | 能，整块删掉也不影响功能 |
五块之间只通过 CSS 自定义属性和固定的层叠次序说话，谁也不 import 谁。于是我修改背景的时候，不需要重新理解文章页；删掉鼠标特效的时候，也不用担心导航挂掉。
一个界面的可维护性，往往取决于"改一个地方要读几个文件"。
为什么最后选了玻璃
老实说，一开始是因为好看。玻璃会折射背后的颜色，页面一动，光就跟着流动，那种"活物感"是纯色卡片给不了的。
但真正让我决定的是另一件事：玻璃天然自带层次。
头像可以压在卡片上，卡片可以压在封面上，页头可以浮在内容之上。前后景关系一出来，界面就不需要靠边框和分割线去解释了——这正是我在旧版里最缺的东西。
玻璃的代价：它必须一直是"湿"的
问题在于，玻璃不适合读文章。正文后面永远有一片晃动的颜色，长段落读十分钟就想关掉。
所以我把同一块材质做成了两种状态：
- 入口页是玻璃：含水、透明、会反光，适合浏览和"哇一下"。
- 文章页是纸：抽干、不透明、只剩字，适合待很久。
这就是那句总纲——毛玻璃也是一种纸。不是两套风格，是同一块材料的含水量不同。
于是有了那个按钮
页头右上角有一枚小小的药丸按钮：💧 和 📄。
它不做主题切换，只做一件事：把当前页面从"湿"调到"干"，或者反过来。手选过一次之后，它会记住。
我知道这是个很小的功能。但当你亲手把一篇文章从玻璃里"抽干"、看着纸纹一层层浮上来的时候，你大概能明白我为什么愿意为它写那 300 字节。
接下来
站是新的，文章是旧的。我会慢慢把以前散在别处的东西搬过来，顺便把剩下的两块——图章和鼠标特效——再打磨一下。
如果哪天你觉得这里的字太小、玻璃太亮、或者动画太吵，欢迎直接告诉我。好界面是被抱怨出来的。