合理的網站架設製作與網頁設計費用通常包含哪些？解讀網站報價與價格行情

為什麼用同樣的需求去詢問不同的網頁設計公司，你會得到差異很大的報價？不只是費用不同，可能連報價的細項和規格都差異很大。這是因為網頁設計是一個非常客製的產業，它並不像汽車或自行車具有高度規格化的零組件。不同的網頁設計公司或團隊都是在自己發展的開發環境下，採用各種客製或半客製的軟體元件進行網頁設計專案的開發，每間網頁設計公司都像是一個汽車品牌，各自擁有獨立一套的生產流程和開發方式，計費方式也有不同的差異。因此，不管是客製、半客製、公版等各種網頁設計費用的落差，主要就是差在客製化的程度。

 

一張簡表讓你了解網頁設計費用通常包含哪些項目？

常常有人會問，一樣都是委託網頁設計公司幫忙製作網站，為什麼價格還是有高有低？那是因為網頁設計公司會依照你提出的網站需求，包含網站架構的組成、視覺效果的複雜度、是否需要客製功能等，透過判斷需求去決定應使用客製化、半客製或直接套用公版來製作網站，這邊做了一個表格快速講解其中的差異性：

 

RWD網站方案	客製化網頁設計	半客製公版網站	簡易公版網站
基礎規劃建置	9~15萬	5~8萬	3~5萬
網頁設計與編排	8,000~15,000元/式	3,000~8,000元/式	1,000~3,000元/式
客製程式功能	12,000~8萬元/式	12,000~8萬元/式	無
網址	600~1200元	600~1,200元	600~1,200元
SSL憑證	0~5,000元	0~5,000元	0~5,000元
年度維護	1~2萬	8,000~1萬元	8,000~1萬元
總價	15萬元以上	8~15萬元	5~8萬元

 

 

用一個簡單的例子想像一下，如同各家汽車品牌都有不同的車款，你可依預算或偏好的性能來選擇車款，若預算充足你可能被高規格的汽車零件說服購買，在預算考量下也可能參考CP值而購入理想的汽車。

 

延伸閱讀：RWD是什麼？RWD響應式網頁概念一篇解析

延伸閱讀：SSL憑證是什麼？網站還沒裝SSL嗎？三分鐘帶你了解SSL對排名的重要性！

 

 

市面上網頁設計費用為何差異這麼大？3大因素為您拆解價格行情

我們以「顧客理想的網站需求」角度作為切入點，來探討市面上網頁設計費用的差異，我們將相關原因拆解後，列出3大因素如下：

 

原因一：網站架構大小（工作量）的差異

• 網頁數量：網站的頁面數量是評估一個網站架構大小的重要指標，頁面較多的網站當然就會需要更多的時間和資源來進行設計和開發。
• 客製功能需求：客製網站功能會導致技術成本的上升，例如購物車、金流系統、會員登入、報名表單、串接第三方服務等，進而直接影響到費用。
• 資料庫管理：網站如果有使用資料庫來儲存和管理大量的數據資料，那麼資料庫的設計和開發對費用也會產生影響。
• 網頁的設計編排：如果你偏好的是整體視覺風格較花俏或互動感較強的視覺設計，也是影響費用的因素之一。

 

原因二：網頁設計方案（製作方式）的差異

委由網頁設計公司的製作方案通常可以分為客製化網頁設計、半客製公版網站與簡易公版網站，從最直覺的設計編排就可以看出客製化製作或公版製作網站的差異性，以及後續功能若想要追加的可行性，我們常常遇到客戶原本是做公版網站，但發展後期遇到想要追加設計/功能的狀況，只好重新製作網站，花費的時間及費用是原本的好幾倍。

 

上述有提到網頁設計方案中各細項費用的差異，這些差異往往就是影響網站設計費用的最大因素，我們把差異拆解成細項後給你參考。

 

項目	客製化網頁設計	半客製公版網站	簡易公版網站
建置方式	從零開始規劃設計、校稿對稿、系統建置、測試至驗收	採用既有版型進行修改	採用既有版型進行修改
版型風格	依照客戶需求設計，彈性空間大	須按照套版的版型配置	須按照套版的版型配置
設計編排版程度	由設計師量身開版設計	套用版型，修改彈性低	套用版型，無修改彈性
日後追加功能可行性	可以	不一定	無法
SEO執行	可以	許多細節無法操作 (各家網頁設計不同)	許多細節無法操作 (各家網頁設計不同)
需求符合程度	完全符合	中	低
製作時程	投入時間較長，約3-4個月	時程約45個工作天	時程約30-45個工作天
適用對象	上市櫃公司、品牌企業的形象網站、B2B供應商	預算較低的個人或小公司網站、單純形象網站	活動網站、不注重獨特性的網站
未來發展	未來擴充性高、SEO需求高	不考慮未來擴充性	不考慮未來擴充性、無行銷需求
費用	15萬元以上	8~15萬元	5~8萬元

 

延伸閱讀：網站/網頁設計公司這樣挑不踩雷！5大原則教你找到專業設計公司

 

原因三：技術複雜度與不確定性

• 技術支援：如果網站需建置特殊或複雜的功能，需要專業人員花更多的時間和精力來解決技術上的需求，進而導致費用的增加。
• 響應式網頁設計技術(RWD)：在數位時代下，網頁設計公司會使用RWD技術讓網站可以自動適應不同的螢幕尺寸和裝置，不過此技術現已逐漸成為基本要求。
• 系統整合與相容性：如果網站需要與其他系統或平台進行整合，例如第三方支付系統、API等，就會需要專業程度較高的開發技術來確保平台間運作順利。
• 不確定性和變更風險：網頁設計進行時，需求可能會發生變化或出現不確定性，例如功能新增、視覺設計調整或排除錯誤，都會需要開發與品管團隊重新進行評估與調整，以滿足使用者需求。

 

 

這些網頁設計的細項費用是怎麼來的？

希望第一個段落的表格可以幫助你理解一份網頁設計的報價是如何組成的，接下來我們透過網站設計的基本規格來了解標準的客製化網頁設計費用報價應包含哪些項目，即便在報價上你可能看不到每筆細項的報價說明，還是可以透過以下的介紹來了解這些費用的來源，也可以跟想要合作的網頁設計公司逐項確認費用內包含哪些細項工作。下列是客製化網站最常採用的報價項目，我們一一說明各個報價大項所代表的涵意。

 

• 網站規劃費用 | 網站製作、人力投入與網站系統建置的基礎成本
• 網頁設計費用 | 通常依網頁數量多寡、切版複雜度而定
• 年度維護費用 | 網站上線後的主機代管及網站系統年度維護
• 網路行銷費用 | 也要考慮網站報價中是否包含SEO技術支援
• 加值服務項目 | 還有哪些其他需要另外報價的費用？

 

網站規劃費用

通常網站設計初期的網站規劃費用=人力成本+網站基礎建設，可以把它想像成公司的基礎營運成本。

 

【人力成本】

網站規劃在客製化網站製作過程中是相當重要的階段。要建置一個能使用長久的好網站，需要對一個網站的各個面向進行討論，現在的網站一定比十年前的網站需要投入更多專業技術以及人力，簡單介紹一下製作網站會需要的人力投入：

 

• 專案經理 (PM)： 整個專案的核心人物，負責管理及推動專案時程及進度，也是重要的溝通橋梁。
• 網頁視覺設計師：開版、整體頁面設計編排、設計良好使用者介面。
• 前端切版設計師：將平面網頁設計上的區塊、按鈕、整體介面完整呈現在網頁上。
• 網頁程式工程師：程式撰寫、功能建置、網站上線後的測試及維護。
• 品質管理師：進行網站系統性檢測、品質檢核、操作回饋，以確保網站的使用性與順暢運行。

 

【網站基礎建設】

網站規劃費用包含網站架構規劃及視覺風格設計規劃，網站規劃費用的高低也會影響一個網站在後續管理上的彈性和完整性。一個健全的網站系統通常包含下列的基礎建設：

 

• CMS內容管理系統：MVC網站架構、內容(文章)管理、網頁圖文編輯器
• 後台基本功能：網站維修關站設定、網站發信支援
• 網站安全性：網站後台登入防護、表單網路攻擊防護
• 網站功能可擴充性：內容管理分組權限功能、網站選單架構管理、各種外掛軟體支援

 

延伸閱讀：CMS是什麼？透過網站後台管理系統，程式小白也能打造專屬網站！

 

網頁設計費用

除了基礎的網站規劃費用外，接下來就是依網站內容頁面的多寡和切版複雜度來決定預算的高低，另外需要注意的是，越是簡單的設計編排頁，所需投入的人力和時間成本會相對較多。這些頁面簡單分為需要設計師進行排版切版的「設計頁」(例如：關於我們、服務優勢)，以及設計建置完成後可以自行從後台進行更新的「資料頁」(例如：產品資料、最新消息)。

 

• 客製化版型設計
• 網頁UI/UX設計
• 網頁動態效果
• 內容編排設計
• 資料庫及程式功能
• 多國語言版本

 

延伸閱讀：UI、UX是什麼？5分鐘快速看懂UI、UX設計差在哪！

 

 

年度維護費用

• 主機代管：你可以自己架設主機或是採用外部的專業主機。如果是委由網頁設計公司代管主機，就會有主機代管的費用，即便是向主機公司租用的主機。這個費用通常包含主機的故障排除、網站備份、主機相關系統設定。
• HTTPS(SSL)安全連線：網站主機支援SSL安全連線是目前的趨勢。網站主機使用HTTPS不只讓你的顧客/客戶安心(Google瀏覽器上顯示為「安全」)，同時也提升網站資料傳輸的安全性。通常一般的專業主機會附上免費的AutoSSL，如果是你自己架主機，就需要考量自己購買及安裝SSL。
• 網站安全性更新：現在的網站系統不管是CMS系統或是採用Framework架構的網站後台，都需要不定時進行安全性更新。請網頁設計公司幫你的網站系統隨時更新系統版本，就像是進行Windows安全性更新一樣，可以讓網站避免曝露在安全風險中。
• 網站管理系統設定：網站後台除了日常的操作外，還會有一些需求可以透過後台系統進行設定來完成某些功能。這些設定也許不是網站管理人員熟悉的操作，但通常可以委由網頁設計公司來幫你處理。
• 後台操作教學：網站完成後通常會有網頁設計公司為你進行網站操作的教學，但日子一久，當時的教學也許就忘得一乾二淨，加上不同時期的網頁需求也會不同，都需要有專業人員進行操作引導。建全的年度維護計劃通常會包含不定時的網站後台教學服務，協助你解決臨時的網站操作需求。

 

延伸閱讀：網站架設方式如何選擇？架設網站流程步驟、優缺點一篇比較

 

網路行銷費用

網站行銷除了買廣告外，最重要的就是具長遠計劃的SEO(搜尋引擎優化)。大部份的網頁設計公司不是SEO顧問公司，在SEO工作分工中也沒辦法完全取代SEO顧問公司的角色。然而網頁設計公司可以協助SEO的技術支援，同時應具備下列的SEO技術支援：

 

• 採用SEO友善架構進行網站建置：由於html5具備更多的識別性標籤，採用HTML5編碼的網頁將有利於Google解讀你的網頁內容，有助於Google進行網頁索引及網頁內容分析。
• 網站sitemap.xml產生器：sitemap.xml可用來提供Google快速索引你的網站、了解你的網站架構。當你有新的網站內容產生時(例：新增一篇文章)，sitemap.xml產生器可以直接從後台一鍵產生新的sitemap.xml，而不需另外用外部工具來處理。
• 安裝GSC/GA追蹤碼：Google Search Console(GSC)可以用來了解SEO的成效，Google Analytics(GA)則用來了解訪客進入網站後的使用行為。網頁設計公司通常可以協助你安裝這兩項追蹤碼，透過Google平台來了解網站的成效。
• T/D/H後台設定工具：T/D/H分別代表Title(網頁標題)、Description(網頁描述)、H1H2H3(文章章節標題)。透過後台的T/D/H工具可以讓網站行銷人員快速編輯這些SEO重要的設定，是個重要且方便的行銷工具。
• 301轉址工具：301永久轉址除了可以把舊網頁網址轉到新網址外，還可以讓你把舊網頁的SEO網頁權重轉移到新網頁。如果你是為舊網站進行改版，那麼一個簡單的301轉址工具就能幫你進行新舊網頁的轉換而保持排名的穩定性。
• URL-REWRITE自訂網頁網址：URL-REWRITE功能不只可以讓你為各個網頁進行命名，之後在GA或GSC看報告時可以分辨各個網頁數據。

 

延伸閱讀：SEO是什麼？SEO行銷入門基本概念全解析！ 

 

 

常見的加值服務項目

• 產品攝影：產品攝影指的是產品去背照、產品情境照這類的商品攝影。一般來說，商品攝影最好是找有專業攝影棚的攝影公司或工作室來進行拍攝。如果產品太大(工具機或機械設備)，也可以請攝影師到現場進行拍攝。
• 形象攝影：形象攝影指的是公司內外景或是人物攝影，可以用來表現一間公司的真實面貌。
• 電商購物網站功能：依電商複雜的程度、需要的功能、優惠模組等等來進行費用報價。
• 文案撰寫：由於專業領域的不同，網頁設計公司可以幫你設計版面、製作網頁特效，但對於網頁文字通常是得由客戶自行提供。如果實在拿不出內容，建議可以由網頁設計公司與客戶老闆(或公司關鍵人物)討論後擬好文章章節架構，再由客戶撰寫內容，最後再外包請文案人員進行「潤稿」。請記得，寫網站內容就像寫自傳一樣，沒有人可以幫你從頭到尾代筆，只有你才能寫出貼切的自我介紹。

項目	價格區間
產品攝影	3-6萬元
形象攝影	3-6萬元
電商購物網站功能	10-30 萬元以上
文案撰寫	0-1萬元

 

 延伸閱讀：如何提昇形象網站的質感？談照片與攝影的重要性

  

 

 

 

＊ 歡迎分享這篇文章，分享時請加入文章來源：凱士網頁設計公司

 

 

 

 

 

 

Kelsey Wang 凱士網頁設計公司 專案經理 Kelsey，在當今數位時代，使用者體驗成為一個網頁設計成功的關鍵要素。好的網站應該提供使用者看得懂、找得到的使用體驗，凱士致力於讓每位使用者在我們設計的網站上都能獲得良好的互動體驗。