聊聊搭建静态博客网站的基础架构和技术栈

通常介绍静态博客搭建的教程专注于博客系统选择与网页文件托管，初学者难免一头雾水，难以实操。本文介绍了静态博客网站从撰写、上线到运维所使用的全套技术栈与基础设置，以此为索引，可以领略静态博客创作全貌。

文章撰写

Markdown 是一种轻量级标记语言，它以纯文本的形式编写，通过一些简单的符号和约定来实现文本的格式化和排版，比如标题、列表、链接、图片等。Markdown语法简洁易懂，便于阅读和书写，而且可以很方便地转换为html，或是植入html。在Markdown中编写公式也是非常方便的，可以看作轻量级的Latex，这点对技术博客而言是刚需。总之，任何人都能在十分钟之内熟悉markdown语法并提升写作效率，推荐使用。

vscode + git 文本编辑器方面，推荐微软免费开源的vscode搭配markdown插件，支持实时预览、编辑公式、插入图片和输出到文件，与静态博客框架无缝结合。版本管理工具（可选）使用git，记录修改日志，有问题随时回滚。

多媒体处理 博客中通常会使用图片和视频，为了加速加载和节约网络流量，对它们进行剪裁或压缩是很有必要的。这方面的工具推荐在《工具封神榜》中介绍的squoosh和ffmpeg。

静态网站生成器 用于将文本文件（通常是Markdown、HTML、CSS、JavaScript等）转换为静态HTML文件，从而创建一个完全由HTML、CSS和JavaScript组成的静态网站。它们的工作原理是将模板和内容文件组合起来，然后应用一系列规则和模板引擎，最终生成静态网页。如今流行的hexo、hugo等博客程序都属此类，由于被广泛使用，它们的美化主题、插件支持（可以实现动态功能）、文档教程资源都是非常丰富的，功能强大且易于使用。

域名、存储与分发

在本地完成博客撰写和网页生成后，下一步就是发布到互联网。早些年，尚需要自己购买服务器或是“虚拟主机”完成，但如今有更低成本和便捷的方式，就是从云服务商购买域名+对象存储+CDN。静态博客网站只是一系列静态文件，不需要服务器端处理。这也意味着它们可以轻松地托管在CDN（内容分发网络）上，从而实现全球范围的快速访问。

域名 首先为了方便访问，通常需要一个域名指向提供内容的服务器地址。访客的客户端会先从DNS服务器获取到域名所对应的真实ip地址，再对真实地址进行访问。虽然可以使用直接使用ip地址进行访问，但这就如同没有姓名，直接使用身份证号一样，而且不便实现负载均衡。

域名可以从域名服务商购买，值得注意的是，如果要使用国内服务器，必须购买限定后缀的域名并完成备案。在域名选择上，最常见的顶级域有.com/.cn/.net等，不过如今新顶级域(New gTLD) 也蓬勃发展，未被注册的空间更大。如视频网站Youtu.be，外卖送餐平台饿了么使用的ele.me，锤子手机使用的t.tt等创意域名让人耳目一新。这种将主体名称与域名后缀融为一体的做法又被称为Domain Hacking，如本站域名heth.ink是he+think组合而成。

另外，如果只是想新手尝鲜或是囊中羞涩，也有一些免费域名可选。Freenom免费提供顶级域名，但使用体验一言难尽。免费二级域名选择面就比较广了，如1996年开始由私人运营免费提供的eu.org后缀，申请地址，据小道消息部分大公司已将它视作是顶级域名。

获得一个域名后，下一步是添加域名解析。免费的dns服务商有许多，国内推荐dnspod（已被腾讯收购）。拥有域名之后，可以添加本域名和次级域名解析，如heth.ink是主域名，pan.heth.ink作为次级域名可以指向个人网盘。

对象存储 云对象存储系统可以将海量数据分布在多个物理设备上，允许用户从单个虚拟存储库有效地访问内容，是一种基础云服务。内容分发方面，直接将静态博客整个同步到对象存储，理论上就已经完成了。这一步可以编写简单脚本完成，以腾讯云COS为例，利用官方提供的上传工具进行同步：

#!/bin/bash

COS_CFG=.cos.conf
#上传至对象存储
coscmd -c $COS_CFG upload -rs --delete public/ / -y

CDN 即内容分发网络（Content Delivery Network），是一种通过位于全球不同地理位置的服务器网络，将内容（如文本、图像、视频等）高效地分发给用户的系统。 CDN通过在全球范围内分布的服务器，将网站内容缓存到离用户更近的位置，从而减少数据传输的距离。这样做不仅能提高网站访问速度，更为重要的是降低流量成本💰，与直接从对象存储读取文件相比，腾讯云CDN流量价格总是更低，缓存命中率较高时，通常可以降低一半以上。

由于对象存储和CDN都可以按量付费，且不消耗什么计算资源，在网站规模较小、访问较少的情况下，一个静态博客产生的费用几乎可以忽略不计。如果不想手动配置云服务，也有公司提供静态博客托管，更加方便，如GitHub Pages，Cloudflare Pages等。

运行维护

可用性监控 网站可用性可以使用DnsPod监控，在网站意外下线时，会触发短信报警提醒管理员。

性能分析 推荐在《工具封神榜》中介绍的PageSpeed Insight分析网页加载中可能的优化点。当然，在本地用Chrome浏览器分析加载工程中的网络流量，也是极为有效的。

数据分析 网站上线之后，有了浏览量，使用网站统计进行数据分析，可以形成正反馈，更好地促进创作。这方面可以选择全托管的百度统计/谷歌统计，不过更推荐自托管的开源统计项目如Matomo，把数据掌握在自己手中，而且能够获得更为详尽的分析。搜索引擎是个人博客的一大流量来源，因此分析搜索引擎侧的索引、展现、点击数据也是大有裨益的，如Google的站长管理平台。

总结

自2020年他思笔记序以来，笔者运营博客已近四年，几经兴废，技术更迭变迁，所幸如今依旧存续，流量平稳。衷心希望这篇技术总结能够帮助建站路上的读者，对静态博客技术全貌有所了解，少走弯路，为自己获取一立锥之地，也为互联网世界贡献更多知识。🎉