type
Post
status
Published
date
Jun 1, 2019 13:52
slug
summary
手把手教你用 GitHub Pages 免费部署静态网站：从注册 GitHub 账号、创建专属仓库、发布网页，到购买自定义域名、配置 DNS 解析与 CNAME 绑定，涵盖完整流程与常见踩坑点。
tags
Git
Infrastructure
category
DevOps
icon
password
wordCount
1586
你有一个精心打造的静态网站，却只能在本地localhost上孤芳自赏？GitHub Pages 就是那张免费的"互联网入场券"——零服务器、零运维、零费用，把你的代码仓库直接变成一个全球可访问的网站。本文将带你从注册 GitHub 账号开始，一路走到绑定自定义域名，完成你的第一次"上线仪式"。
本文你将学到：
- GitHub Pages 是什么，以及它能帮你做什么
- 如何从零创建一个 GitHub Pages 仓库并发布网页
- 如何购买域名并绑定到你的 GitHub Pages 站点
- 域名解析与 CNAME 的那些坑
什么是 GitHub Pages
简单来说，GitHub Pages 是 GitHub 送给每位开发者的免费礼物——一个可以托管和发布静态网页的服务。
你只需要把 HTML、CSS、JS 文件推到一个特定的仓库里，GitHub 就会自动帮你把它变成一个可以通过浏览器访问的网站。没有服务器要配置，没有流量要担心（当然，别拿它当 CDN 用就好）。
适用场景： 个人博客、项目文档、作品集展示、简历页面……只要是静态内容，GitHub Pages 都能搞定。如果你需要后端逻辑，那它就爱莫能助了——毕竟它是"静态"页面服务，不是云服务器。
注册 GitHub 账号
如果你已经有 GitHub 账号，请直接跳到下一节。没有的话，跟着来，三分钟搞定。
- 打开 GitHub 官网，点击注册
- 填入用户名、密码、邮箱，然后完成机器人验证（证明你不是爬虫，虽然你可能写过爬虫）
- 选择账号类型。个人免费版完全够用——毕竟 GitHub Pages 本身就是免费的
- 问卷调查环节，可以直接跳过，GitHub 不会因为你跳过问卷就不给你用
- 去邮箱里找到验证邮件，点击链接完成验证。恭喜，你现在是 GitHub 的一员了
创建第一个仓库
账号有了，接下来要创建一个专门用于 GitHub Pages 的仓库。这一步有个关键命名规则，请务必留意。
- 登录后，点击页面右上角的 + 号，选择 New repository
- 点击新增仓库
- 输入仓库信息。这里有两个必须遵守的规则：
- 仓库名必须是
username.github.io（把username替换成你的 GitHub 用户名）
- 仓库必须设置为 Public（私有仓库使用 GitHub Pages 需要付费）
填好后点击 Create repository。
- 进入仓库页面后，点击 Settings（设置）
- 向下滚动找到 GitHub Pages 区域。只有以
username.github.io命名的仓库才会出现这个选项。点击显示的链接即可访问你的站点——默认首页是仓库中的README.md或index.html文件
- 因为现在仓库里只有一个
README.md，所以页面长这样——朴素，但它活着！
- 接下来，把你的静态网页文件推送到这个仓库，你的网站就上线了 🎉
绑定自定义域名
username.github.io 虽然能用，但总觉得差点意思——就好比你开了一家店，门牌号却是别人的。要让你的网站看起来更专业，你需要一个自己的域名。购买域名
域名由 ICANN 统一管理，国内可以通过各大云服务商购买。腾讯云经常有域名打折活动，价格相当友好。
- 进入 腾讯云官网，注册账号后点击域名特惠
- 挑一个你喜欢的域名，如果名字被占了就换个名字或后缀。
.com最经典，.cn最便宜，.dev最极客——看你的预算和品味
支付成功后，进入域名解析控制台。
配置域名解析
这一步的目标是：告诉全世界的 DNS 服务器，你的域名指向 GitHub Pages 的服务器 IP。
首先，打开命令行，ping 你的 GitHub Pages 地址拿到 IP：
拿到 IP 地址
185.199.109.153 后，回到腾讯云域名解析器，添加一条 A 记录指向这个 IP。
实名认证
非顶级域名（如
.cn）需要实名认证才能使用；顶级域名则需要备案。进入 腾讯云域名管理器 完成认证。
认证成功后，刷新 域名解析器 页面，状态正常即可。
仓库端配置
回到 GitHub 仓库，进入 Settings → GitHub Pages，在 Custom domain 栏填入你的域名并保存。
保存后，GitHub 会自动在仓库根目录生成一个
CNAME 文件，里面记录着你的域名。
踩坑预警： 这个
CNAME 文件只存在于远程仓库。如果你本地项目里没有这个文件，每次 push 代码时它就会被覆盖删除，域名绑定随之失效。解决办法： 把 CNAME 文件复制一份到你本地项目的根目录，和代码一起提交！总结
步骤 | 内容 | 关键点 |
1. 注册 | 创建 GitHub 账号 | 邮箱验证 |
2. 建仓库 | 创建 username.github.io 仓库 | 必须 Public，命名格式固定 |
3. 发布 | 推送静态文件到仓库 | 默认首页为 index.html 或 README.md |
4. 域名 | 购买域名 + DNS 解析 + CNAME 绑定 | 本地保留 CNAME 文件防覆盖 |
GitHub Pages 是每个开发者踏入"建站"世界的最低门槛——零成本、零运维、五分钟上线。它不能替代真正的服务器，但作为个人博客、项目文档、作品展示的载体，它已经绰绰有余。
下一步？你可以试试用 Hexo、Hugo 或 Jekyll 这类静态站点生成器，配合 GitHub Pages 实现自动化部署，让你的博客工作流更加丝滑。