元伸科技
2 分鐘看懂「網站設計」和「網頁設計」差在哪
許多企業主詢價時，把兩個名詞當同義詞使用，實際上它們差一個層級：
- 網站設計（Website Design）：規劃整個網站的骨架。包含資訊架構（哪些頁面、怎麼分類）、使用者流程（訪客怎麼走到詢價）、資料模型（會員、文章、產品）、後台 CMS、SEO 系統、分析工具整合。
- 網頁設計（Web Page Design）：只負責單一頁面的視覺與排版。一張 Landing Page、一個活動頁、一個說明頁，都屬於這個範疇。
打個比方：網站設計像「規劃一棟房子」（從水電、結構到格局都要考慮）；網頁設計像「裝潢其中一個房間」（只管這個房間好不好看）。兩者技能不同、工期不同、費用自然差 3-5 倍。
網站設計做的是什麼？
一個完整的網站設計流程，至少包含 6 件工作：
- 資訊架構（IA）規劃：確認頁面清單、選單層級、URL 結構、內部連結策略。直接影響 SEO 與使用者能否找到資訊。
- 使用者流程（User Flow）設計：訪客從登陸頁 → 產品頁 → 詢價表單的每一步，包含斷點在哪、CTA 放哪、防漏設計。
- 資料模型與後台 CMS：哪些內容要能讓客戶自己改？產品、文章、案例、FAQ 各是一張資料表還是共用？後台權限怎麼分？
- 視覺設計系統：顏色、字體、元件（按鈕、卡片、表單）的規則，確保 20 頁之間風格一致。
- 前後端開發：RWD 響應式、載入效能、表單驗證、API 串接、快取策略。
- SEO 與分析整合：meta tag 系統、結構化資料、GA4、GSC、熱點分析。
這些工作都不是「畫一張漂亮圖」能涵蓋，所以網站設計需要 PM、設計師、前端、後端至少 4 種角色協作。
網頁設計做的是什麼？
網頁設計的工作範圍集中在「視覺與互動」層面：
- 視覺稿（Mockup）：Figma 或 Photoshop 上畫出頁面長相。
- HTML/CSS 切版：把視覺稿變成可瀏覽的網頁。
- 基本互動：滾動動畫、hover 效果、簡單表單。
- RWD 切版：手機、平板、桌機的版型切換。
輸出通常是一份 HTML + CSS + JS 的靜態檔案，可以嵌到任何網站或 CMS 裡。網頁設計師不一定會做後台、資料庫、SEO 系統。
5 個實作差距一次看完
| 項目 | 網站設計（Website Design） | 網頁設計（Web Page Design） |
|---|---|---|
| 範圍 | 整站（10-50 頁以上） | 單頁或少量頁面 |
| 交付物 | 可上線的完整系統（含後台） | HTML/CSS 檔案或 Figma 稿 |
| 技能需求 | PM＋設計＋前端＋後端 | 視覺設計＋切版 |
| 工期 | 2-6 個月 | 1-4 週 |
| 市場行情 | 企業官網 8-20 萬、電商 15-50 萬起 | 單頁 3,000-8,000 元 |
| 後續維護 | 需要後台管理與伺服器代管 | 交付後通常不含維護 |
關鍵差別：網站設計的輸出物「能直接上線運作」，網頁設計的輸出物「還需要別人接手整合」。這就是為什麼同一個需求找兩家不同型態的公司，報價會差 3-5 倍。
企業主常混用的 3 種情境
情境 1：把整站需求丟給網頁設計師
「幫我做一個公司網站，大概 10 頁。」 → 這是網站設計需求，卻拿網頁設計的預算（3-5 萬）報價。 → 結果：做出來的是 10 個靜態檔案，沒有後台、改一個字要找設計師、搜尋引擎找不到。
情境 2：把單頁需求當成網站開發
「我要做一個活動報名頁，有表單和倒數計時。」 → 這是網頁設計需求（可能加一個表單 API），卻找來網站設計公司，報 8 萬元。 → 結果：功能單純卻花大錢，其實 1 萬元的 Landing Page 服務就夠用。
情境 3：驗收才發現期待落差
「怎麼我的網站沒有後台？」 → 報價單寫的是「網頁設計」，交付的是 HTML 檔，但業主以為包含後台管理。 → 結果：進入合約糾紛，多付 3-5 萬補後台功能。
怎麼判斷自己需要哪一個？
回答下列 5 個問題，2 個以上「是」就屬於網站設計：
- 頁面超過 3 頁？
- 有需要後台自己改內容的項目（產品、文章、最新消息）？
- 需要會員登入、詢價表單、資料庫記錄？
- 要做 SEO、被 Google 搜尋得到？
- 要整合 GA、LINE、金流、CRM 等外部系統？
如果 5 題都是「否」——例如只要一張活動說明頁、靜態 Landing Page、測試版草稿——才真正屬於網頁設計需求。
結語：先分清楚名詞，才能問到正確的報價
搞清楚「網站設計」和「網頁設計」差在哪，根據元伸科技24 年的經驗，記住這 3 點：
- 範圍大小決定一切——超過 1 頁且有後台需求，一律用網站設計的標準找團隊。
- 交付物長什麼樣——問清楚「上線後誰負責、我能不能自己改」，答案決定你該找哪一類公司。
- 別只看單價——網頁設計單價便宜，但把整站需求拆成 10 個網頁設計，總價通常比一次發包網站設計貴。
想搞清楚自己的需求到底屬於哪一類？可以先參考網站設計入門指南完整釐清範圍，再看網站架設費用指南的行情區間；若已經準備要發包，網站設計公司怎麼選有完整的評估維度與必問清單。
📞 03-366-1000 ｜ 🌐 www.ozchamp.com ｜ 免費諮詢，24hr 內回覆初步方案建議
