关于
我是且远，写前端与设计之间的东西。这个博客叫「合者离之始」——相聚是离散的开始，所以记录值得留下的部分。
这里主要写三类内容：
- 工程笔记：构建、部署、性能、类型系统
- 设计观察：排版、界面、动效，以及它们为什么有效
- 阅读随笔：读完一本书之后想说的话
Now
最近在做的事（会不定期更新）：
- 把这个博客的视觉语言重做了一遍，主题是《尼尔：自动人形》的档案界面
- 在读《设计中的设计》和《The Design of Everyday Things》
- 在整理一套自己用的前端性能检查清单
Colophon
这个站点是用以下东西搭起来的：
| 项目 | 选择 |
|---|---|
| 框架 | Astro 7（静态输出） |
| 语言 | TypeScript |
| 样式 | SCSS，自建设计令牌 |
| 高亮 | Shiki（构建时高亮，客户端 0KB） |
| 转场 | 原生 View Transitions API |
| 字体 | Manrope + EB Garamond（自托管子集），中文用系统字体 |
| 评论 | Waline（按需加载，可关闭） |
| 部署 | 阿里云 ESA Pages |
设计原则
- 正文优先。所有视觉决定都不能牺牲可读性。
- 一种颜色。全站只有米色、墨色，加一个警示用的橙红。
- 靠字重和浓度分层，不靠颜色堆砌。
- 动效只动
transform和opacity，不做会让文字发虚的缩放。 - 不加载任何中文 webfont——系统字体已经足够好。
性能预算
- 首屏 CSS ≤ 25KB
- 首屏 JS ≤ 20KB
- 字体 ≤ 100KB
- 正文对比度 ≥ 7:1
如果你在这个站点上发现任何排版、可访问性或性能问题，欢迎告诉我。