凌晨建立的小站

2026 年 8 月 27 日凌晨，我开始搭建这个属于自己的小站。那时夜已经很深，城市逐渐安静下来，而我仍在电脑前整理想法、配置环境、调整页面。建站并不是为了追逐某个热门模板，也不只是为了拥有一个链接，而是想给自己的文字、学习记录、生活片段和偶尔冒出的灵感留一个稳定的地方。

本站取名为“乌托邦”。它不意味着这里必须完美，恰恰相反，我更希望它是一块可以不断试错、持续生长的私人空间。以后这里会记录技术学习、个人日志、阅读与工具，也会收录那些值得回头再看的时刻。

从默认页面开始，到确定站点名称、整理栏目、设计左右侧栏，再到补充音乐、分类、标签和归档，每一步都很小，但这些小步骤共同组成了本站的第一次上线。此刻的页面或许还不够成熟，不过它已经拥有了自己的样子，也拥有了继续更新的起点。

前端技术介绍

本站采用静态博客架构，核心生成工具是 Hexo。文章使用 Markdown 编写，Hexo 在构建时读取文章、页面和主题配置，将内容生成可以直接访问的静态 HTML 文件。这样的方式结构清晰、加载轻量，也方便把写作和页面开发分开维护。

页面结构与模板

• HTML：由 Hexo 和主题模板共同生成，负责组织文章、导航、侧栏、归档和各个页面的语义结构。
• EJS：主题使用 EJS 作为模板语言，将站点配置、文章数据、分类标签等内容注入页面，减少重复的 HTML，并让侧栏菜单和统计信息可以自动更新。
• Markdown：文章正文使用 Markdown 编写，能够自然地表达标题、段落、引用、列表、链接和代码块。

样式与视觉呈现

• CSS：负责页面的排版、颜色、间距、响应式布局和交互状态。
• Stylus：主题的主要样式源文件使用 Stylus 编写。它让嵌套选择器和主题样式的组织更简洁，最终由 Hexo 编译为浏览器可以识别的 CSS。
• 响应式设计：页面针对桌面端和移动端分别处理布局，在较窄的屏幕上调整侧栏、文章和内容区域的排列方式，让手机访问也保持基本的阅读体验。
• 字体与图标：正文和界面文字使用系统字体回退方案，侧栏座右铭使用宋体；菜单和功能区域使用 iconfont 图标字体，保持界面简洁。

页面交互与内容增强

• JavaScript：用于页面交互、返回顶部、加载状态及其他动态行为。
• jQuery：为部分 DOM 操作和事件处理提供基础支持。
• PJAX：通过 jquery.pjax 在页面之间进行局部切换，减少重复加载公共页面内容，让浏览体验更加连贯。
• Prism 与 Highlight.js：为文章中的代码块提供语法高亮，便于阅读不同编程语言的示例。
• APlayer：用于提供站内音乐播放功能，让阅读之外也保留一点声音和陪伴。

发布与托管

本站生成的静态文件通过 Hexo 的 Git 部署能力推送到 GitHub Pages，仓库与网站内容保持同步。更新文章或样式后，只需要重新生成静态文件并部署，就可以让线上页面获得最新内容。这种发布方式流程简单，也方便记录和维护每次修改。

感谢

感谢 Hexo、EJS、Stylus、jQuery、PJAX、Prism、Highlight.js、APlayer 和 GitHub Pages 等项目提供的技术支持。正是这些成熟、开放的工具，让一个凌晨开始的想法能够很快变成可以访问、可以书写、也可以不断完善的网站。

也感谢所有贡献开源代码、编写文档、回答问题和分享经验的人。每一份公开的知识都在降低后来者的实践成本，而本站正是站在这些积累之上开始的。

这只是乌托邦的第一天。愿这里有持续更新的文字，有认真做过的事情，也有多年以后回望时仍然觉得值得的记录。