ChatGPT Sites教學:用對話就能把網頁部署上線,全程沒寫程式碼

Vibe coding 的最后一公里是部署:ChatGPT Sites 让你用对话把 HTML 或点子发布成可分享网页,默认先私人上线并主动提醒个资风险,适合展示型与轻量互动型场景。

基本信息

  • 来源类型:文章(数位时代 · 《一天一AI》)
  • 原文位置:raw/articles/2026-07-18-092016-tg-cf2839.md
  • 原文 URLhttps://www.bnext.com.tw/article/91537/gdd37kufmda5u2gbzdgq
  • 作者:韋惟珊
  • 发布日期:2026-07-17
  • 消化日期:2026-07-18
  • 提取路径:raw/extracts/20260718-092056/bnext.com.tw/chatgpt-sites.md

核心观点

  1. 部署是 vibe coding 常见断层:做出 HTML/仪表板是一回事,真正放上网、可分享是另一回事;家人问「能传给我看吗?」把「本地能跑」与「可分享上线」的差距暴露出来。
  2. ChatGPT Sites 用对话完成部署:打开 ChatGPT(网页或桌面 App)→ 左侧栏选「网站」→ 拖入 HTML 或直接描述点子 → 输入「@Sites 把这个建立一个网站」,全程不必手写部署脚本。
  3. 默认私人上线 + 个资提醒是产品设计亮点:Sites 先做成仅自己可见的私人网页;案例中主动提醒「小孩出生月份」不宜公开,并给出三选项:维持私人、指定人分享、移除敏感信息后再公开。
  4. 门槛与禁区明确:至少需要 ChatGPT Plus 以上方案;禁止用于处理信用卡资料、金融交易等服务。
  5. 上线后仍用对话迭代:回到左侧「网站」找到该页,用自然语言改内容;分享对象、网页标题、自定义域名都可后续变更。
  6. 适配场景是展示型 / 轻量互动型:不需要登录系统、不串金流、内容不频繁变动——如数据分析仪表板、部门内部小工具、个人作品集、提案用 prototype。

实操内容保留

操作步骤

  1. 打开入口:ChatGPT 网页版或桌面版 App → 左侧栏选择「网站」。
  2. 提供素材:把已做好的 HTML 拖进对话;若没有 HTML,直接用自然语言描述点子,让它生成并部署。
  3. 触发部署:输入类似「@Sites 把这个建立一个网站」。
  4. 先私人确认:检查是否含机敏信息(生日、姓名、内部数据等);必要时要求移除个资或只开放给特定人。
  5. 再公开或限权分享:确认无敏感信息后再发布公开页,或维持私人 / 指定分享。
  6. 后续修改:左侧栏「网站」→ 点进对应网页 → 对话说明要改什么(内容、标题、分享对象、自定义域名等)。

代码/配置

(本文无独立代码块;部署通过 ChatGPT 对话与 Sites 托管完成。)

Prompt 模板

@Sites 把这个建立一个网站

请移除网页中的个人敏感信息(例如出生月份、真实姓名),确认已移除后再发布为公开网页。

请把这个网站改成只分享给特定人,并帮我调整网页标题 / 自定义域名。

关键概念

  • ChatGPT Sites — 本文主角:ChatGPT 内的对话式网页部署与托管能力
  • ChatGPT — 承载 Sites 的产品入口(网页 / 桌面 App 左侧「网站」)
  • Codex — 文中把 HTML 丢进对话/Codex 语境完成建站的执行侧
  • Vibe Coding — 部署被定位为 vibe coding 的最后一公里
  • 私人部署优先 — 先 private 再 public 的发布纪律(本文流程核心)
  • 展示型 / 轻量互动型网页 — Sites 的适用边界(无登录、无金流、内容相对静态)

与其他素材的关联

原文精彩摘录

這就 vibe coding 的常見難題:做出來是一回事,要真正放上網、可分享,又是另一回事,這個動作稱為「部署」。

一開始,ChatGPT 做成只有我能看的私人網頁。它提醒:裡面有小孩的出生月份,不建議直接公開。它給了三個選項:維持私人瀏覽、只開放給特定人(加入分享權限)、或拿掉敏感資訊後公開。

建議「展示型」和「輕量互動型」的網頁,不需要登入系統、不用串金流,內容不會一直變動。例如用 AI 跑出來的數據分析儀表板、幫部門做的內部小工具、個人作品集,或是你用 vibe coding 做出來想拿去提案的 prototype。

相关页面