个人网站搭建教程适合谁看?
这是一篇适合新手的个人网站搭建教程,核心目标是用 AI、GitHub 和 Cloudflare Pages 三步把一个静态个人网站真正上线。即使你不会写代码,也可以先让 AI 生成网页,再通过 GitHub 托管文件、用 Cloudflare 完成部署和访问发布。
开始前需要准备什么?
- AI 工具:ChatGPT、Gemini、Claude 都可以,用来生成网页代码和后续修改页面。
- GitHub 账号:用来托管网页代码,也方便保存每次修改记录。
- Cloudflare 账号:用来部署 Pages,并顺手完成全球分发和访问加速。
- 域名:有自己的域名会更方便,没有的话也可以先用平台分配的免费域名。
第一步:用 AI 生成个人网站页面
在个人网站搭建的第一步里,你最重要的能力不是写 HTML、CSS、JavaScript,而是把需求表达清楚。比如你可以直接告诉 AI:帮我做一个简洁的个人网站首页,包含头像、简介、联系方式、常用链接按钮,并顺手做好移动端适配。第一版不满意也没关系,继续告诉它你想改成什么风格,比如博客首页、个人名片页或者作品展示页,AI 很快就能继续迭代。
第二步:替换成你自己的内容
当 AI 先写出一个基础框架后,接下来要做的就是把内容替换成你自己的信息。视频里演示了如何替换 banner、avatar、姓名、简介和联系方式,并建议用 VSCode 配合 Live Preview 一边修改一边实时预览,这样会比直接用记事本改 HTML 轻松很多。
内容才是个人网站和博客的核心
框架搭起来只是开始,真正让个人网站有价值的始终还是内容本身。视频里继续演示了如何把基础信息喂给 AI,让它顺手帮你生成一篇文章详情页,再把首页链接过去;也就是说,后面你完全可以按同样的方法持续增加文章、页面和栏目。
第三步:上传到 GitHub 托管
对初学者来说,GitHub 是最稳妥也最省心的代码托管平台。你只需要把主页文件名改成 index.html,新建一个仓库,把网页文件和图片上传进去,再到仓库设置里开启 Pages,就能得到一个已经可以访问的网址。
第四步:接入 Cloudflare Pages 部署上线
虽然 GitHub Pages 已经能把页面发布出去,但再接入 Cloudflare Pages 后,网站的全球访问速度和分发体验通常会更好。视频里演示了如何在 Cloudflare 里连接 GitHub 仓库、点击保存并部署,以及如何使用 Cloudflare 自动分配的默认域名,或者继续绑定自己的自定义域名。
这套方案的优点和注意事项
1. 适用范围:更适合个人主页、作品页、展示站和轻量博客。
2. 首页命名:默认主页文件最好使用 index.html。
3. 域名生效:绑定自定义域后不一定立刻生效,等待一段时间属于正常现象。
4. 后续重点:网站真正要做起来,关键还是持续更新内容、优化结构和做好 SEO。
视频内容主线:
01. AI 生成个人网站首页
02. 本地替换图片与文案内容
03. GitHub 创建仓库并上传文件
04. Cloudflare Pages 部署与绑定域名