建站记录：从默认模板到像素风博客
这篇算是博客的开篇，记录它从一堆默认文件变成现在这个样子的全过程。没有教程性质，就是一份给自己看的施工记录。
起点：只有皮，没有骨架
最初它只有 Hexo 的默认骨架：一个官方主题的壳子，配置里的站点描述是一串乱码，一篇文章都没有。
更麻烦的是主题本身——它其实是一份写死的单页 HTML，上栏、样式、内容全塞在一个文件里，不管你点哪个链接，出来的都是同一页。也就是说，那时候的博客只有”皮”，没有”骨架”。
先把骨架搭起来
第一件事是把主题拆开，改成”外壳 + 各页面内容”的结构：一个文件负责整站共用的上栏和脚本，另外几个分别负责首页列表、文章详情、独立页面和归档页。这样才谈得上”点进去看文章”。
顺手修掉了配置里的乱码，把站点标题换成自己的。
功能一个个加上来
骨架立住之后开始往里填东西：
- 深浅色切换：颜色收敛成两套变量，点一下整站换色，选择记在浏览器里，刷新不会闪白
- 全文搜索：搜索框接的是构建时生成的全文索引，标题和正文都能搜到
- 时间排序：列表可以按时间正序或倒序排，切换时卡片会平滑滑到新位置，而不是瞬间跳过去
- 关于页：做成了个人名片的样子——圆形头像、自我介绍、邮箱和项目卡片
中间踩过一个坑：一篇文章都没有的时候，首页是空白的。原因有点绕——Hexo 在零文章时干脆不生成首页文件，而自带的那个空页面又会抢占根路径。最后保留了一个内容为空、但指定了首页模板的占位文件来解决。
给自己加戏：一个物理彩蛋
功能齐了之后开始折腾彩蛋：两秒内连点六次主题按钮，会有一堆图从屏幕顶上掉下来，落在地上堆成一堆；十秒后地板”消失”，所有东西一起塌落出屏幕。
这个效果改了四版：
- 手写物理——图片直线下落、碰到就停，落地像焊死一样
- 加了重力和旋转，但堆出来还是像搭积木
- 直接接了物理引擎，每张图是真正的刚体，有质量、弹性、摩擦，碰撞由引擎解算，堆出来的形状每次都不一样
- 加上”软糖”形变——撞上去会沿碰撞方向被压扁，然后像果冻一样弹回来
让页面动起来
接着是一堆动效，核心想法是”别让页面硬邦邦地跳”：
- 手机上左右滑动，可以在文章列表和关于页之间切换；桌面端用键盘左右方向键走同一套逻辑
- 页面之间切换时，内容从侧边滑入
- 列表卡片滚进视口时依次向上归位
- 点开文章时，卡片的位置和尺寸会被交给下一个页面，一块同色的矩形从卡片大小连续放大到铺满整屏，新页面接住这个全屏状态再揭开内容——看起来就像卡片长成了页面
最后一个是文字：打开文章时，字先以乱码出现，再按从左到右、从上到下的顺序逐个还原，像一道扫描线扫过去。
换了字体
整站换成了像素字体，中文和英文都是点阵字形。字体是按 Unicode 区块切成很多小文件存放的，浏览器只会下载当前页面实际用到的分片，不会一次全拉下来。
现在它在哪
现在它有：能发文章的多页面结构、深浅色、全文搜索、时间排序、个人名片页、一整套页面动效，还有一个物理引擎驱动的彩蛋。
骨架结构、每个文件的职责、各个功能的参数，都写进了三份文档（README、STRUCTURE、DEVLOG），方便以后回来改的时候不用重新读一遍代码。
下一步大概是把内容写起来。技术笔记、课程记录、折腾过的小项目都可以往里放——博客的价值终究在于里面写了什么，而不在于它长什么样。