零成本部署：使用GitHub Pages搭建免费网站实战

一、环境准备与账号注册

在开始搭建免费网站之前，需要准备两个核心工具：Git版本控制系统和GitHub账号。GitHub Pages是GitHub提供的静态网页托管服务，完全免费且支持自定义域名，是个人博客或项目展示页的最佳选择。

1. 安装Git工具

Git用于将本地代码上传到GitHub服务器。请根据你的操作系统下载对应的安装包：

• Windows用户：访问 https://git-scm.com/download/win 下载安装包，安装过程中一直点击“Next”使用默认选项即可。
• Mac用户：打开终端，输入命令 git --version。如果未安装，系统会自动提示安装Xcode Command Line Tools，按照提示完成安装。
• Linux用户：使用包管理器安装，例如Ubuntu输入 sudo apt-get install git。

安装完成后，在终端（Windows为Git Bash）输入 git --version，若显示版本号则说明安装成功。

2. 注册GitHub账号

如果已有账号请跳过此步。访问 https://github.com/signup 填写用户名、邮箱和密码注册。请注意，注册时填写的用户名将作为你免费网站域名的一部分（格式为：用户名.github.io），建议简短且具有辨识度。

二、创建GitHub代码仓库

代码仓库用于存放网站的源代码。创建步骤如下：

1. 登录GitHub，点击右上角的“+”号图标，选择 New repository。
2. 在 Repository name 输入框中，必须输入 你的用户名.github.io。例如，你的用户名是“zhangsan”，则仓库名必须为 zhangsan.github.io。这是开启GitHub Pages用户主页的关键。
3. 将仓库权限设置为 Public（公开）。私有仓库无法使用免费版GitHub Pages服务。
4. 点击 Create repository 按钮完成创建。

三、编写网站源代码

在本地电脑新建一个文件夹，命名为 my-website。进入该文件夹，创建一个名为 index.html 的文件。这是网站的默认入口文件。将以下完整的HTML代码复制并粘贴到 index.html 中。这是一个包含响应式布局和基础样式的完整单页模板。

```html

欢迎来到我的个人网站

```

四、上传代码到GitHub

代码编写完成后，需要使用Git命令将其推送到GitHub仓库。请打开终端（或Git Bash），依次执行以下命令。请将命令中的“你的用户名”替换为你在GitHub注册的实际用户名。

1. 初始化本地仓库

在终端中进入你创建的 my-website 文件夹路径，然后执行：

```bash git init ```

此命令会在当前文件夹生成一个隐藏的 .git 目录，用于管理版本。

2. 添加文件到暂存区

```bash git add . ```

注意 add 后面有一个空格和点 .，表示将当前目录下所有文件添加进去。

3. 提交更改

```bash git commit -m "首次提交网站代码" ```

引号内的内容为本次提交的备注，方便日后查看历史记录。

4. 关联远程仓库

```bash git branch -M main git remote add origin https://github.com/你的用户名/你的用户名.github.io.git ``>

第一条命令将分支重命名为 main（GitHub当前默认分支）。第二条命令将本地仓库与刚才创建的GitHub仓库地址进行绑定。请务必确保URL地址正确无误。

5. 推送代码

```bash git push -u origin main ``>

执行此命令后，终端会要求输入GitHub的账号和密码（或Personal Access Token）。输入验证信息后，代码开始上传。当进度条达到100%且提示“done”时，说明上传成功。

五、启用GitHub Pages服务

虽然代码已上传，但还需要在GitHub后台开启Pages服务才能通过浏览器访问。

1. 进入刚才创建的GitHub仓库页面。
2. 点击顶部的 Settings（设置）选项卡。
3. 在左侧侧边栏菜单中，向下滚动找到 Pages 选项并点击。
4. 在 Build and deployment 下的 Branch 选项中，点击 None 或 > 图标。
5. 在下拉菜单中选择 main 分支，文件夹保持为 / (root)，然后点击 Save（保存）按钮。

保存后，页面顶部会显示一个黄色的进度条，提示“Your site is live”通常需要等待1到2分钟。刷新页面，直到看到提示框变为绿色，并显示一个URL地址。

六、访问与验证

打开浏览器，在地址栏输入 https://你的用户名.github.io。此时，你应该能看到刚才编写的网页内容。如果看到了“网站搭建成功！”的字样，恭喜你，你已经拥有了一个永久免费的互联网网站。

常见问题排查

如果访问显示404页面，请检查以下几点：

• 仓库名称： 确认仓库名是否严格为 用户名.github.io，多一个空或少一个字符都会导致失败。
• 文件名： 确认首页文件名为 index.html，全小写。
• 等待时间： GitHub Pages的部署有时会有延迟，最多等待10分钟后再试。
• 分支设置： 确认Settings -> Pages中选择的分支是 main 且已保存。

七、后续更新网站内容

当你需要修改网站内容时，只需直接修改本地 index.html 文件，保存后再次执行以下Git命令即可完成更新：

```bash git add . git commit -m "更新网站内容" git push ``>

由于之前已经执行过 git push -u origin main，后续更新可以直接使用简短的 git push 命令。等待约1分钟，刷新 https://你的用户名.github.io 即可看到最新内容。