AI 幫你做網站前，先學會寫一份網站生成規格

在「想做自己的網站，不一定要先付錢：2026 免費建站的 4 種路線」文章中，我們整理過現在幾種不用先付費，也能建立網站或公開頁面的方法，其中，最容易也是最困難的方式，讓AI幫你做網站，為什麼這麼說? 因為只要一句提示詞，看起來就是最容易，例如：

現在則可以直接告訴 AI：「我想做一個個人品牌網站。」

但因為你沒有跟AI說清楚，它的想像空間很大，生成成果不一定是你想要的，那要說清楚，到底要說什麼，好像又變成最困難的。

如果連自己都還沒有想清楚要做什麼，AI 其實也只能猜。

結果很容易出現：

• 畫面看起來很完整，但重點不清楚

• AI 自己增加不存在的服務或內容

• 頁面很多，卻不知道希望訪客做什麼

• 每次修改一點，整個網站又跟著改

• 換一個 AI 工具，又要重新說明一次需求

所以，這篇文章來說說，AI 幫你做網站前，要先把這 5 件事整理清楚。

不要急著寫 Prompt，先把網站本身想清楚。

我會把 AI 建站想成兩個階段：

第一階段：把網站想清楚 ➡️ 第二階段：讓 AI 幫忙執行

而我們這篇先處理第一階段。

目錄

先定義：這個網站到底要完成什麼 不要先想「幾頁」，先想訪客需要知道什麼 告訴 AI：哪些事情不能自己亂補 視覺不要只寫「專業、有質感」 最後才想：網站到底需要哪些功能 實作｜和 AI 一起完成網站規則

---

1️⃣ 先定義：這個網站到底要完成什麼？

不要先想首頁要放什麼，也不要先找範本。

第一個問題是：

這個網站最重要的任務是什麼？

例如：

• 讓潛在客戶認識我的服務

• 展示作品

• 宣傳一場活動

• 介紹一項產品

• 整理個人品牌資訊

• 引導訪客購買課程

• 收集合作詢問

網站當然可以同時做很多事，但一開始最好先找出最主要的一件。

接著，再回答兩個問題。

主要給誰看？

例如：

品牌客戶、學生、一般消費者、粉絲，或第一次認識你的陌生訪客。

看完之後，希望他做什麼？

這就是網站最重要的 CTA。

例如：

• 聯絡合作

• 查看作品

• 填寫表單

• 前往課程頁

• 購買商品

• 訂閱內容

可以先整理成：

網站主要目的：
主要訪客：
最重要的 CTA：

光是把這三件事寫清楚，後面很多決定其實就會容易很多。

---

2️⃣ 不要先想「幾頁」，先想訪客需要知道什麼

假設今天要做的是一個自由工作者的個人品牌網站，可能會需要：

• 我是誰

• 我提供什麼服務

• 代表作品

• 合作方式

• 聯絡資訊

如果是活動網站，內容可能就完全不同：

• 活動是什麼

• 適合誰

• 時間與地點

• 活動內容

• 講師介紹

• 報名方式

這時候先不要急著決定：

「我要首頁、關於我、服務、作品、聯絡我五頁。」

因為很多網站最後其實用一頁就可以完成。

我反而很推薦先問：

如果整個網站只能有一頁，我會怎麼安排？

例如：

第一區｜Hero

先讓訪客知道這是什麼網站。

↓

第二區｜服務

說明可以提供什麼。

↓

第三區｜作品

提供實際案例。

↓

第四區｜合作方式

降低第一次聯絡的門檻。

↓

第五區｜CTA

引導訪客採取下一步。

這其實就已經是一份最基本的網站架構了。

---

3️⃣ 告訴 AI：哪些事情不能自己亂補

這件事在 AI 建站時非常重要。

因為 AI 為了把畫面「補完整」，很容易自己產生一些看起來很合理的資訊。

例如：

• 不存在的合作品牌

• 虛構的客戶評價

• 自己猜的價格

• 自己產生的服務項目

• 沒有根據的數字

• 不存在的聯絡資訊

如果只是做示意畫面，看起來可能沒什麼。

但網站一旦真的要公開，這些內容就會變成問題。

所以可以先建立幾條簡單規則：

沒有提供的真實資訊，不要自己杜撰。

例如：

• 不自行產生客戶名稱

• 不捏造合作品牌

• 不自行加入價格

• 不產生假的見證

• 沒有資料的地方先標示「待補」

• 可以協助整理文字，但不要改變原意

這些規則之後交給 AI 時，可以大幅降低「AI 自己幫你補太多」的情況。

---

4️⃣ 視覺不要只寫「專業、有質感」

另一個很常見的問題是：

幫我做得專業、有質感一點。

這句對人來說已經很抽象，對 AI 也是一樣。

你心中的「有質感」，可能是：

大量留白、低彩度、簡潔排版。

AI 想像的卻可能是：

漸層、玻璃效果、陰影、大動畫。

所以可以先把視覺方向整理得稍微具體一點。

例如：

整體風格：
乾淨、現代、親切，不要太企業感。

主要色系：
深青綠、白色、淺灰。

版面：
保留充分留白，不要塞入過多資訊。

圖片：
優先使用我提供的真實照片。

文字：
標題清楚，手機閱讀時也不能太小。

效果：
不要過度使用動畫與陰影。

不需要把它寫成完整的品牌規範。

只要能讓 AI 知道：

哪些方向可以走，哪些方向不要走。

就已經很有幫助。

---

5️⃣ 最後才想：網站到底需要哪些功能？

有些 AI 在生成網站時，會很積極地幫我們增加功能。

但功能愈多，不代表網站愈好。

所以最後可以把需求分成兩類：

真的需要

例如：

• 點擊導覽列可以移動到不同區塊

• 社群按鈕可以開啟外部網址

• 作品可以點擊查看

• 聯絡按鈕可以開啟表單

• 手機也能正常閱讀

目前不需要

例如：

• 不需要會員登入

• 不需要購物車

• 不需要資料庫

• 不需要後台管理

• 不需要複雜動畫

我很喜歡把「不需要」也寫進去。

因為這等於是在告訴 AI：

不要因為做得到，就什麼都幫我加。

---

實作｜和 AI 一起完成網站規則

前面我們已經整理過，一份網站生成規格至少要想清楚：

• 網站目的

• 主要受眾

• CTA

• 網站內容與架構

• 內容限制

• 視覺方向

• 功能需求

但實際開始做時，我並不建議打開一份空白文件，然後自己從第一欄慢慢填。

現在既然有 AI，其實更實際的方式是：

先跟 AI 討論，把網站需求一步一步釐清，最後再請 AI 幫忙整理成 Markdown 規格檔。

這樣不但比較容易開始，也可以利用 AI 幫我們發現原本沒有想到的問題。

可以分成以下幾個步驟：

Step 1｜先告訴 AI：現在不是要它做網站 Step 2｜讓 AI 一個問題、一個問題跟你討論 Step 3｜需要時，要求 AI 繼續追問 Step 4｜討論完成後，先不要急著產生 Markdown Step 5｜確認沒問題，再產生 website-spec.md

---

Step 1｜先告訴 AI：現在不是要它做網站

第一步很重要。

不要一開始就輸入：

幫我做一個網站。

而是先告訴 AI：

現在的任務是一起釐清需求，不是直接開始生成網站。

可以先這樣說：

我準備建立一個網站，
但目前還沒有整理成完整的網站規格。

請先不要開始製作網站。

請先像網站企劃與需求分析人員一樣，
和我一起把需求釐清。

請一次問我一個問題，
並根據我的回答判斷是否需要繼續追問。

我們需要逐步確認：
網站目的、主要受眾、CTA、
網站內容與架構、視覺方向、
功能需求，以及不希望出現的內容。

如果有我沒有想到的重要問題，
也請主動提醒我。

等需求確認完成後，
先整理成摘要讓我確認，
不要直接開始製作網站。

這裡的重點是：

先把 AI 從「執行者」變成「需求討論的夥伴」。

---

Step 2｜讓 AI 一個問題、一個問題跟你討論

接下來就可以直接回答 AI 的問題。

例如 AI 可能會問：

這個網站最主要的目的，是展示作品、介紹服務，還是希望訪客直接聯絡你？

你可以照自己的情況回答。

如果問題本身不知道怎麼回答，也不用硬想。

例如 AI 問：

這個網站最主要的 CTA 是什麼？

但你其實不確定，就可以直接反問：

我還不確定。依照前面整理的網站目的，你會建議我把哪一個動作設成主要 CTA？為什麼？

這也是我覺得使用 AI 討論需求很方便的地方。

我們不一定要事先知道所有答案。

有些事情可以先讓 AI 提供幾個選項，再從中判斷哪一個比較符合自己的需求。

---

Step 3｜需要時，要求 AI 繼續追問

如果某個回答還很模糊，也不要急著往下一題走。

例如你回答：

我想做一個個人品牌網站。

這其實還不夠。

AI 還可以繼續問：

• 這個品牌主要提供什麼服務？

• 網站最重要的訪客是誰？

• 希望訪客看完之後做什麼？

• 現在手上有哪些作品或素材？

• 是否已經有品牌色與視覺風格？

所以我在一開始的提示詞裡，會特別要求 AI：

必要時繼續追問。

目的不是把訪談弄得很複雜，而是避免重要資訊還沒說清楚，就急著進入網站製作。

---

Step 4｜討論完成後，先不要急著產生 Markdown

等 AI 覺得需求大致完成後，我還會多做一個步驟：

先整理成摘要給我確認。

可以直接說：

先不要產生最終規格檔。

請把我們目前確認過的網站需求，
依照下面幾個項目整理成摘要：

1. 網站目的
2. 主要受眾
3. 主要 CTA
4. 網站內容
5. 頁面／區塊架構
6. 視覺方向
7. 功能需求
8. 不需要的功能
9. 內容限制
10. 尚未確認的事項

請只整理我們已經討論確認的內容，
不要自行補充不存在的資訊。

這一步很重要。

因為如果需求有誤，現在修改只需要改幾行文字。

如果等到網站都生成完才發現：

「不是，我根本不是要做這種網站。」

那就要重來很多東西。

---

Step 5｜確認沒問題，再產生 website-spec.md

摘要確認完成後，最後才請 AI 把內容正式整理成 Markdown。

例如：

目前的網站需求已確認完成。

請根據我們剛剛確認的內容，
整理成一份完整的網站生成規格。

檔名請使用：

website-spec.md

請使用 Markdown 的標題層級與條列方式整理，
讓後續其他 AI 工具也能容易理解與執行。

至少包含：

1. 網站基本資料
2. 網站目的與主要受眾
3. 主要 CTA
4. 網站內容與頁面架構
5. 各區塊用途
6. 內容規則
7. 視覺方向
8. 功能需求
9. 不需要的功能
10. 已有素材
11. 尚待補充的資料
12. 其他限制

不要加入我們沒有討論或確認過的真實資訊。

尚未確定的內容，
請明確標示「待確認」。

完成之後，就會得到這次會員實作最重要的成果：

website-spec.md

---

這份 website-spec.md，就是後續 AI 建站的起點

到這裡，我們其實還沒有真正開始「做網站」。

但已經完成了一件很重要的事情：

把原本散落在腦中、對話裡的想法，整理成一份可以保存、修改，也可以交給其他 AI 使用的網站生成規格。

這跟一直把需求留在某一個 AI 對話視窗裡，有很大的差別。

之後即使換工具，也不用從頭重新解釋：

「我是誰、我要做什麼、我的網站要放哪些內容……」

而是直接拿出：

website-spec.md

讓下一個工具先讀懂這份規格。

先把規格做好，再開始生成網站

---

這篇會員教學，我們先停在這裡。

我們完成的是：

需求討論 → 需求確認 → Markdown 網站生成規格

下一個階段，才是真正把這份 website-spec.md 交給 AI 開始執行。

那時候就會進一步遇到：

• 怎麼把規格交給 AI

• 第一個執行指令怎麼下

• 第一版網站要做到什麼程度

• AI 做錯時怎麼修改

• 怎麼避免修改一個地方卻破壞其他區塊

• 手機版怎麼檢查

• 最後怎麼發布

這些就會進入真正的 AI 建站實戰。

而到了那個階段，我們不再只是討論：

AI 能不能做網站？

而是拿著這篇完成的 website-spec.md，真的讓 AI 把它做出來。