網頁設計公司 vs 網站架設費用（推薦報價）

	網頁設計公司報價	自己架設網站費用
網域名稱（若你還沒購買）	可能較貴	.com 每年 US$10 ~ US$20 .tw 每年 US$25 ~ US$35 查詢與購買： GoDaddy Namecheap Name.com
虛擬主機	費用與「套版網站」或「客製化網站」方案綁定。 建議詢問： 主機是 SSD (Solid State Drive 固態硬碟) ？ 有免費 SSL/TLS 憑證？ 有免費 Cloudflare DDoS 攻擊防護？ 資料中心/機房位置？ 有每週或每日備份？ 有全年無休 24 小時客服？	共享主機 (Shared hosting) 每月 US$2 ~ US$10 雲端主機 (Cloud hosting) 每月 US$30 ~ US$300
套版網站	NT$10,000 ~ NT$50,000 每年網站維護費？	WordPress主題/版型：每年 US$0 ~ US$60 WordPress外掛 (SEO, 表單, 社群分享…) ：每年 US$0 ~ US$120
客製化網站	NT$50,000 ~ NT$500,000（視網頁數量與功能而定）
套版購物型網站	NT$30,000 ~ NT$70,000（金流服務成交手續費每筆NT$0~NT$30 + 交易金額抽成2%~4%） 每年網站維護費？	WooCommerce (WordPress的外掛之一) 每年 US$0（金流服務成交手續費每筆約US$0.3 + 交易金額抽成2%~3%）
客製化購物型網站	NT$120,000 以上（視網頁數量與功能而定）

如何架設網站

流程：

1. 選擇 CMS (Content Management System 內容管理系統) 如 WordPress、Shopify、Wix、Google協作平台、Squarespace… 等
2. 購買網域名稱
• 網域名稱的註冊資訊要填寫正確，否則可能被吊銷所有權
• 購買後，務必要通過email驗證（點擊驗證email中的連結）
3. 租用虛擬主機（若第一步選擇 WordPress, Joomla, Drupal… 等自架站軟體）

虛擬主機後台的設定重點（以 Hostinger 為例）：



• Accounts > Details > Nameservers: 若你有外部網域，在網域商後台的 Manage DNS/Nameservers 欄位輸入這兩行網址，就能指向 Hostinger Nameservers (架設網站用的伺服器)
• Accounts > Details > Server Details: 可以修改 Server Location (網站所在資料中心的位置)



• Domains > Redirects: 可以設定 301 轉址/重定向



• Website > Auto Installer: 可以刪除、重新安裝CMS/架站軟體（通常是WordPress）



• Files > Backups: 可以備份、還原網站
• Files > FTP Accounts: 若有使用 FTP 軟體，需要的資訊都在這裡



• Advanced > DNS Zone Editor: 若在其他地方購買企業信箱（推薦Google Workspace/企業Gmail），須在這裡設定DNS
4. 規劃網站架構





5. 套用CMS的網頁設計模板（免費、付費）或客製化——後者須聘請網頁設計師，或自己編寫HTML、CSS、JavaScript、PHP… 等程式



• 若要看你的WP網站前台，在瀏覽器輸入 [你的網域]
• 若要登入你的WP網站後台，在瀏覽器輸入 [你的網域]/wp-admin
6. 撰寫S.E.O.文案
7. 測試網站速度和瀏覽器相容性
8. 數位行銷（SEO搜尋引擎優化、數位廣告、社群行銷、CRM顧客關係管理、網紅行銷、EDM行銷）
• 驗證 Google Search Console 和埋設 GA4 追蹤碼以分析網站流量

網頁設計範例

Tesla

• 簡單的呈現產品（沒有代言人、鮮豔文字和背景圖案）
• 品牌名稱（Model 3）
• 產品特色（ 3.3 秒從時速 0 到 100 公里、 619 公里續航里程、雙馬達全輪驅動）
• 行動呼籲按鈕（立即訂購）

Model 3 訂購頁面

• 「所見即所得」產品規格客製化訂單
• 聊天機器人 (Chatbot) 輔助售前服務
• 多國語言

星巴克

• 新產品上市（可可綿雲瑪奇朵、鹹焦糖風味綿雲瑪奇朵、查看更多新品）
• 會員行銷（誰是你的完美組合？完成任務領取優惠）

Airbnb

• 搜尋引擎（位置、入住、退房、人數）
• 推薦系統/隨機（隨心所欲）
• 供應商開發（成為房東／體驗達人）
• 多國語言

Asana

• 含顧客價值的標題（高效開展重要工作，避免徒勞無功的困局。）
• 行動呼籲按鈕（開始使用）
• 多國語言

iCloud

• 含品牌名稱的標題（iCloud）
• 含顧客價值的標題（存放你所有照片、檔案及更多資料的最佳空間）
• 行動呼籲按鈕（升級至 iCloud+）
• 行動呼籲（升級至 iCloud+，享有更多強大的功能與儲存空間，每月 NT$30 起。）

MacBook Pro 訂購頁面

• 「所見即所得」產品規格客製化訂單
• 聊天功能（有任何關於購買 Mac 的問題嗎？和專員聊聊。）
• 分期付款（提供零利率分期付款優惠）

Zendesk

• 含目標客群的標題（全方位客戶服務領航者）
• 行動呼籲按鈕之體驗行銷（免費試用）
• 行動呼籲按鈕之客戶名單收集（觀看示範、取得報告、立即註冊、下載報告）
• 多國語言

Foodpanda

• 含顧客價值的標題（從美食到生鮮雜貨 上萬種商品 馬上點馬上到）
• 搜尋引擎（輸入你欲送達的地址）
• 招募人才（歡迎加入我們的外送團隊）
• 供應商開發（與foodpanda合作，讓更多人享受你的餐點跟商品吧！）

Google Workspace

• 含目標客群的標題（各種規模的團隊如何聯絡溝通、創作內容及協同合作）
• 行動呼籲按鈕之體驗行銷（開始免費試用）
• 產品演示 (Product demo) 影片

Uber

• 差異行銷（搭乘、訂購外送、優步企業版）
• 搜尋引擎（輸入上車地點、輸入目的地）
• 招募人才（上線開車或外送）
• 多國語言

網頁設計師＆軟體

	UI、UX設計師	前端工程師	後端工程師	DevOps (Development + Operations) 工程師
設計軟體	Figma, Adobe XD, Sketch, Balsamiq, Moqups, MockFlow, Framer, Justinmind, proto.io, UXPin	Visual Studio Code, Eclipse, IntelliJ IDEA, Vim, PyCharm, Chrome開發者工具, ChatGPT	同前端工程師
程式語言	HTML, CSS	HTML, CSS, JavaScript, Sass	PHP, Python, Java, SQL, NoSQL	[大致了解各種程式語言]
框架		Bootstrap, jQuery, Vue.js, React	Node.js, Ruby on Rails
技能	使用者研究, 資訊架構分析, Wireflow & UI prototype設計, RWD常用斷點/尺寸設定, 視覺設計, UAT	RWD寫法, Git指令, WordPress, API串接	系統分析與設計, Linux指令, CDN, Redis, Apache, Nginx, MySQL, REST API, JSON API	伺服器作業系統, 網路安全, 基礎設施＆應用程式監控, Git指令, Ansible指令, Jenkins CI/CD, Docker指令, Kubernetes, AWS, Azure, GCP

SEO課程（數位/網路行銷線上教學）