🌐 从零开始搭建你的个人博客:使用 GitHub Pages 免费部署静态网站
在互联网时代,拥有一个属于自己的网站不仅是一种展示方式,更是一种技术能力的体现。今天我们将一步步学习如何通过 GitHub Pages 搭建一个免费的个人博客或简历网站。零基础也完全没问题!
✨ 为什么选择 GitHub Pages?
- 免费! 不花一分钱就可以部署你的个人网站。
- 稳定! GitHub 背靠微软,服务可靠。
- 速度尚可:虽然是国外网站,但国内访问速度也不错。
- 随时迁移:即使未来 GitHub 无法访问,迁移到 Gitee(码云)等国内平台也轻而易举。
🛠 准备工作:注册 GitHub 账号
- 打开 GitHub 官网,点击右上角的
Sign up
注册新账号。 - 填写以下信息:
- 用户名(建议个性化些,因为它会出现在你的网站地址中)
- 邮箱
- 密码
- 邮箱验证:GitHub 会给你的邮箱发送一封验证邮件,请点击确认链接完成激活。
📌 注意:注册过程中 GitHub 可能会问你一些使用习惯的问题,随意选择即可,不影响后续使用。
📦 创建你的第一个代码仓库(Repository)
这个仓库将作为你网站的“家”。
-
登录 GitHub,点击右上角头像 ->
Your repositories
->New
创建新仓库。
-
仓库命名格式必须为:
你的用户名.github.io
- 例如你的用户名是
leo
,那么仓库名就填leo.github.io
- 例如你的用户名是
-
可选择勾选“Add a README file”,方便初始化仓库。
-
点击 “Create repository” 完成创建。
✍️ 创建主页文件:index.html
-
进入你刚刚创建的仓库。
-
点击 “Add file” -> “Create new file”。
-
文件名必须是
index.html
,因为浏览器默认访问的是这个页面。
-
在编辑框里输入你的网站内容,例如:
<html><head><title>我的个人主页</title></head><body><h1>你好,欢迎来到我的GitHub主页!</h1><p>这是我第一个静态网站~</p></body> </html>
-
填写提交说明,点击 “Commit new file”。
🚀 部署网站到 GitHub Pages
接下来,我们就要把这个网站“发布”到互联网上了!
- 打开仓库主页,点击上方的
Settings
。
- 在左侧菜单中找到 “Pages”。
- 在 “Build and Deployment” 部分:
- Source:选择
Deploy from a branch
- Branch:选择
main
或master
(视你创建仓库时选择的分支而定)
- Source:选择
- 保存设置。
🌐 查看你的网站
几分钟后,你就可以通过浏览器访问你的网站啦!
✅ 访问规则说明:
- 如果你的用户名和仓库名一致(即你创建的是用户主页):
-
仓库名必须是:
你的用户名.github.io
-
访问地址是:
https://你的用户名.github.io
-
例如,如果你的用户名是
leo
,访问地址就是:https://leo.github.io
-
- 如果你创建的是其他仓库(项目站点):
-
仓库名不是
用户名.github.io
,而是其他名字,比如blog
、resume
等; -
那么访问地址是:
https://你的用户名.github.io/仓库名
-
例如你的用户名是
leo
,仓库名是blog
,那么访问地址是:https://leo.github.io/blog
-
📌 说明:用户主页(User Page) 和 项目主页(Project Page) 是 GitHub Pages 的两种不同的部署模式。只有当仓库名严格等于“你的用户名.github.io”时,才会被识别为用户主页。
🔁 如果以后 GitHub 被墙了怎么办?
不用担心!你已经掌握了部署静态网站的核心方法:
- 你可以选择将代码迁移到国内的代码托管平台,比如 Gitee(码云)。
- 这些平台同样支持静态页面托管,只需稍作调整。