搭建这个站的记录：我的一套取舍

2026-09-12 · 约 1 分钟建站Astro

搭建这个站的记录

先把整条链路放进一张图——左边是我要维护的东西，右边是访问者看到的东西，中间全是自动的。

从内容到线上的构建流程

技术选型

选择 理由
Astro 作品集 + 博客混合场景最顺手，Markdown 即内容，默认零 JS
纯 CSS（无框架） 站点规模小，设计 tokens 集中在一处，改风格只动一个文件
静态输出 丢到任何静态托管都能跑，加载快、成本为零
字体自托管 不依赖第三方 CDN，国内访问不卡；中文字体按常用字子集化压到 1MB 级

目录结构

src/
├── config.ts           # 站点全局配置（站名、域名、导航）
├── content.config.ts   # 博客集合定义
├── content/blog/       # 文章（Markdown）
├── data/projects.ts    # 作品数据
├── layouts/Base.astro  # 全站布局 + 所有客户端脚本
├── components/         # 封面图形等组件
├── pages/              # 首页 / 作品 / 博客 / 搜索 / 关于 / 404
└── styles/             # 字体、主题 tokens、动效

设计约定

  • 暖白纸感底 #fbf9f5 + 陶土橙强调色 #c2703f，暗色走暖黑 #0e0e0c——同一套 tokens 驱动两种主题
  • 首页 10 秒讲清「我是谁、做过什么」
  • 内容优先：留白充足、动效克制、能不用 JS 就不用 JS
  • 文章用 Markdown 写，本地构建后同步到线上

之后想做的

  • 作品详情页：每个项目一个独立页面，方便单独分享
  • 自定义域名 + 国内节点加速
← 返回博客列表

评论