1. 开篇:为什么我建议你从0搭一个自己的技术博客
先说实话,我在CSDN、掘金这类平台都写过挺长时间的技术分享,也拿到过不少阅读量。但每写几篇就会碰到类似的尴尬:文章排版被平台模板限制得死死的,代码高亮风格固定没法调,想加个自定义的目录结构又改不了,甚至写得好好的文章还要被平台拿着去做SEO背书。更别提有些平台三天两头改版,今天移动端适配还好好的,明天就换了一套排版引擎,我辛辛苦苦调好的格式瞬间就乱了。
所以当我自己动手搭了一个个人技术博客之后,最大的感受是:技术写作这件事,终于回到了自己手里。域名是自己的,排版是自己的,数据也是自己的。今天这篇博文,我用一个不算太长但是足够完整的实操路径,分享我怎么从0到一个能稳定更新、能被搜索引擎收录、移动端阅读体验也还算不错的个人技术博客。这套方案对有写作习惯、想要沉淀内容、又不想被第三方平台套牢的开发者和博主来说,参考价值很高。
内容会覆盖:方案选型怎么考虑、域名和托管这两步怎么避坑、主题和配置怎么改、文章发布怎么形成一套顺手的工作流,以及最常见的踩坑点和排查方法。全程都是我自己操作过、验证过的路径,不是照抄官方文档那种写法。
2. 动手前想清楚:为什么不用现成博客平台,偏要自己折腾
2.1 第三方平台到底给你带来了什么限制
用现成平台写文章当然省事,注册完账号就能写,但这背后有几笔隐形账单你可能没仔细算过。
首先,内容所有权不在你手里。你写的文章存储在平台的服务器上,平台的规则一变,轻则给你文章限流,重则直接锁文或者下架。这几年我已经见过不少博主因为一些莫名其妙的原因文章被删,申诉流程极长,最后只能自认倒霉。自己搭博客之后,所有Markdown源文件都在自己的仓库里,文章先属于自己,其次才属于互联网。
其次是排版和表达上的自由。平台的排版组件就那么几种:标题几号字、代码块什么背景色、引用什么样式,都是写死的。而自己做博客,你完全可以把代码块的高亮风格换成自己喜欢的一套,比如夜间模式下拉出一套深色主题,阅读体验完全是另一个层级。
第三个层面是数据闭环。在平台写文章,你的访问量数据它们掌握得多,你自己看到的往往只是平台想让你看到的“阅读数”。自建博客接入流量统计之后,用户从哪里来、读了多久、在哪个段落跳出、手机端占比多少,这些都是自己说了算,是可以真正指导你调整写作方向的。
2.2 自建博客的成本评估:到底需要多少时间和钱
如果你还在犹豫“自己搭博客是不是太难了”,我先给你吃一颗定心丸:以静态博客方案来算,整个搭建成本低到超乎想象。
时间成本上,第一次上手,从零开始选工具、买域名、配置主题、部署上线,最开始可能花掉一个周末,差不多是6到8个小时。但当这套流程跑通一次之后,后续每篇文章的发布过程可以压缩到三分钟以内:写好Markdown → 推送仓库 → 自动构建部署,完事。
金钱成本方面,按最节省的方案算,一年可能只要几十块钱——如果你用国内的某些对象存储服务做托管,新用户优惠期可能一杯奶茶钱都用不到。
当然这里要说一句公道话:自建博客也不是全无代价。你得接受自己维护这件事,比如主题升级要关注、评论系统偶尔抽风、HTTPS证书要续期(现在大多数托管平台已经自动处理)。但只要不追求极其复杂的动态功能,这套方案的维护成本真的可以忽略不计。
2.3 平台和自建的定位差异:不是你死我活的关系
我自己现在采取的是“双轨制”:长文、系列教程、深度复盘,首发在自建博客;简短的技术笔记、碎片化的记录,顺手发平台。有些平台也能帮我带来一部分流量,这部分我并不排斥。所以我并不是劝所有人都彻底抛弃第三方平台,而是建议你把“能自己控制的渠道”先建起来,再去平台做分发。这个逻辑才是自建博客的核心价值所在。
3. 方案选型:技术栈和托管平台怎么选才不后悔
3.1 静态博客生成器怎么选:省心优先还是灵活优先
现在比较主流的技术博客方案大致分两类:一类是静态站点生成器(比如Hexo、Hugo、VitePress这类),另一类是直接用纯前端框架手搓。
我的建议非常明确:如果你是第一次搭博客,直接选静态站点生成器,不要一上来就自己写一套。静态生成器的核心逻辑,是把你用Markdown写的文章,在构建阶段直接生成一套纯静态的HTML页面。你不需要考虑数据库、不需要运维服务器,生成出来的就是一堆文件,放到任何静态托管平台上都能跑。
具体到选哪个生成器,要看你自己的语言习惯和上手成本。我用过比较多的是Hexo,因为它的主题生态很丰富,如果你不想自己折腾样式,装一个喜欢的主题就能用。而且它的插件机制做得很成熟,比如文章置顶、站点地图生成、RSS订阅这些功能都有现成方案。
如果你对性能有执念,可以试试Hugo,构建速度快得离谱,一个几百篇文章的站点几乎瞬间就能生成完。但Hugo的模板语法有点自己的一套风格,新手改起来可能需要适应一会儿。
如果是跟着Vue生态走的朋友,用VitePress也很顺手,写起来像在写Markdown文档一样,风格很现代,美中不足的是博客形态的细节定制需要更多动手能力。
3.2 托管和部署:不建议在这上面过度投入
说实话,静态博客天生就适合用对象存储或者静态托管这类服务,完全没必要去自己买一台服务器天天折腾。
我在实操中测试过几条路线,给你排个优先级:
第一梯队是使用代码托管平台的静态站点功能。你甚至可以不用花钱买服务器,把文章仓库推送上去之后,平台自动识别域名、自动配置HTTPS,整个过程顺手得不行。整个过程核心就是仓库地址、分支名称、构建命令这几个参数。想弄个性化域名就在DNS服务商那边加一条解析记录,非常稳妥。
第二梯队是对象存储服务加CDN加速。这种方案的好处是控制力更强,而且如果你博客受众主要在境内,访问速度会好一些。坏处是配置项更多,要熟悉存储桶、访问权限、CDN加速域名这一套概念,初次接触的人容易绕晕。
第三梯队是真正的云服务器。对纯静态博客来说,除非你有强烈的折腾意愿,否则我真的不建议走这条路。服务器安全补丁、环境配置、可用性保障这些事,每一样都在消耗你的业余时间。
3.3 域名选择:表面小事,实际影响几年的体验
域名是我的另一个经验重灾区,这块值得多说两句。
后缀的选择上,我只给你一个建议:尽量不要为了标新立异去选冷门后缀。我见过有人图便宜买了某个小国后缀的域名,结果微信里分享链接时被当成风险地址拦截,搜索引擎收录得也慢。技术博客比较稳妥的就是常见的几个通用后缀。
前缀的选择才是真正见功力的地方。最容易犯的错是选一个太长或者容易拼错的。你想想看,读者看了你的博客文章觉得不错,想直接在浏览器里输网址,结果因为域名太长打错了,这个流量就白白丢掉了。所以域名前缀尽量短,尽量和你的ID或者博客名一致,最好在3到6个字符之间。
另一个容易忽略的点是域名历史记录。买域名之前先去查一下这个域名有没有被注册过、有没有被搜索引擎处理过。买到一个被发过垃圾内容的域名,你后续的SEO起点就比别人低了一大截。
3.4 评论系统和统计工具:给博客装上“耳朵”和“眼睛”
一个技术博客如果没有评论入口,感觉就像一个人对着山谷说话没有回声。但自己搭博客,评论系统没法用现成的,需要找一个能外链进去的第三方评论服务。
这类服务的基本原理是,你在它的管理后台注册一个站点,然后把一小段配置填到博客的配置里,读者评论时内容会存储到第三方的数据库里,同时它会提供管理接口给你审核和回复。常见的开源方案有的是基于GitHub存储评论的,有的则完全依赖自己的服务器。实践下来,基于GitHub的方式对开发者更友好,评论数据都能在仓库里看到。
统计工具的选择我觉得比评论系统更重要。这里强烈建议你在第一天就把访问统计接好,否则等你写了上百篇文章之后再想统计历史数据,已经完全来不及了。选择统计工具的原则就两条:部署简单、数据可信。国内的一些统计服务对ICP备案状态有要求,如果你不打算备案,就要提前找不要求备案的替代方案。我这边的处理方式是接了一个支持个人站点的访问统计服务,具体选型你按自己的情况来。
4. 实操建站:从买域名到上线发布的完整流程
4.1 第一步:先把本地写作环境搭好
整条链路里,本地写作环境往往是新手最陌生的环节,其实它做起来非常简单,核心任务就三个:装好代码环境、全局安装静态生成器、创建一个空站点骨架。
拿我在用的Hexo举例,假设你的电脑上已经有代码运行环境,接下来就是一条命令安装Hexo命令行工具,然后初始化和启动本地服务。跑起来之后浏览器打开提示的地址,就能看到默认的博客页面。这一步的目的就是让你确认“文章能写、页面能出”,后续的个性化改造全部在这个基础上延伸。
创建文章的命令也很顺手,执行文章新建命令之后,它会在source目录下生成一个带日期前缀的Markdown文件。你只需要在这个文件里写正文,写完之后重新构建,文章就会出现在站点里。
4.2 第二步:选一个顺手的主题,别一上来就自己造轮子
主题选择的建议就一句:先装一个成熟的、更新及时的现成主题,把流程跑通,然后再考虑自定义。
如果你一上来就想自己写主题,很容易陷入调样式、调颜色、调间距的沙子里出不来,可能折腾两周都还没写出一篇文章。我最初就是直接用了一个社区里下载量靠前的主题,感觉整体设计很干净,代码高亮配色也比较顺眼,于是就直接用。后续我只改了几处CSS变量去调整焦点色和字体大小,这样就可以在不破坏整体布局的前提下,让博客有了一点点自己的风格。
主题装好之后有几个地方必须检查一下:文章页的目录树是否正常显示、移动端导航栏的展开收起是否自然、代码块在窄屏下是横向滚动还是换行。这些问题都直接影响读者的阅读耐心,尤其代码块在手机上换行会导致缩进错乱,是体验问题里的大忌。
4.3 第三步:写一篇标准的首发文章,别急着上线
在你正式上线之前,建议先用一篇测试文章把整个写作流程走一遍。这篇测试文章的目的不是内容本身,而是验证下面这几件事:
- 标题和标签在页面上的呈现效果
- 目录是否能根据标题层级自动生成
- 代码块的显示效果和复制按钮是否正常
- 文章内的图片能否正常加载
- 上一篇文章和下一篇的导航是否为空也不报错
测试文章可以随便写点记录性的内容,比如“第一篇技术博客诞生记”之类的都行。但一定要走一遍冷启动的流程,不要直接拿一篇几千字的长文来测试,否则出了问题定位起来很痛苦。
4.4 第四步:连接代码仓库,让推送自动完成部署
很多人把部署想象得很复杂,其实核心就两步。
第一步,在托管平台新建一个空仓库。第二步,把本地生成的静态文件推送到这个仓库。如果你用的托管平台有自动构建能力,那更省事:你把Markdown源文件推到仓库,平台自动安装依赖、生成页面、发布上线。全程用不着SSH登录服务器敲命令。
这一步我需要特别提醒一个非常容易踩的坑:静态文件目录和源码目录一定不要搞混。很多托管平台默认会识别特定的目录作为发布目录。如果你不小心把仓库的根目录当作网站目录发布出去了,别人就会看到一屏Markdown源码,而不是渲染后的博客页面。我自己就经历过一次这个尴尬,当时写完了直接推上去,打开一看全是灰色的代码文件,赶紧重新调整了平台里的发布目录设置才恢复。
4.5 第五步:配置自定义域名和HTTPS
域名和托管平台关联起来基本是填写一条解析记录的事。你在DNS服务商那边把子域名解析到托管平台提供的目标地址,等解析生效之后,在托管平台的后台填入你的域名,平台会帮你自动申请和配置HTTPS证书。
这里有一个先后顺序问题:一定要先把解析记录配置好,再去托管平台绑定域名,证书签发的校验逻辑需要验证你对这个域名的控制权。顺序反了,证书签发就会一直报错。
HTTPS配好之后,顺手做一件事:把站内所有资源的引用方式都改成相对协议或者HTTPS绝对地址,否则浏览器地址栏显示的是小锁加个感叹号,比较掉价。好在静态生成器一般都有全站资源链接处理的机制,你只需要在配置里开启就好了。
4.6 第六步:SEO基础配置,给搜索引擎递上敲门砖
自建博客发布之后,最现实的流量来源就是搜索引擎。但搜索引擎抓取新站点是需要时间和信号的,所以你在上线当天就应该把下面这些基础工作做完。
第一,确认站点地图文件正常可访问。站点地图是文章链接的清单,搜索引擎靠它来快速发现你所有的页面。静态生成器一般都有现成的插件来生成站点地图,部署好之后打开你的域名加上站点地图路径就能看到一堆XML格式的地址,这就是你的文章清单。
第二,提交给搜索引擎收录。主流搜索引擎都提供站长工具,你在里面添加站点、验证所有权,然后提交站点地图链接,剩下的就是等它来抓。
第三,检查每篇文章的基础SEO信息。重点是标题、描述和关键词。静态生成器通常会从文章顶部的元数据里自动读取这些内容并生成对应的HTML标签。你需要检查的是主题是否默认开启了这种关联,如果没有,就要手动在模板里改一下。
5. 写作工作流:让发一篇博客控制在“三分钟”以内
5.1 本地写作还是在线写作,我两种都试过
一开始我习惯直接在托管平台的后台线上编辑,但用了一段时间后发现体验一般:编辑器不支持的时候想插入一段带特殊缩进的代码就开始头疼,而且每次保存都要等平台响应,写作的节奏感会被打断。
后来我切换成本地写作的模式:在自己常用的文本编辑器里写Markdown,写完保存文件,然后在命令行里执行一条发布命令,把内容推送到仓库,托管平台检测到更新自动构建。这套流程的体验非常流畅,文本编辑器里所有的快捷键都可用,写完还能顺手做一次全文搜索,检查是否有遗留的乱码或者格式问题。
如果你的文章里图片比较多,我建议在文章中尽量使用相对路径引用图片,并把图片资源放在同一个文章目录下。这样整个文章目录搬家或者换平台的时候,都不用改任何链接地址。
5.2 Markdown的熟练度,直接决定你的写作效率
静态博客的所有内容都以Markdown为主,所以把几个写作中最常用的语法练到肌肉记忆,收益极大。标题层级、加粗、行内代码、代码块、链接引用、图片引用,这几种基本够覆盖90%的写作场景。
进阶一点的是表格语法和折叠语法。技术文章经常需要做个参数对照表、步骤对照表,Markdown表格虽然写起来稍微繁琐,但呈现效果比平台自带的编辑器还要清爽。折叠语法则适合放一些“点击展开源码”的场景,页面不会一上来就铺满代码,读者阅读体验更好。
我在写作中还会用一个小技巧:文章的目录结构尽量控制在三级标题以内。二级标题作为大章节,三级标题作为小节,不要无限往下去。这样目录树显示得干净,读者阅读时的逻辑脉络也更清晰。
5.3 文章元数据:这些细节能让你的博客更专业
每篇文章头部都有几条核心元数据,不仔细看可能觉得无所谓,但实际对阅读体验和SEO都有影响。
标题是我第一个建议花心思的地方。技术文章的标题不要过分追求“语不惊人死不休”,让读者一眼就明白文章要讲什么最重要。比如“从0搭建自己的技术分享博客”这类标题就合格,而“这么做,让你的博客一夜起飞”这种反而容易在搜索结果里让人失去信任感。
标签与分类是另一组重要元数据。我习惯每篇文章打两到三个标签,一个代表技术方向,一个代表文章类型,一个代表目标读者。分类则按照技术领域来划分,尽量不要设置超过五个分类,分类一多,读者在选择入口上就会被劝退。
发布时间和更新时间稍微麻烦一点,因为有些生成器默认只显示创建时间。建议你在主题的显示逻辑里把更新时间也加上,因为技术文章经常会因为版本迭代回来修订,读者看到更新时间能判断这篇文章的时效性是否还靠谱。
5.4 图片处理:给图片减减肥,页面加载才不肉
技术博客的图片主要分两种:截图和示意图。
截图最容易犯的问题是尺寸过大。有些人直接贴一张原始截图,好几MB,结果页面打开图片加载特别慢,尤其移动端直接卡住。我建议截图输出之前顺手压缩一下,控制在几百KB以内,视觉上几乎没有差别,但加载速度能快好几倍。
示意图建议合理利用批注和箭头,让读者一眼看清模块之间的关系。说实话,一张画得清晰的架构示意图,顶上大半篇文章的语言描述。画图工具不用多高级,能导出常用格式就行。
还有一个小坑必须提:图片仓库和博客仓库最好分开。如果你把图片直接放在博客仓库里,仓库体积会随着文章的积累越来越大,每次构建都要多出不少传输时间。我用的是对象存储加自定义图床的方式,图片上传后用外链引用,仓库始终保持轻盈的状态。
6. 上线之后的维护:收录、速度与内容沉淀
6.1 搜索引擎不收录怎么办:从被动等到主动找答案
这是自建博客最容易让人焦虑的一关。你辛辛苦苦把文章写好、部署上线,结果第二天、第三天去搜索自己的站点,一个页面都找不到,心里肯定犯嘀咕。
首先记住一个事实:搜索引擎对新站是有考察期的,几天到几周不等,这是正常现象,不代表你的配置有问题。加速收录的办法有几个实测有效的方向。
一个是让外部入口先进来。你可以去那些允许个人添加站点索引的社区或者目录站提交一下自己的博客地址,来源越多,搜索引擎的爬虫越容易通过外链发现你的站。
另一个办法是主动在站长工具里提交文章链接。有些工具提供手动提交单条链接的接口,你可以把每篇新文章的链接都提交一遍,比每次让爬虫自己去抓全站要直接得多。
还要排查一个非常隐蔽的问题:生成器默认生成的文章链接里如果带有中文路径或者特别长的参数,个别搜索引擎处理得不好,收录效率会明显下降。我建议在生成器里把文章链接格式改为“年份/月份/文章英文别名”的纯英文短链结构,收录体验会好很多。
解决办法也很简单。把各个常用社交平台和内容平台的分享卡片链接弄出来填进去,文章发布之后读者复制分享出去,卡片就能显示标题和摘要了。
6.2 页面加载速度:别让读者等你的图片转圈
自建博客的优势之一就是能精确控制加载资源的大小,这是平台博客很难做到的。平台博客页面里塞满了一堆与内容无关的脚本,加载速度完全看平台脸色;你自建的页面,完全可以做到只加载当前文章必需的资源。
实测下来,静态博客的速度优化有几个优先级的抓手。
第一优先是图片压缩和外链图床,这个前面已经说过,图片体积下来了,页面加载时间能砍掉一大截。第二优先是开启全站的资源压缩,包括HTML、CSS和JavaScript的压缩,静态生成器一般都有现成插件。第三优先是合理利用浏览器缓存,样式表和脚本文件设置一个较长的缓存时间,读者二次访问时基本上毫秒级打开。
页面速度这件事,不要只看自己网络快就觉得很快。你可以用在线性能测试工具模拟弱网环境测试一下,看看首屏内容和可交互时间这两项数据,如果都在可接受范围内,那真实用户的体验一般也不会差。
6.3 内容维护:你的博客需要“新陈代谢”
博客上线之后,真正的功夫不在搭建,而在持续更新和维护。有两点我觉得比技术选型更重要。
第一点是定时修订老文章。技术文章有时效性,一个命令的参数在新版本里变了,或者一个框架的推荐写法更新了,如果你不去修订,读者按老文章操作就会踩坑。我自己的习惯是每季度抽一个周末,把过去三个月的文章全部扫一遍,凡是涉及版本号、命令、依赖关系的地方,都核对一遍是否需要更新。
第二点是保持稳定的更新节奏。搜索引擎对新内容有偏好,你的站点如果三天打鱼两天晒网,收录和排名就会比较不稳定。反过来说,你每周固定写一篇,站点的活跃度信号就会持续积累。我建议量力而行,周更一篇长文或者双周一更,都比一个月猛烈更新十篇然后断更两个月更健康。
6.4 备份意识:再好的托管平台也不能替你保管一切
最后一件我想强调的事情是备份。很多人觉得代码仓库不就是天然备份吗?其实不然,仓库只备份了源文件,如果你的标题里的日期、内容里藏了个人信息、图片的原始文件没有同步,那仓库恢复出来的也只是残血版本。
我的备份策略比较朴素:源文件仓库固定推送托管平台,同时本地保留一份完整目录的压缩包,每季度更新一次。图片文件单独备份到另一处。这样即便托管平台整体出了问题,我也能从一个干净的存储介质里把整个博客恢复到任意一个历史节点。
7. 实操中踩过的五个坑,希望你能一步迈过去
7.1 发布目录搞混,辛苦布局全部白费
前面提过一次发布目录的问题,这里再展开讲讲为什么这么容易出问题。
静态生成器执行构建命令之后,会生成一个包含所有部署文件的目录,这个目录的名字根据生成器不同有差异。有些人在部署时把仓库根目录直接当成站点目录,导致网页全部乱套,CSS加载不出。正确的做法是,在托管平台的后台单独指定发布目录的设置项,让它指向生成器输出目录。不同托管平台的按钮位置不一样,但基本都有这个配置,细心找一下很快就能解决。
7.2 外部链接全部是相对路径的问题
早期的主题模板里,有些链接引用用的是相对路径,这会导致页面嵌套层级变化时,链接地址全部错乱。比如分类页里的文章链接点进去404,或者文章页里的CSS样式引到了错误地址。
解决办法是在生成器配置里替换URL为绝对路径,并确保配置项里的站点URL和你绑定的域名完全一致。这个配置项不加的话,后面换域名时所有链接都要大洗牌,是非常麻烦的连锁反应。
7.3 移动端代码块横向滚动失效
代码块在桌面端显示正常,但手机上出现两种坏情况:一种是代码块直接换行,缩进全部变形,根本没法看;另一种是不换行但整个页面被撑宽,页面两侧出现横向滚动条。这两种都是主题样式适配没做好。
正确做法是在样式里给代码块容器添加横向滚动属性,让代码在容器内部滚动,而不是撑开整个页面。如果你用的主题没有处理这个细节,建议先自己补上这段样式,属于花五分钟解决但能提升全体移动端读者体验的重要修补。
7.4 图标字体加载失败,只剩一排方框
部分主题依靠字体图标库来显示图标,而这类加载地址默认会访问公共CDN资源。如果CDN在你的网络环境里加载失败,页面上就会出现一排整齐的小方框,观感非常糟糕。
这类问题排查起来其实不复杂,先判断是字体文件加载失败还是样式类名没对上。最好的一劳永逸办法是,把图标字体文件下载下来放到本地,改成从自己的站点加载,相当于彻底不依赖外部地址。代价是仓库体积会略微增加,但换来的是加载稳定,这买卖划算。
7.5 文章链接变更之后旧地址全部失效
上线早期我经常调整站点目录结构和文章链接的格式,导致搜索引擎自收录的旧地址全部404。这对已经积累的权重是非常大的损伤。
更稳妥的做法是:链接格式在第一天就确定下来,之后只增不改。如果实在要改,一定要在原来地址上做跳转。实际上你在搜索引擎里看到的“页面权重”都是建立在具体地址上的,地址一换,之前积累的内容权重就要重新开始。
8. 最后分享几条我的真实体会
从平台写手转换到自建博客主,这个过程对我的影响比预期大得多。最明显的是写作心态的变化:以前在平台上发文章,多多少少会去琢磨平台的推荐机制,到底起什么标题阅读量更高,结尾是不是得加一句引导关注之类的,写着写着就变味了。而自建博客之后,文章就纯粹是自己的内容资产,得失心反而淡了,能专心把技术讲清楚这件事本身做好。
如果你打算动手搭,我给的建议是把“先上线、再优化”作为原则。目标定得太宏大反而容易卡在细节里出不来。先弄一个能写文章、能被访问的站点,哪怕简陋一点,也先把它跑起来。随着你写文章越来越多,你会越来越清楚自己真正需要的是什么功能,那时候再逐步调整主题、优化速度、打磨SEO,一切都水到渠成。
最后送你一个我后来才领悟到的技巧:写技术博客最大的收益者,其实是写作者自己。很多从前觉得已经懂透的内容,一旦落到纸面上逼着自己讲清楚来龙去脉,立刻就会发现理解里面的漏洞。从这个角度说,建站这件事早做一天,你的技术沉淀就能早一天开始。希望这篇分享能帮你少走几步弯路,早日拥有一个自己真正掌控的内容阵地。