當需求從「做一個頁面」變成「做一個網站」，難度不是等比例增加，而是換了一種問題。單頁只要處理一條動線，網站設計要處理的是十幾條甚至幾十條路徑：訪客從哪裡進來、下一步會想去哪、找不到的時候怎麼辦。這也是為什麼很多網站每一頁單看都不錯，整體用起來卻讓人迷路。
真正的核心工作，是先把資訊架構決定好，再讓視覺為架構服務。以下依序說明架構怎麼定、設計系統怎麼建立、哪些頁面狀態最常被漏掉，以及驗收時該用什麼方式檢查。
分水嶺在資訊架構，不在版面
資訊架構要回答三個問題：網站總共有哪些內容、內容之間怎麼分類、使用者怎麼從任何一頁走到目標。實務上會先做內容盤點，把現有與預計要有的資料全部列出來，再分群、命名、決定層級。這個步驟做完，網站的骨架其實就定了。
分類的依據應該是訪客的認知，而不是公司的組織圖。內部習慣把產品依部門或料號分類，訪客卻是依用途或使用情境在找東西；用內部邏輯命名的選單，往往是網站跳出率偏高卻找不出原因的來源。
層級也要控制。多數中小企業網站不需要超過三層，超過之後訪客很難在腦中建立位置感，搜尋引擎也不容易判斷哪些頁面重要。若某個分類底下只有一兩頁內容，通常代表這個分類本身不該存在，應該併回上一層。
從網站地圖到線框稿：上色之前要先決定的事
網站地圖決定「有哪些頁面」，線框稿決定「每一頁講什麼、順序如何」。線框稿刻意不上色、不放正式圖片，目的是強迫雙方先討論內容邏輯，而不是一開始就陷入顏色與字體的爭論。這個階段推翻重來的成本最低，也最應該把時間花在這裡。
在線框階段就該把每個區塊的文案長度大致估出來。很多網站上線後版面看起來鬆散，原因是設計時使用了長度理想的假文，實際內容卻長短不一。用接近真實的內容做設計，是避免返工最有效的方法。
這個階段也適合決定每一頁的行動呼籲。每一頁都應該有一個明確的下一步，可能是聯絡、索取資料、看案例或看服務說明。沒有出口的頁面，訪客看完就離開了，等於白做。
設計系統：讓幾十頁看起來像同一個網站
網站設計和單頁設計最大的差別，在於必須先定義規則，再把規則套用到所有頁面。一套堪用的規則通常包含：
- 標題階層與字級級距，確保各層標題在任何頁面都一致。
- 主色、輔色與強調色的使用時機，特別是按鈕與連結的各種狀態變化。
- 間距的基本單位，讓區塊之間的呼吸感一致。
- 卡片、表格、清單、引言等重複元件的統一樣式。
- 圖片的裁切比例與去背規範。
- 表單欄位、錯誤提示與必填標示的呈現方式。
有了這套規則，日後新增頁面時不需要重新設計，內部同仁也能自行維護而不會破壞一致性。反過來說，如果每一頁都是獨立設計、沒有共用規則，網站往往在第二年就會開始走樣，各頁風格逐漸分家。
最常被漏掉的幾種頁面狀態
提案時大家都在看首頁與產品頁，但實際使用時，訪客一定會遇到那些非理想狀態。搜尋沒有結果的畫面、文章分類還沒有內容的列表頁、表單送出後的成功與失敗提示、找不到網址的錯誤頁、資料載入中的暫時畫面——這些若沒有設計，就會露出系統預設的樣子，前面累積的專業感瞬間打折。
另外，列印樣式與無障礙細節也值得一併考慮，像是文字與背景的對比度是否足夠、只靠顏色區分的資訊有沒有其他辨識方式、鍵盤能不能操作選單與表單。這些不會大幅增加成本，卻能明顯提高網站的可用性與適用範圍。
驗收時用任務走一遍，而不是逐頁看畫面
建議設定三到五個真實情境，例如「我第一次聽到這家公司，想知道他們做什麼」「我要找到聯絡方式並送出詢問」「我想確認他們有沒有做過類似的案子」，然後請沒有參與專案的同事實際操作，看他們在哪裡停下來。卡住的地方，就是架構需要調整的地方。
同時檢查一致性：同樣的按鈕在不同頁面樣式是否相同、麵包屑是否正確反映層級、選單是否標示出目前所在位置、頁尾資訊是否每頁一致。這些細節加總起來，決定網站給人的專業程度。若還在評估要投入多少資源，可以先看 免費架設網站 有哪些限制，再回頭決定架構要做到什麼程度，或直接參考 網頁設計服務 的完整流程說明。
常見問題
網站設計和網頁設計有什麼不同？
在日常用語中兩者經常混用，但實際的工作重心不同。網頁設計偏向單一頁面的版面與視覺呈現，處理的是這一頁怎麼排、怎麼引導；網站設計則是站在整體的角度，先決定有哪些頁面、彼此怎麼分類與連結，再建立一套可以重複套用的設計規則。頁數越多、內容更新越頻繁的網站，前期架構規劃的重要性就越高。
網站設計要規劃多少頁才夠？
頁數應該由內容決定，而不是先設定一個數字。原則上，每一個你希望被搜尋到、或希望在業務過程中單獨傳給客戶的主題，都值得擁有自己的頁面；反之，內容單薄到只有兩三段話的主題，併入既有頁面反而更好。常見做法是先做內容盤點，把手上真正有東西可寫的主題列出來再決定架構，日後再依內容產出逐步擴充。
沒有專業攝影素材，會影響網站設計嗎？
會，而且影響通常比預期大。版面的留白、圖片比例與整體色調都是依素材規劃的，若最後換成解析度不足或風格不一致的照片，質感會明顯下降。可行的替代方案包含以圖表、文字排版與插畫為主降低對照片的依賴、統一調整既有照片的色調與裁切比例，或先上線再分批補拍。重點是在設計階段就先確認素材條件，而不是等到上稿才發現。
為什麼選擇京采數位科技
- 2005 年成立，累積服務 600 家以上客戶
- 10 人專業團隊，服務全台，可安排到府面談
- 具備繁體中文、簡體中文、英文、日文的多語系網站經驗
- 服務時間 週一至週五 9:00–18:30（12:00–13:30 午休）
- 具名案例可於「成果與案例」頁面查看
依內部量測期規劃，本頁尚未附上流量或排名等成效數字；相關實測數據會在量測期滿並取得客戶授權後更新。
相關主題
下一步
想進一步討論「網站設計」該怎麼規劃，可以參考我們的網站設計服務，或直接與我們聯繫，我們會依照你的產業與目標給出務實的建議。
