Build a Free Website
免费建一个网站

GitHub Pages · Cloudflare · Google Sites

三种方法，零成本上线 — Three ways to launch, all free

Why Build Your Own Website? — 为什么要自己建网站？

🇨🇳 中文

你可以免费 build 一个真正的网站，拥有自己的 domain name、HTTPS，并且部署到全球 CDN，完全不用付钱。无论你想做 resume、作品集，还是给学生家长看的英语班介绍页，都可以。

🇬🇧 English

You can build a real website for free — with your own domain name, HTTPS, and a global CDN. Whether you want a personal resume, a portfolio, or a page introducing your English class to parents, you can do it without paying.

What Can You Host? — 可以放什么内容？

  • Personal portfolio / 个人作品集
  • Resume or CV / 简历
  • Class introduction page / 班级介绍页
  • Blog / 博客
  • Small business landing page / 小生意的宣传页面
  • Documentation site / 说明文档网站

限制 / Limitation: 这些方法只支持静态网页 — static pages（HTML、CSS、JavaScript、图片）。如果你需要数据库或 server backend（比如登录系统、留言板的存储），还需要其它服务。

Three Paths to a Free Website — 建免费网站的三条路

🇨🇳 中文

本教程介绍三种方法。先看你的需求，再选择最合适的：

🇬🇧 English

This tutorial covers three approaches. Look at your needs first, then choose the right one for you.

EASY · 最简单

🅰️ Google Sites

拖拽建站，不写代码 — Drag and drop, no code.

  • 5 分钟上线 / Live in 5 min
  • No code required / 不用写代码
  • Free Google subdomain / 免费谷歌子域名
  • URL: sites.google.com/view/yoursite
  • ❌ Limited design / 设计选择有限
MEDIUM · 中等

🅱️ GitHub Pages

真正的网页代码 — Real website code.

  • Need basic HTML / 需要一点 HTML 基础
  • Full design freedom / 设计完全自由
  • Free subdomain from GitHub
  • URL: username.github.io
  • Great for portfolios
PRO · 进阶

🆎 GitHub + Cloudflare

自己的域名 + 全球加速 — Your own domain + speed.

  • Custom domain / 自己的域名（约 $10/年）
  • Free SSL from Cloudflare
  • Global CDN / 全球加速
  • URL: yoursite.com
  • Professional look / 专业感觉

💡 Recommendation — 建议

中文： 第一次建网站？先用 Google Sites（路径 A）感受一下。学了一些 HTML 之后，转到 GitHub Pages（路径 B）。等你想要专业的自定义域名时，再加上 Cloudflare（路径 C）。

English: First time? Start with Google Sites (Path A) to get a feel. After learning some HTML, move to GitHub Pages (Path B). When you want a professional custom domain, add Cloudflare (Path C).

What You Need — 你需要准备什么

1. Email Account
电子邮件账号
Gmail, Outlook, QQ Mail — anything works. You'll need it for sign-ups and verification codes.
注册和接收 verification code 时都需要。Gmail、Outlook、QQ 邮箱都可以。
2. Web Browser
网络浏览器
Chrome, Firefox, Edge, or Safari. Latest version recommended.
Chrome、Firefox、Edge 或 Safari，建议用最新版本。
3. Text Editor (Path B+C only)
文本编辑器（只有路径 B、C 才需要）
VS Code (free) is best. Notepad on Windows works too for simple files.
推荐免费的 VS Code。简单的文件用 Windows 自带的记事本也行。
4. Domain Name (Path C only)
域名（只有路径 C 才需要）
Costs ~$10/year. Buy from Cloudflare, Namecheap, or Porkbun. Skip this if you're fine with the free subdomain.
大约 10 美元一年。可以在 Cloudflare、Namecheap 或 Porkbun 买。如果免费子域名够用，就不用买。

Path B: Free Hosting with GitHub Pages — 用 GitHub Pages 免费托管

🇨🇳 中文

GitHub 是全世界最大的代码 hosting platform。它有一个免费的服务叫 GitHub Pages，可以把你的 HTML 文件变成一个真正的网站。

🇬🇧 English

GitHub is the world's largest code hosting platform. It has a free service called GitHub Pages that turns your HTML files into a real website.

1 Create a GitHub Account — 创建 GitHub 账号

🇨🇳 中文

  1. 打开浏览器，访问 github.com
  2. 点击右上角的 "Sign up"（sign up）按钮
  3. 输入你的 email、password 和 username
  4. 用户名很重要！这就是你网址的一部分。比如用户名 liming，网站就在 liming.github.io
  5. 验证邮箱里的 verification code
  6. 选 "Free"（免费）方案

🇬🇧 English

  1. Go to github.com in your browser
  2. Click "Sign up" at the top right
  3. Enter your email, password, and username
  4. The username is important! It becomes part of your URL. If your username is liming, your site will be at liming.github.io
  5. Verify the code from your email
  6. Choose the "Free" plan

2 Create a New Repository — 新建一个仓库

🇨🇳 中文

登录后，点击右上角的 + 号，选 "New repository"（新建 repository）。

  • Repository name: 填 username.github.io（把 username 换成你的用户名）
  • Public: 必须选 Public（public）— 免费版只能用公开仓库
  • 勾选 "Add a README file" — 让仓库不空
  • 点击 Create repository

🇬🇧 English

After logging in, click the + at the top right, then "New repository".

  • Repository name: Type username.github.io (replace username with your real username)
  • Public: Must be Public — free GitHub Pages requires public repos
  • Check "Add a README file" so the repo isn't empty
  • Click Create repository

3 Add Your index.html — 上传 index.html

🇨🇳 中文

每个网站都需要一个 index.html 文件 — 这是网站的首页。

  1. 在仓库里点击 "Add file" → "Create new file"
  2. 文件名输入 index.html
  3. 把下面的代码复制粘贴进去（你可以改）
  4. 滑到底部点 "Commit changes"（commit 就是保存的意思）

🇬🇧 English

Every website needs an index.html file — this is the home page.

  1. Click "Add file" → "Create new file"
  2. Name the file index.html
  3. Paste the code below (feel free to edit it)
  4. Scroll down and click "Commit changes" (commit means save)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>My First Website</title> </head> <body> <h1>Hello, World!</h1> <p>This is my first free website.</p> <p>这是我的第一个免费网站。</p> </body> </html>

4 Enable GitHub Pages — 启用 GitHub Pages

🇨🇳 中文

  1. 在仓库页面点击 Settings（settings）选项卡
  2. 左边菜单选 Pages
  3. "Branch" 下拉菜单选 main，再选 "/ (root)"
  4. 点 Save（保存）
  5. 等 1-2 分钟，刷新页面，会看到一个绿色的提示：
    "Your site is live at https://username.github.io"

🇬🇧 English

  1. Click the Settings tab at the top of your repository
  2. In the left menu, click Pages
  3. Under "Branch," choose main, then "/ (root)"
  4. Click Save
  5. Wait 1-2 minutes, refresh the page. You'll see a green box:
    "Your site is live at https://username.github.io"

🎉 Done! — 成功了！

Open the URL in your browser. Share it with friends. You have a real website on the internet — for free.

在浏览器里打开网址。分享给朋友。你有一个真正的网站在互联网上 — 完全免费。

Path C: Custom Domain with Cloudflare — 用 Cloudflare 加自定义域名

🇨🇳 中文

有了 GitHub Pages 网站之后，下一步是把网址换成自己的，比如 mengli.com，而不是 mengli.github.io。这一步要花约 $10 一年买 domain name，但 Cloudflare 提供的 SSL（安全加密）和 CDN（加速）都是免费的。

🇬🇧 English

Once you have a GitHub Pages site, the next step is to use your own URL — like mengli.com instead of mengli.github.io. This step costs about $10/year for a domain name, but Cloudflare's SSL (security) and CDN (speed) are free.

1 Buy a Domain — 买一个域名

🇨🇳 中文

推荐在 Cloudflare Registrar（cloudflare.com/products/registrar）买，因为它按 at-cost price 卖 — 没有任何加价。

  • .com 域名 — 大约 $10/年
  • .net 或 .org — 价格类似
  • 避开 .xyz 之类的便宜域名 — 大公司的邮件服务器有时会把它们当 spam

其它选择：Namecheap、Porkbun、Google Domains（已停售，转 Squarespace）。

🇬🇧 English

I recommend Cloudflare Registrar (cloudflare.com/products/registrar) because it sells domains at-cost — with no markup.

  • .com domains — about $10/year
  • .net or .org — similar prices
  • Avoid cheap .xyz-type domains — corporate email servers sometimes treat them as spam

Alternatives: Namecheap, Porkbun, or Squarespace (formerly Google Domains).

2 Add Your Domain to Cloudflare — 把域名加到 Cloudflare

🇨🇳 中文

如果你的域名买在别处，要先把它"指向" Cloudflare 才能用 Cloudflare 的免费服务：

  1. 在 cloudflare.com 注册免费账号
  2. 点 "Add a Site"（添加网站），输入你的域名
  3. 选 Free 方案
  4. Cloudflare 会给你两个 nameservers（比如 ada.ns.cloudflare.com）
  5. 回到买域名的网站，把 nameserver 改成 Cloudflare 给的两个
  6. 等 5 分钟到几小时 — Cloudflare 邮件确认接管成功

🇬🇧 English

If you bought your domain elsewhere, you need to "point" it to Cloudflare to use the free services:

  1. Sign up for a free account at cloudflare.com
  2. Click "Add a Site" and enter your domain
  3. Choose the Free plan
  4. Cloudflare gives you two nameservers (like ada.ns.cloudflare.com)
  5. Go back to where you bought the domain. Change its nameservers to the two from Cloudflare
  6. Wait 5 minutes to a few hours — Cloudflare emails when it takes over successfully

3 Connect Cloudflare to GitHub Pages — 连接 GitHub Pages

🇨🇳 中文

在 Cloudflare 控制台，点你的域名 → DNS → Records（records）。添加这些记录：

TypeNameContent
CNAME@username.github.io
CNAMEwwwusername.github.io

然后回到 GitHub 仓库 → Settings → Pages → Custom domain，输入你的域名（比如 mengli.com）→ Save。

最后勾选 "Enforce HTTPS"（enforce HTTPS）。

🇬🇧 English

In the Cloudflare dashboard, click your domain → DNS → Records. Add these records:

TypeNameContent
CNAME@username.github.io
CNAMEwwwusername.github.io

Then on GitHub: repo → Settings → Pages → Custom domain, type your domain (like mengli.com) → Save.

Finally, check "Enforce HTTPS".

4 Set SSL Mode to "Full" — 把 SSL 模式设为 Full

🇨🇳 中文

在 Cloudflare → SSL/TLS → Overview，把模式选成 Full。

这样访问 https://yoursite.com 就是端到端加密的 — secure。

🇬🇧 English

In Cloudflare → SSL/TLS → Overview, set the mode to Full.

Visitors to https://yoursite.com now get end-to-end encryption — secure.

⏰ Patience — 耐心点

中文： DNS 改了之后，可能要等 5 分钟到 24 小时才会全球生效。喝杯茶，等一等。如果第二天还不行，再检查 nameserver 设置。

English: After DNS changes, it can take 5 minutes to 24 hours for the whole world to see them. Have a cup of tea and wait. If it still doesn't work the next day, check your nameserver settings.

Path A: Build with Google Sites — 用 Google Sites 建站

🇨🇳 中文

Google Sites 是最简单的方法 — 完全 不用写代码。你只需要把模块拖来拖去，加上文字和图片。适合：

  • 第一次建网站
  • 想要快速做一个英语班的介绍页
  • 个人简历或 portfolio
  • 给学生分享 resources 的页面

🇬🇧 English

Google Sites is the simplest way — no coding at all. You just drag blocks around and add text and images. It's great for:

  • First-time website builders
  • Making a quick page for your English class
  • A personal resume or portfolio
  • A page to share resources with students

1 Open Google Sites — 打开 Google Sites

🇨🇳 中文

  1. 在浏览器里打开 sites.google.com
  2. 用你的 Gmail 账号登录（如果没有，免费注册一个）
  3. 点击右下角的 +（创建新网站）— 选 "Blank"（空白）模板，或选一个现成的模板

🇬🇧 English

  1. Open sites.google.com in your browser
  2. Sign in with your Gmail account (or create one free)
  3. Click the + button at the bottom right to create a new site — choose "Blank" or pick a template

2 Edit the Page — 编辑页面

🇨🇳 中文

右边是工具面板，你可以加：

  • Text box — 文字框
  • Images — 图片（可以从电脑上传或 Google Drive）
  • Embed — 嵌入 YouTube 视频或地图
  • Buttons — 按钮
  • Layouts — 现成的版式

点击页面上任何地方就可以编辑。和用 Google Docs 一样简单。

🇬🇧 English

The right panel has tools you can add:

  • Text box — for words
  • Images — upload from your computer or Google Drive
  • Embed — paste in a YouTube video or map
  • Buttons — clickable links
  • Layouts — ready-made section designs

Click anywhere on the page to edit. It's as simple as using Google Docs.

3 Add More Pages — 添加更多页面

🇨🇳 中文

右边面板顶部有三个标签：Insert（插入）、Pages（页面）、Themes（主题）。

  • 点 Pages → + 加新页面
  • 常见的页面：About（关于我）、Contact（联系方式）、Resources（资源）、Blog
  • 主菜单会自动更新

🇬🇧 English

The right panel has three tabs at the top: Insert, Pages, Themes.

  • Click Pages → + to add a new page
  • Common pages: About, Contact, Resources, Blog
  • The navigation menu updates automatically

4 Choose a Theme — 选一个主题

🇨🇳 中文

点右边的 Themes（主题）选项卡，挑选一个颜色和字体风格。可以随时换 — 内容不会丢。

🇬🇧 English

Click the Themes tab on the right, then pick a color and font style. You can change it anytime — your content stays.

5 Publish the Site — 发布网站

🇨🇳 中文

  1. 点右上角的 "Publish"（publish）按钮
  2. 设置 URL：sites.google.com/view/your-name — 选一个简短好记的名字
  3. 选 "Anyone can find and view"（任何人都可以搜索并查看）
  4. 点 Publish
  5. 分享网址给朋友

🇬🇧 English

  1. Click the "Publish" button at the top right
  2. Set your URL: sites.google.com/view/your-name — pick a short, memorable word
  3. Select "Anyone can find and view"
  4. Click Publish
  5. Share the URL with friends

💡 Custom Domain on Google Sites — Google Sites 也可以用自定义域名

中文： Google Sites 也支持自定义域名（比如 mysite.com），但需要在 Settings → Custom domains 里设置。这是 G Suite / Google Workspace 的功能 — 个人账号可能需要做 domain verification。

English: Google Sites supports custom domains too (like mysite.com), set up in Settings → Custom domains. It's a Google Workspace feature — personal accounts may need to do domain verification first.

Side-by-Side Comparison — 三种方法对比

Feature / 功能 Google Sites GitHub Pages GitHub + Cloudflare
Difficulty
难度		⭐ Easy / 简单⭐⭐ Medium / 中等⭐⭐⭐ Advanced / 进阶
Coding required
需要写代码		❌ No / 不需要✅ Yes (HTML) / 需要 HTML✅ Yes (HTML) / 需要 HTML
Cost
费用		$0$0~$10/year (域名)
URL
网址		sites.google.com/view/nameusername.github.ioyoursite.com
Design freedom
设计自由度		⭐⭐ Limited / 有限⭐⭐⭐⭐⭐ Total / 完全⭐⭐⭐⭐⭐ Total / 完全
Setup time
设置时间		5 min15 min30-60 min
Custom domain
自定义域名		✅ (with verification)✅✅
HTTPS / SSL
加密		✅ Auto / 自动✅ Auto / 自动✅ Auto + global CDN
Best for
适合谁		Beginners, classroom pages / 新手、班级页Students learning HTML / 学 HTML 的同学Professional sites / 专业网站

Useful English Phrases — 实用英语句子

"I want to build a free website."— "我想建一个免费网站。"
"How do I sign up for GitHub?"— "怎么注册 GitHub？"
"What is a domain name?"— "什么是域名？"
"My website is live!"— "我的网站上线了！"
"How do I add a custom domain?"— "怎么加一个自定义域名？"
"I need to update the DNS records."— "我需要更新 DNS 记录。"
"It's not working — what should I check?"— "不行 — 我应该检查什么？"
"Did the changes go live yet?"— "更改已经生效了吗？"

Glossary — 词汇表

Repository / repo 🔊
仓库 / 代码库
A folder on GitHub that holds your project's files and history.
GitHub 上保存项目文件和历史的"文件夹"。
Commit 🔊
提交（保存更改）
Saving a change to a repository, with a note describing what changed.
把一次改动保存到仓库里，附带一段说明。
Branch 🔊
分支
A separate line of work in a repository. The default branch is usually "main".
仓库里独立的一条工作线。默认分支通常叫 "main"。
Domain Name 🔊
域名
The human-friendly address of a website, like example.com.
网站好记的地址，比如 example.com。
DNS 🔊
域名解析系统
The phone book of the internet — turns domain names into computer addresses (IPs).
互联网的电话簿 — 把域名翻译成计算机的 IP 地址。
Nameserver 🔊
名称服务器
A server that tells the world which DNS records belong to your domain.
告诉世界你的域名有哪些 DNS 记录的服务器。
CNAME 🔊
CNAME 记录
A DNS record that says "this name is an alias for another name." Used to point your domain to GitHub Pages.
一种 DNS 记录，表示"这个名字其实是另一个名字的别名"。把域名指向 GitHub Pages 时用。
SSL / TLS 🔊
加密协议
Encrypts the connection between visitors and your site. The reason URLs start with https://.
给访问者和网站之间的连接加密。网址前面 https:// 就是它的功劳。
CDN 🔊
内容分发网络
A network of servers in many cities that caches your site, so visitors load it from a nearby server (faster).
遍布全球城市的服务器网络，缓存你的网站，访问者从近的服务器加载（更快）。
Static Site 🔊
静态网站
A site made of fixed HTML/CSS/JS files (no database). Fast, secure, and easy to host for free.
由固定的 HTML / CSS / JS 文件组成的网站（没有数据库）。快、安全、容易免费托管。
Subdomain 🔊
子域名
A prefix on a domain, like blog.example.com or www.example.com.
域名前面的部分，比如 blog.example.com 或 www.example.com。
Publish 🔊
发布
To make your site visible on the internet. The opposite of "draft" or "private."
让你的网站对互联网可见。和"草稿"或"私密"相反。

Quick Checklist — 检查清单

Path A · Google Sites — 谷歌网站

Path B · GitHub Pages — GitHub 托管

Path C · Custom Domain via Cloudflare — 用 Cloudflare 加自定义域名

You can do this. — 你可以做到。

Pick one path. Follow the steps. In 30 minutes you'll have a real website on the internet.

选一条路。按步骤来。30 分钟后，你就有一个真实的网站在互联网上。

Home / 首页 Thai Version / 泰语版