这是 NEWZERO 的主站,也是一次"把东西做到最少"的练习。
目标
市面上个人站模板很多,但大多有两个问题:一是信息密度太低,一屏只有一句口号;二是堆了太多动效,读起来累。
我想要的是:信息清楚、排版有性格、加载足够快。
做了什么
- 视觉系统:纸感底色 + 墨黑 + 一点朱红,衬线做大标题、等宽做标签,三套字体层级撑起整个站。
- 手写构建脚本:Markdown 进,静态 HTML 出,同时生成 RSS 和 sitemap,没有任何前端框架。
- 暗色模式:跟随系统,也可以手动切换,状态存在本地。
- 细节:作品卡悬停反色、标题描边、旋转圆环、入场动画,全部尊重
prefers-reduced-motion。
结果
- 首屏 HTML + CSS + JS 合计不到 40KB;
- Lighthouse 性能、可访问性、SEO 都在 95 以上;
- 新增一篇文章 = 新建一个
.md文件。
好的个人站不该让人赞叹技术,而该让人记住人。