本文整理自 2026-09 公開資料,含 moon-d / leaderweb / gcreate / creatop 等多家來源。實際費用依各家專案範圍評估,建議至少拿 3 家報價單比對。
客製化網站跟套版差在哪裡?先確認你的需求落在哪一邊
業主第一次找設計公司,常常聽到「客製化網站」這 5 個字,但設計公司跟業主腦中的定義可能天差地別。本文陪你拆解 6 個關鍵流程階段,從需求訪談、資訊架構到驗收上線每一步都點出來。具體工期與費用依各家專案範圍評估,本文只給流程框架,不會寫「3 個月保證上線」。
有些業者口中的「客製」,實際上是套版加換圖片、改顏色;有些說的「客製」是從資訊架構到視覺到開發全部從零開始。兩者的工時、費用、維護方式完全不同——報價單上同樣寫著「客製化網站」4 個字,可能 5 萬成交,也可能 80 萬才做得到。
本文是 Pillar 1: 網頁設計完整決策指南 的一部分,Pillar 1 涵蓋 30 篇文章,從業主「該不該做網站」「怎麼選設計公司」「怎麼抓費用」「怎麼簽合約」到「怎麼維護」的完整攻略。
業主在找廠商之前,真正要回答的問題只有 3 個:客製化跟套版的界線在哪裡?什麼情境值得選客製?怎麼跟設計公司溝通才不會踩雷?
客製化網站的 6 個關鍵流程階段
從需求訪談到上線後維運,完整的客製化流程包含 6 個階段。每個階段都有具體的交付物,不應該被跳過或合併。
業界普遍看到的狀況是:流程被壓縮,交付物就會跟著縮水。
階段 1:需求訪談與範圍界定(1-2 週)
這個階段的目的,是要讓業主跟設計公司對齊「要什麼、不要什麼」。
典型交付物包含需求訪談紀錄(1-2 份文件)、競品分析報告(3-5 個競品網站)、初步資訊架構(IA)草圖。
同業之間常聽到的慘案是這樣的:業主為了趕時間,直接跳過訪談進設計稿。結果設計做到一半才發現漏了會員系統、後台權限、多語系——這些當初沒講清楚的東西,最後都變成追加項目的理由。
階段 2:資訊架構與使用者流程(1-2 週)
這個階段定義網站的骨架——有哪些頁面、每頁放什麼、訪客怎麼從 A 頁走到 B 頁。
交付物包含完整 IA(每頁標題、內容簡介)、使用者流程圖(User Flow)、線框稿(Wireframe)。
業界常見的問題是設計公司直接交「精美設計稿」,沒有先做 wireframe。業主看到漂亮的視覺,反而無法判斷資訊架構合不合理。等上線後才發現「這個功能找不到」「那個流程要走 3 層」,重做的成本比當初做 wireframe 高出好幾倍。
階段 3:視覺設計(2-4 週)
設計師根據 IA 畫出完整視覺稿,工具通常是 Figma 或 Sketch。
交付物包含全頁設計稿(Desktop + Mobile)、設計規範文件(Design System:顏色、字體、間距)、互動原型(Prototype)。
踩坑模式:業主直接從 wireframe 跳到前端開發,跳過設計稿 review。開發完成才說「我以為的設計不是這樣」——這時候改設計,等於前面 4 週的開發工時作廢。
階段 4:前端 + 後端開發(4-8 週)
把設計稿變成真的能跑的網站。
交付物包含可運行的 staging 環境、原始碼(Git 管理)、API 文件。
業界常見的雷:業主根本不看 staging,直接同意上線。結果上線當天發現按鈕失效、表單送不出去、手機版排版全跑掉——這些 staging 早就看得到的問題,只是沒人點開來看。
階段 5:測試 + 上線(1-2 週)
確保網站在不同瀏覽器、不同裝置都能正常運作。
交付物包含跨瀏覽器測試報告(Chrome / Firefox / Safari / Edge)、響應式設計測試報告(Desktop / Tablet / Mobile)、效能測試報告(PageSpeed Insights / Lighthouse)、安全性驗證(SSL、WAF、基本滲透測試)。
業界看過太多這種狀況:設計公司只測 Chrome 跟 Desktop,業主用 Safari 或手機開,layout 整個跑掉。測試覆蓋率不夠,等於沒測。
階段 6:維護 + 優化(持續)
網站上線不是結束——需要持續維護、SEO 優化、內容更新。
交付物包含月度維護報告(主機狀態、流量、錯誤率)、SEO 報表(排名、流量、轉換)、內容更新建議。
同業最常聽到的抱怨:設計公司上線後就「斷線」,業主遇到問題找不到人,或是要修一個小 bug 報價貴得離譜。
客製化網站必備的 5 份交付文件
從簽約到驗收,業主應該拿到 5 份交付文件。少一份,後續爭議的機率就高一分。
文件 1:需求訪談紀錄
這份文件記錄「業主說過的話」——避免日後出現「我以為是這樣」「你以為是那樣」的羅生門。
必含項目:
- 業主業務性質
- 目標客群
- 必需要有的功能
- 不要的功能
- 預算範圍
- 時程期望
文件 2:完整 IA(資訊架構)文件
記錄網站有哪些頁面、每頁有什麼內容——避免日後爭論「為什麼這頁沒有那個功能」。
必含項目:
- 全站頁面清單(URL、標題、簡介)
- 每頁的內容區塊(hero / 服務 / 案例 / CTA 等)
- 內部連結結構
文件 3:視覺設計稿(完整版)
不是「幾張示意圖」,要是全站所有頁面的設計稿。
必含項目:
- Desktop + Tablet + Mobile 三種尺寸
- 所有頁面的設計稿
- 互動狀態(hover、active、focus)
- 設計規範(Design System)
文件 4:原始碼 + 部署文件
必含項目:
- Git repository 連結(業主有 read access)
- 部署流程文件
- 環境變數文件(.env.example)
- 維護手冊
文件 5:驗收測試報告
必含項目:
- 跨瀏覽器測試截圖
- 響應式測試截圖
- 效能測試結果(LCP、INP、CLS)
- 安全性測試結果(SSL、WAF)
- 已知問題清單 + 修復時程
挑選客製化網站廠商的 4 個實務判斷
判斷 1:設計公司是否做完整 6 階段?
有些設計公司只做「設計 + 前端」,跳過 IA 與測試階段。短期看起來省錢,長期會出問題。
實務做法:直接問設計公司「你們的流程包含 IA + 測試嗎?」如果回答「IA 是另外報價」「測試算售後服務」——要提高警覺。
判斷 2:能否提供「過去案例 + 客戶回饋」?
值得信賴的設計公司通常有完整案例庫 + 客戶見證,不是只有一句「請參考我們的官網」。
實務做法:問設計公司「能不能提供 3 個過去客戶的聯絡方式?我可以打電話問他們的真實感受?」如果設計公司不願意給,通常代表案例不真實。
判斷 3:合約有沒有「驗收標準」與「保固」?
好的設計公司合約會寫清楚:
- 驗收標準(哪些項目完成算驗收通過)
- 修改次數上限(例:3 輪修改)
- 保固期(例:上線後 3 個月 bug 免費修)
避坑重點:合約只寫「做一個客製化網站」——太模糊,後續爭議空間大。
判斷 4:有沒有「SEO 整合」?
客製化網站的最大附加價值,就是從 IA 到 Schema 結構化資料都能客製。如果設計公司不做 SEO 整合,客製的價值會少掉一大半。
實務做法:問設計公司「你們的客製有包含 Schema 結構化資料嗎?有 sitemap 自動生成嗎?」
客製化網站最容易踩的 3 個雷
雷 1:邊做邊加需求 → 預算爆炸
業主在開發過程中不斷加新需求——「這個按鈕要加」「這個頁面要加」「這個功能要加」。每加一個需求,工時增加,預算增加。
避坑做法:合約要寫清楚「需求變更」流程——加新需求需要正式報價,不能「順便加」。
雷 2:設計稿很好看,但 SEO 完全沒做
有些設計公司只管「看起來漂亮」,不管「Google 看得到嗎」。
避坑做法:在簽約前就明確說「我需要 SEO 整合」,並寫進合約。
雷 3:上線後找不到人
有些設計公司上線後就「斷線」——遇到 bug 找不到人,要修小東西報價很高。
避坑做法:合約要寫「保固期」+「保固期外的維護報價」——讓售後服務有明確價格。
鍛碼匠怎麼看這件事
在台中接案的這幾年,看過太多業主拿著「客製化網站 5 萬」的報價單來問我們值不值得。答案很現實:5 萬的「客製」通常就是套版加換圖片,跟全客製的工時差距不是一倍兩倍。
我們的看法是,客製化網站是「從 0 到 1」的合作,業主跟設計公司要建立長期信任關係。簽約之前,先搞清楚 3 件事:完整流程、完整文件、完整保固。這 3 件事講清楚了,合作才會順利;講不清楚,後面就是無止盡的來回。
實戰建議:不要被低價吸引。低價背後通常是流程壓縮、文件省略、保固模糊——這些省下來的錢,最後都會從維護、追加、爭議的成本裡加倍吐回來。
客製化網站完整攻略對照
本文從「6 個流程階段」切入，客製化網站完整對照：
- 客製化 vs 套版 vs 一頁式 vs WordPress 對照 — 4 種類型整合
- 客製化網站 6 個關鍵流程階段 — 流程（本文）
- 客製化合約 + 驗收 checklist — 合約
- 客製化 3 個業主最常踩的雷 — 陷阱
