學習中心/工具進階·6 分鐘

AI 能幫我做網頁或小工具嗎?

// 一句話回答

可以,而且門檻比你想像的低。你用日常中文把需求講清楚,AI 就能幫你生出一頁能用的網頁或小工具(例如報價計算機、活動報名表、產品目錄),你不用會寫任何一行程式。它適合做「內部用、規模小」的東西,正式對外上線前仍要人幫你看過。

先講結論:AI 能做到什麼程度

如果你完全沒寫過程式,可以把 AI(人工智慧,這裡指像 Claude、ChatGPT 這類能聽懂人話、幫你產生文字與程式碼的對話工具)想成一位「隨叫隨到、打字很快的工程實習生」。你用中文描述想要什麼,它就把對應的網頁程式碼寫出來給你。

它特別擅長這類東西:單頁的小工具(例如報價計算機、貸款試算、BMI 計算)、簡單的表單(活動報名、意見回饋)、一頁式介紹頁(產品或活動的 landing page,也就是「落地頁」,指訪客點連結後第一眼看到的那一頁)。這些做起來又快又像樣。

但要先誠實說清楚界線:AI 幫你生的是「初版」,不是「保證能上線營運的成品」。牽涉到收錢、會員登入、儲存大量客戶資料的系統,複雜度高、又有法律與資安風險,這種就不建議自己靠 AI 一把梭,該找懂的人一起。

用一個生活比喻理解整件事

做網頁這件事,很像請人幫你裝潢一間店面

以前的流程是:你要找設計師(畫外觀)、找工班(實際施工),一來一往好幾週,還要看得懂設計圖。現在有了 AI,比較像你直接跟一位「看得懂設計圖、又會施工的萬能師傅」講話:你說「我要一個淺色系、放三張產品照、右下角有一個『加 LINE 詢問』按鈕的頁面」,他當場就把樣品間搭給你看,不滿意再改。

關鍵差別在於:你不需要懂建材和工法,你只需要把『想要的樣子』講清楚。這就是為什麼非技術背景的人現在也做得出東西——瓶頸從「會不會寫程式」變成「講不講得清楚需求」。

實際上有哪幾種做法(由淺入深)

同樣是「請 AI 做網頁」,依你想投入的程度,有三條路:

  • 最無痛:對話裡直接生一頁預覽。 有些 AI 產品能在對話視窗裡直接把成品「畫」出來讓你即時看到、即時互動(這種即開即用的成品塊,Claude 稱為 Artifacts,可想成 AI 幫你現場搭好的樣品間)。你不用安裝任何東西,適合做給自己或同事內部用的小工具。
  • 進階:AI 幫你生出完整檔案,再放上網。 AI 產生一個 index.html 檔(網頁的原始檔案,副檔名 .html 就是網頁),你把它上傳到免費的網頁代管服務(幫你把網頁檔案放到網路上、讓它有公開網址的服務,很多都有免費方案)就能有一個真正的網址。這步會碰到一點點技術操作,但都有現成的圖文教學可照做。
  • 最深:用會下指令的 AI 開發工具。 例如 Claude Code(一種在終端機裡運作、能直接幫你建立與修改整個專案檔案的 AI 工具,終端機就是那個黑底白字、用打字下指令的視窗)。這條路能做比較完整的網站,但學習曲線較陡,通常是有點基礎或願意花時間鑽的人才走。

照著做:從零產一個小工具的步驟

假設你是一間清潔公司的老闆,想要一個「坪數→報價」的線上計算機給客人自己試算。你可以這樣做:

  • 第一步,把需求講具體。 不要只說「幫我做報價工具」,要說清楚欄位與規則。例如:「請做一個單頁網頁計算機,讓使用者輸入坪數,我的計費是每坪 NT$X,滿多少坪打九折,最後顯示總價,介面用中文、手機也要好按。」
  • 第二步,貼給 AI 並要求它直接產出成品。 提示詞(prompt,就是你打字給 AI 看的那段指令)範例:「你是前端工程師(負責做網頁畫面的工程師),請用一個 HTML 檔做出上面的計算機,樣式簡潔、字大一點、按鈕明顯,直接把完整程式碼給我。」
  • 第三步,看預覽、用白話回饋修改。 不用改程式碼,直接說「數字再大一點」「加一個『重新計算』按鈕」「顏色換成綠色系」,它會改給你新版。
  • 第四步,決定要不要上線。 只給自己用,存成檔案本機打開即可;要給客人用,就上傳到網頁代管服務拿到網址。
  • 第五步,務必人工驗算。 自己拿三、四組真實坪數手算一次,對照工具算出來的數字是否一致——這步不能省。

非做不可的三個查核點(新手最容易踩的雷)

  • 數字與邏輯一定要親自驗證。 AI 有時會「一本正經地算錯」(這種現象叫幻覺,指 AI 產生看似合理但其實不正確的內容)。凡是計算、報價、稅率、折扣,上線前務必用真實例子手動對過,錯一個數字對生意就是真實損失。
  • 別把敏感資料直接餵給它。 做客戶名單、報價這類工具時,範例資料請用假的(例如「王小明、0900-000-000」),不要把真實的客戶個資、成本、內部售價貼進對話。要用真資料時,先做去識別化(把姓名、電話、公司名等能認出是誰的部分換掉或遮掉)。
  • 別假設它做的東西自動安全、自動合規。 AI 生的表單若要收集個資,你仍要負責隱私政策與資料保護;牽涉金流、會員密碼的功能,別自己土法上線,找專業的人看過。工具是你的,責任也是你的。

對中小企業與創業者的實際意義

過去做一個小工具或活動頁,你得外包、排隊、等報價,一個簡單需求可能拖兩週、花好幾千甚至上萬。現在你能在一個下午、幾乎零成本做出堪用的初版,這對資源有限的小公司是實質的解放。

更重要的是它改變了『驗證想法』的速度。有個生意點子想試水溫?你可以先自己生一頁報名頁丟到市場上,看有沒有人填,再決定要不要認真投入——而不是一開始就砸錢請人做。這種「便宜快速試錯」的能力,以前是有技術團隊的公司才有的特權。

務實的定位是:把 AI 生成的東西當『內部工具』和『快速原型』來用最划算。真正要對外營運、規模化、碰錢碰個資的系統,AI 幫你把初版和溝通成本壓低,但最後一哩仍值得找專業把關。你省下的不是『不用專業』,而是『不用為每件小事都動用專業』。

常見問題

我真的完全不用會寫程式嗎?那 AI 生出來的程式碼我看不懂怎麼辦?

做簡單的小工具,你確實不用看懂程式碼。你只要負責「講清楚需求」和「檢查成品對不對」,程式碼交給 AI 就好,就像你不用懂引擎原理也能開車。只有當你想做更複雜的網站、或要自己排查問題時,懂一點基礎才會有幫助。

AI 做出來的網頁怎麼變成一個真的網址讓別人打得開?

AI 生的通常是一個網頁檔案(`.html`)。要有公開網址,需把它上傳到「網頁代管服務」,其中不少有免費方案。這步會碰一點技術操作,但網路上有很多圖文教學可照著做;不確定時,也可以直接請 AI 一步步教你怎麼上傳。

這樣做要花錢嗎?會不會做一做突然被收費?

生成內容本身通常包含在你用的 AI 方案裡;把網頁放上網,也有免費額度的代管服務可用,小工具的流量多半用不完。要留意的是流量很大、或用到進階功能時才可能產生費用。實際方案與價格請以各家官方最新公告為準,動手前先看清楚免費範圍。

AI 做的東西可以直接拿去做正式生意、跟客戶收錢嗎?

小型的內部工具或活動頁可以,但牽涉收款、會員登入、儲存大量客戶個資的系統就不建議自己一把梭。這類東西有資安與法律責任,建議把 AI 生的當「初版」,正式上線前找懂的人看過。責任最終在你身上,別假設它自動安全合規。

延伸閱讀

想讓整個團隊真的會用 AI?

我把自己經營公司在用的 AI 實戰,做成企業內訓 —— 帶團隊用真實任務當場做出成果。

看企業 AI 內訓