Colophon

最后更新 2026-06-30

这一页记录本站的设计选择、字体与构建过程。

🎨 设计

本站追求一种"工程师手稿"的质感：

• 配色：象牙白 #FAF9F5 作为底色，#C46D4E 陶土色作为强调色，参考旧纸张和工程笔记本的视觉
• 排版：衬线字体（ui-serif）作为标题，等宽字体（ui-monospace）作为 meta 与代码 — 强调"技术文档"而非"杂志"
• 节奏：1.55–1.7 行高，clamp 字号 38–62px 标题，避免大字号过冲

🔤 字体

• 标题：ui-serif, Georgia, "Times New Roman", Times, serif（系统衬线优先）
• 正文：system-ui, -apple-system, "Segoe UI", Roboto, ...（系统字体，避免 FOUT）
• 代码：ui-monospace, "SF Mono", Menlo, Monaco, Consolas

🏗️ 构建

• 静态站点生成：Jekyll 4.3.3
• 主题：Minima 2.5（被深度覆盖）
• 插件：feed / sitemap / seo-tag / redirect-from / last-modified-at / minifier / paginate
• 资产管线：单文件 SCSS 编译为 style.css，无 JS 打包（直接内嵌或外链 CDN）
• CI：GitHub Actions（5 个 workflow）

♿ 可访问性

• WCAG 2.1 AA 目标
• 键盘导航：所有交互元素可达，:focus-visible 视觉提示
• 读者工具：字号缩放、高对比度、减少动效（见左下角工具栏）
• 520+ <object> 标签均有 aria-label（信息图描述）

📊 性能

• 首页 JS：< 50KB（Mermaid 按需懒加载）
• CSS：单文件，gzip 后约 15KB
• PWA：Service Worker 离线缓存（首屏 + 静态资源）
• 全站 OG 图自动生成（1200×630）

🙏 致谢

• Jekyll — 简洁而强大的静态站点生成器
• Plausible — 隐私友好的轻量分析
• GitHub Pages — 免费的静态托管
• Giscus — 基于 GitHub Discussions 的评论系统

📜 许可

本站所有原创内容采用 CC BY-NC-SA 4.0 许可协议。 代码片段采用 MIT 许可。