情報アーキテクチャの深層研究（第1部）

資訊架構（Information Architecture）深度研究報告 目錄 IA 核心概念 四種導航類型比較 標籤設計指南 卡片分類法完整流程 大型網站 IA 案例分析 總結與最佳實踐 第一章：IA 核心概念 1.1 什麼是資訊架構？ 資訊架構（Information Architecture，簡稱 IA）是關於組織、分類和標示資訊的藝術與科學。它的目標是幫助使用者在數位產品中找到他們需要的資訊，並理解他們所處的環境。 Peter Morville 和 Louis Rosenfeld 在其經典著作《Information Architecture for the World Wide Web》中將 IA 定義為： 「資訊架構是資訊空間中結構化設計的範式，旨在提升可用性與可發現性。」 1.2 IA 的七大支柱 根據 Peter Morville 提出的 IA 蜂巢圖（IA Honeycomb），成功的資訊架構必須回答以下七個問題： 1. 有用性（Useful） 內容是否對使用者有意義？ 是否能解決使用者的問題？ 是否提供了實際價值？ 2. 可用（Usable） 介面是否直覺且易於操作？ 使用者能否輕鬆完成任務？ 是否符合使用者期望？ 3. 可發現（Findable） 使用者能否找到他們需要的資訊？ 導航系統是否清晰有效？ 搜尋功能是否強大？ 4. 可訪問（Accessible） 是否有能力接觸到所需資訊？ 是否符合無障礙標準？ 是否考慮了不同能力的使用者？ 5. 相關性（Relevant） 內容是否與使用者需求匹配？ 是否提供了正確的資訊層次？ 是否避免了資訊過載？ 6. 可信（Credible） 使用者是否信任所提供的資訊？ 來源是否可靠？ 是否有適當的信任信號？ 7. 可找（Desirable） 是否激發使用者探索的慾望？ 視覺設計是否吸引人？ 品牌情感是否建立？ 1.3 IA 的三個核心組成要素 （一）組織系統（Organization Systems） 組織系統決定了如何分類資訊。常見的組織方式包括： 基於任務的組織 ：按照使用者想要完成的任務來組織資訊 例如：「如何申請護照」、「如何報稅」 優點：以使用者為中心，直接對應需求 缺點：需要深入了解使用者行為 基於受眾的組織 ：按照不同使用者群體分類 例如：「學生專區」、「教師專區」、「家長專區」 優點：針對特定需求客製化 缺點：可能產生重疊和混淆 基於內容性質的組織 ：按照資訊本身的特性分類 例如：按主題、格式、語言、媒體類型 優點：邏輯清晰，容易維護 缺點：可能不符合使用者心智模型 基於行為的組織 ：按照使用者操作行為分類 例如：瀏覽、搜尋、篩選、排序 優點：貼近使用者操作習慣 缺點：需要大量使用者研究支持 （二）標籤系統（Labeling Systems） 標籤是用來代表一組資訊的視覺或文字表現形式。好的標籤應該： 精簡明確，避免歧義 符合使用者語言習慣 保持一致性 避免技術術語（除非目標受眾熟悉） （三）導航系統（Navigation Systems） 導航系統幫助使用者在資訊空間中移動。包含： 全局導航：網站層級的導航 區域導航：特定區塊內的導航 輔助導航：搜尋、麵包屑、站點地圖等 情境導航：頁面內相關的連結 1.4 搜尋與可發現性（Search & Findability） 可發現性是 IA 的核心目標之一。它包含兩個層面： 主動搜尋（Active Search） 使用者知道自己要找什麼，使用搜尋功能 需要強大的搜尋引擎支援 關鍵詞建議、拼字修正、同义词處理 被動發現（Passive Discovery） 使用者瀏覽時偶然發現相關資訊 依賴良好的組織結構和導航 推薦系統、相關內容連結 1.5 內容模型設計（Content Modeling） 內容模型是 IA 的骨架，定義了： 內容類型（Content Types） ：文章、產品、事件、影片等 屬性（Attributes/Metadata） ：標題、日期、作者、分類、標籤 關係（Relationships） ：內容之間的關聯方式 約束（Constraints） ：必填欄位、格式限制、權限設定 內容模型的設計步驟： 識別內容類型 ：列出所有需要管理的內容種類 定義屬性 ：為每種內容類型確定必要的元數據 建立關係 ：定義內容類型之間的關聯 制定約束 ：設定每個屬性的規則和限制 驗證與迭代 ：根據實際使用情況調整模型 第二章：四種導航類型比較 2.1 導航類型總覽 資訊架構中有四種基本的導航類型，由 Richard Saul Wurman 提出： 導航類型 核心概念 典型應用 順序型（Sequential） 線性、一步一步 教學、流程指引 層級型（Hierarchical） 樹狀結構，由大到小 大多數企業網站 矩陣型（Matrix） 多個維度交叉 電商平台、資料庫 組織型（Organizational） 多種導航方式組合 複雜資訊平台 2.2 順序型導航（Sequential Navigation） 定義 ： 使用者按照預定的順序逐步瀏覽內容，通常是一步一步的線性流程。 特點 ： 線性結構，有明確的前後順序 適合需要逐步引導的場景 使用者控制權較低 可以加入進度指示器 優點 ： 結構清晰，使用者不會迷路 適合教學和操作指引 可以降低認知負荷 確保使用者看到所有必要資訊 缺點 ： 缺乏靈活性 不適合經驗豐富的使用者 無法跳過已知的內容 如果某一步出錯，整體流程受阻 適用場景 ： 線上報名流程 教學課程 設定嚮導（Setup Wizard） 表單填寫 產品購買流程 設計原則 ： 提供清晰的進度指示 允許使用者返回上一步 每步只顯示必要資訊 提供取消和跳過的選項 確保每一步的目標明確 2.3 層級型導航（Hierarchical Navigation） 定義 ： 採用樹狀結構，從廣泛的主題開始，逐漸深入到具體的子主題。這是網站中最常見的導航類型。 特點 ： 樹狀結構，根節點到葉節點 使用者可以從高層級向下深入 通常配合麵包屑導航使用 支援多層展開 優點 ： 結構清晰易懂 使用者容易建立心智模型 擴充性強，可無限向下延伸 符合人類思考方式（由大到小） 缺點 ： 深層導航可能難以到達 層級過多會增加認知負擔 跨類別的相關內容難以連接 維護成本隨規模增長 適用場景 ： 企業官網 新聞網站 知識庫 電子商務分類 政府網站 設計原則 ： 保持合理的層級深度（一般不超過 3-4 層） 使用 MECE 原則（相互獨立、完全窮盡） 提供快捷方式到常用頁面 配合麵包屑增強方向感 在關鍵節點提供摘要內容 2.4 矩陣型導航（Matrix Navigation） 定義 ： 允許使用者通過多個維度和路徑來探索資訊，沒有固定的起始點或順序。使用者可以自由選擇自己的探索路徑。 特點 ： 多個入口點和導航路徑 沒有單一的最佳路徑 使用者可以選擇自己偏好的方式 需要多種導航機制支援 優點 ： 高度靈活，滿足不同需求 支援多種探索策略 適合複雜的資訊空間 使用者有充分的控制權 缺點 ： 認知負擔較高 容易讓新手使用者感到困惑 設計和開發成本高 需要強大的搜尋功能作為補充 適用場景 ： 大型電商平台（Amazon、蝦皮） 學術資料庫 圖書館目錄系統 複雜的企業內部系統 社交媒體平台 設計原則 ： 提供多種探索路徑（分類、搜尋、標籤、推薦） 確保每個入口點都有明確的價值 使用篩選器和排序功能降低複雜度 提供情境化的導航建議 保持視覺層次清晰 2.5 組織型導航（Organizational Navigation） 定義 ： 結合多種導航類型的混合模式，為不同類型的資訊和使用情境提供最適切的導航方式。這是大型網站最常用的策略。 特點 ： 混合使用多種導航類型 不同區域採用不同的導航策略 根據內容性質選擇最合適的方式 通常包含全局、區域、輔助等多層導航 優點 ： 靈活性最高 可以針對不同內容類型優化 滿足多樣化的使用者需求 scalability 強 缺點 ： 設計複雜度高 需要大量的使用者研究和測試 一致性難以維持 維護成本高昂 適用場景 ： 大型門戶網站 綜合型电商平台 教育平台 醫療資訊網站 政府服務平台 設計原則 ： 分析不同內容類型的特徵 為每種內容選擇最適合的導航類型 確保全局導航的一致性 在不同導航系統之間建立橋樑 持續進行使用者測試和優化 2.6 四種導航類型對比總結 +-------------+----------+----------+----------+--------------+ | 比較維度 | 順序型 | 層級型 | 矩陣型 | 組織型 | +-------------+----------+----------+----------+--------------+ | 結構特徵 | 線性 | 樹狀 | 網狀 | 混合 | | 使用者控制 | 低 | 中 | 高 | 高 | | 認知負擔 | 低 | 中 | 高 | 中高 | | 設計難度 | 低 | 中 | 高 | 很高 | | 靈活性 | 低 | 中 | 高 | 很高 | | 適合新手 | ***** | **** | ** | *** | | 適合專家 | ** | *** | ***** | **** | | 擴充性 | 差 | 好 | 很好 | 很好 | +-------------+----------+----------+----------+--------------+ 第三章：標籤設計指南 3.1 標籤的重要性 標籤是使用者與資訊系統之間的橋樑。一個好的標籤能讓使用者立即理解其代表的內容，而一個糟糕的標籤則會導致困惑和迷失。 研究表明， 標籤是影響可發現性的重要因素之一 。當使用者找不到所需的資訊時，他們往往會歸因於標籤不夠清楚。 3.2 標籤設計的核心原則 原則一：使用使用者語言（User's Language） 標籤應該反映使用者的思維模式和用語習慣 避免使用內部術語或縮寫 透過使用者研究（如卡片分類法）來確定正確的標籤 錯誤範例 ：「BI 模組」 正確範例 ：「商業智慧工具」 錯誤範例 ：「API 整合」 正確範例 ：「開發者工具」 原則二：保持一致性（Consistency） 相同的標籤在所有地方代表相同的意思 相似的內容使用相似的標籤命名方式 建立標籤詞彙表（Taxonomy Glossary） 示例 ： 如果「最新活動」出現在首頁，那麼在其他頁面也應該使用相同的命名 不要同時使用「新聞」和「最新消息」表示同一類內容 原則三：保持精簡（Conciseness） 標籤應該盡量簡短但完整 避免冗長的描述 一般建議不超過 3-5 個字詞 錯誤範例 ：「關於我們公司的歷史和發展歷程介紹」 正確範例 ：「公司簡介」 原則四：避免歧義（Avoid Ambiguity） 每個標籤應該有明確的含義 避免使用多重解釋的詞彙 提供上下文幫助理解 有問題的標籤 ：「檔案」 是指文件？還是資料夾？還是程式檔案？ 改進後的標籤 ： 「文件下載」 「資料夾列表」 「程式碼檔案」 原則五：建立適當粒度（Appropriate Granularity） 標籤的細化程度要適合內容量和使用者需求 太少標籤會導致內容過於龐雜 太多標籤會讓使用者難以選擇 原則六：提供視覺提示（Visual Cues） 使用圖標輔助標籤識別 利用顏色區分不同類別 保持視覺層次清晰 3.3 標籤的分類體系 一階標籤（Primary Labels） 全站通用的主要導航標籤，通常出現在主選單中。 設計要點： 數量控制在 5-9 個之間（Miller's Law） 涵蓋網站的主要內容領域 使用使用者最熟悉的用語 二階標籤（Secondary Labels） 一階標籤下的子分類標籤。 設計要點： 與父標籤保持語意連貫 避免與兄弟標籤重疊 同樣遵循 5-9 個的原則 情境標籤（Contextual Labels） 出現在特定頁面或內容中的標籤。 設計要點： 與當前內容高度相關 提供進一步探索的路徑 可以更具體和專業 搜尋標籤（Search Labels） 用於搜尋和篩選功能的標籤。 設計要點： 支援同義詞和別名 提供模糊匹配 支援多條件組合篩選 3.4 標籤設計的實戰技巧 技巧一：建立詞彙表（Glossary） 為整個網站建立統一的標籤詞彙表，包含： 標籤名稱 | 定義說明 | 使用場景 | 同義詞 | 排除詞 ───────────────────────────────────────────────────────────── 產品中心 | 所有產品的匯總頁面 | 主導航、搜尋結果頁 | 商品中心、商城 | 服務、方案 解決方案 | 針對特定需求的產品組合 | 主導航第二層 | 方案、對策 | 產品、案例 技巧二：使用動作引導標籤 對於操作型標籤，使用動詞開頭： 「查看所有產品」而非「產品」 「下載白皮書」而非「資源」 「聯絡我們」而非「聯繫」 技巧三：標籤數量控制 主導覽航：5-7 個標籤 下拉選單每項：最多 10 個項目 分類頁面的篩選條件：根據內容量調整 標籤雲：顯示最常用的 20-30 個標籤 技巧四：處理多維度分類 當內容具有多個分類維度時： 選擇主分類軸 ：確定最重要的分類方式 提供次要分類工具 ：如篩選器、標籤系統 允許交叉探索 ：如「按類別篩選後再按標籤篩選」 技巧五：國際化標籤考量 不同語言可能有不同的分類邏輯 考慮文化差異對標籤理解的影响 測試標籤在多語言環境中的清晰度 3.5 標籤優化的持續流程 1. 收集現有標籤的使用數據 ↓ 2. 分析搜尋日誌，找出未命中查詢 ↓ 3. 進行卡片分類測試，驗證使用者心智模型 ↓ 4. 設計新標籤方案 ↓ 5. A/B 測試比較標籤效果 ↓ 6. 根據數據持續優化 第四章：卡片分類法完整流程 4.1 什麼是卡片分類法？ 卡片分類法（Card Sorting）是一種使用者研究方法，用來了解使用者如何對資訊進行分類和組織。它是設計資訊架構最重要的工具之一。 核心概念 ：讓使用者將印有內容條目的卡片歸入自己認為合適的分類中，從而揭示使用者的心智模型（Mental Model）。 4.2 卡片分類法的類型 （一）開放式卡片分類（Open Card Sort） 流程 ： 準備內容條目卡片 請使用者自行創建分類並命名 將卡片放入對應的分類中 優點 ： 發現使用者真實的分類邏輯 獲得使用者自創的標籤名稱 不受設計者偏見影響 缺點 ： 結果較難量化分析 需要更多時間和參與者 分類數量可能過多 適用場景 ： 全新網站的 IA 設計 重大改版前的研究 探索使用者心智模型 （二）閉合式卡片分類（Closed Card Sort） 流程 ： 準備內容條目卡片 提供預先定義的分類 請使用者將卡片歸入已有分類 優點 ： 結果容易量化分析 驗證現有分類結構的有效性 執行效率較高 缺點 ： 可能限制使用者的分類自由 無法發現新的分類方式 預設分類可能不完全符合使用者期望 適用場景 ： 驗證現有 IA 的合理性 測試新內容是否適合現有分類 快速迭代優化 （三）混合式卡片分類（Hybrid Card Sort） 流程 ： 提供部分預定義分類 允許使用者創建額外分類 優點 ： 平衡結構性和靈活性 既驗證既有分類又發現新洞察 適用場景 ： 在現有架構基礎上擴展新功能 部分內容已有良好分類，部分需要探索 4.3 卡片分類法完整操作流程 第一階段：準備工作 步驟 1：確定研究目標 明確卡片分類法要解決的問題： 設計全新的網站分類結構？ 驗證現有導航的合理性？ 優化搜尋結果的分類？ 設計新的內容標籤系統？ 步驟 2：收集內容條目 內容條目是卡片分類的基礎，需要全面且具代表性： 列出網站或產品中的所有頁面、功能和內容 每個條目應該足夠具體，避免過度抽象 條目數量建議：20-80 張卡片（視研究規模而定） 條目撰寫要點 ： 使用簡潔的標題或描述 避免內部術語 確保每個條目代表一個獨立的內容單元 條目應該反映使用者的觀點，而非開發者的觀點 步驟 3：製作卡片 每張卡片寫一個內容條目 使用統一的格式和大小 可以實體卡片或線上工具進行 步驟 4：選擇參與者 樣本數量：5-8 人可發現約 75% 的用戶行為模式 15-20 人可覆蓋大部分常見的分類方式 確保參與者代表目標用戶群體 避免招募同事或內部人員（有偏見風險） 第二階段：執行卡片分類 步驟 5：說明規則 向參與者清楚說明： 任務目標：將卡片按照自己認為合適的方式分組 可以自由創建分類名稱 一張卡片只能放在一個分類中（或允許重複放置，取決於研究設計） 不需要擔心「正確答案」，按照直覺即可 鼓勵出声思考（Think Aloud） 步驟 6：進行分類 觀察並記錄： 參與者如何命名分類 哪些卡片被放在一起 哪些卡片造成困惑 參與者的決策過程和思考路徑 步驟 7：後續訪談 分類完成後進行简短訪談： 為什麼這樣分類？ 有沒有覺得困難的地方？ 有沒有遺漏的分類或條目？ 對分類名稱有什麼建議？ 第三階段：分析結果 步驟 8：匯總數據 將所有參與者的分類結果匯總，形成數據集： 卡片條目 | 參與者A分類 | 參與者B分類 | 參與者C分類 ------------------+-------------+-------------+------------ 帳號設定 | 個人中心 | 帳戶管理 | 個人中心 訂單追蹤 | 我的訂單 | 訂單管理 | 購物紀錄 步驟 9：相似度矩陣分析 計算每對卡片被分在同一組的頻率，形成相似度矩陣： 高相似度：經常被分在一起的卡片 低相似度：很少被分在一起的卡片 步驟 10：聚類分析 使用統計方法（如聚類分析、多维尺度分析 MDS）將結果可視化： 識別主要的分類群組 發現不一致的分類模式 確定最佳的分類結構 步驟 11：提取洞察 從分析結果中提取關鍵洞察： 使用者最常使用的分類名稱 爭議性大的卡片條目 需要合併或拆分的分類 缺失的重要分類 第四階段：應用結果 步驟 12：設計新的資訊架構 基於分析結果： 確定主要的分類結構 命名分類標籤 設計導航層次 建立內容模型 步驟 13：驗證與迭代 使用閉合式卡片分類驗證新架構 進行可用性測試確認導航有效性 根據實際使用數據持續優化 4.4 卡片分類法分析工具 常用工具列表 工具名稱 類型 特點 價格 OptimalWorkshop 線上 功能完整，支援所有類型 付費 CardSortly 線上 界面友好，適合初學者 免費/付費 Sortable 線上 開源，可自行部署 免費 Treejack 線上 與 Optimal 生態整合 付費 實體卡片 離線 無需工具，直觀 免費 實體卡片 vs 線上卡片 實體卡片優點 ： 更自然的互動體驗 方便即時觀察和訪談 無需技術設置 實體卡片缺點 ： 無法遠端進行 整理和分析耗時 難以處理大量卡片 線上卡片優點 ： 可遠端進行 自動數據匯總和分析 適合大規模參與 線上卡片缺點 ： 缺少面對面的洞察 技術門檻 參與者可能不夠投入 4.5 卡片分類法常見陷阱與解決方案 陷阱 原因 解決方案 參與者創建過多分類 卡片條目過多或指導不清 限制卡片數量，提供明確指引 所有卡片都放在一個分類 參與者不理解任務 重新說明規則，增加示範 分類名稱不一致 參與者背景差異大 增加參與者數量，進行訪談補充 結果無法量化 使用開放式分類但缺乏分析工具 使用專業的聚類分析工具 參與者疲勞 測試時間過長 控制卡片數量在 40-60 張 4.6 卡片分類法案例演示 案例：電商網站分類優化 研究目標 ：優化某電商網站的產品分類結構 步驟 ： 內容條目收集 （共 45 張卡片）： 手機殼、螢幕保護貼、充電器（行動配件） T-shirt、牛仔褲、外套（服飾） 筆記型電腦、平板、智慧手錶（3C產品） 書籍、雜誌、電子書（出版物） 參與者 ：20 名目標用戶 開放式卡片分類結果 ： 75% 的參與者將「行動配件」和「3C產品」分開 60% 的參與者創建了「生活用品」分類 最常見的分類名稱：「手機周邊」、「衣服鞋子」、「電腦平板」 洞察 ： 現有的「3C產品」大类太籠統 使用者傾向於按設備類型而非價格或品牌分類 「生活配件」是一個重要的新分類機會 新 IA 設計 ： 手機及配件 電腦及平板 服飾鞋包 生活雜貨 圖書出版 第五章：大型網站 IA 案例分析 5.1 Amazon 電商平台資訊架構 網站概況 全球最大電商平台 數千萬商品 多國多語言支援 IA 設計策略 1. 層級型為主體的組織型導航 Amazon 採用層級型導航作為基礎，同時結合矩陣型導航的多維探索功能： 首頁 ├── 所有分類（左側層級導航） │ ├── 電子用品 │ │ ├── 電腦與配件 │ │ │ ├── 筆記型電腦 │ │ │ ├── 平板電腦 │ │ │ └── 電腦配件 │ │ ├── 手機與配件 │ │ └── 影音產品 │ ├── 服飾鞋包 │ ├── 家居廚房 │ └── 書籍 ├── 今日特惠（矩陣型入口） ├── 推薦商品（情境導航） └── 搜尋框（搜尋導航） 2. 多維度篩選系統 Amazon 的矩陣型導航體現在其強大的篩選功能： 按價格範圍篩選 按品牌篩選 按評分篩選 按配送方式篩選 按商品特點篩選（防水、輕量等） 3. 情境化導航 瀏覽歷史記錄 購買推薦 看了又看 買了又買 相關商品連結 IA 成功因素 清晰的層級結構 ：最多 4 層的合理深度 強大的搜尋功能 ：支援模糊匹配、同義詞、拼字修正 多入口點設計 ：分類、搜尋、推薦、品牌頁面 一致的標籤系統 ：全球統一的命名規範 情境感知導航 ：根據使用者行為動態調整 5.2 Wikipedia 百科全書資訊架構 網站概況 全球最大的線上百科全書 超過 6000 萬篇文章 300+ 種語言版本 IA 設計策略 1. 純層級型導航 Wikipedia 採用最純粹的層級型導航： 首頁 -> 隨機條目 / 特色文章 / 今日新聞 | 分類體系（Category） |-- 科學 | |-- 物理學 | | |-- 量子力學 | | |-- 相對論 | |-- 化學 |-- 人文 |-- 歷史 |-- 哲學 2. 雙重導航系統 分類導航 ：層級式，由人工維護 超連結導航 ：矩陣式，由內容自然形成 3. 搜尋優先策略 由於內容量巨大，Wikipedia 鼓勵使用者直接使用搜尋功能，而非逐層瀏覽。 IA 成功因素 去中心化的組織結構 ：允許內容從多個角度被發現 社群驅動的分類系統 ：由志願者持續維護和完善 強大的內部連結 ：形成自然的矩陣導航 搜尋是最主要的發現方式 ：承認層級導航的局限性 5.3 政府網站 IA 案例：台灣行政院 網站概況 政府資訊彙整平台 多部門整合 服務導向 IA 設計策略 1. 任務導線的組織系統 政府網站通常採用任務導向的組織方式： 首頁 ├── 依業務分類 │ ├── 內政部 │ ├── 教育部 │ └── 财政部 ├── 依服務對象 │ ├── 國民服務 │ ├── 企業服務 │ └── 外籍人士服務 ├── 依生活階段 │ ├── 出生 │ ├── 求學 │ ├── 就業 │ ├── 成家 │ └── 退休 └── 依事項辦理 ├── 申請證件 ├── 繳納費用 └── 查詢進度 2. 多維度的分類策略 政府網站特別需要處理一個挑戰：同一筆資訊可能屬於多個分類。解決方案包括： 主分類 + 標籤系統 搜尋功能作為補充 情境導航連結 IA 成功因素 以公民旅程為核心的設計 ：從使用者的生活階段出發 多入口點策略 ：提供多種查找資訊的方式 清晰的服務分類 ：將複雜的政府業務轉化為易懂的服務項目 一致性的標籤系統 ：避免同一服務有不同名稱 5.4 Netflix 串流平台 IA 網站概況 全球最大串流影音平台 數萬部影視作品 個人化推薦為核心 IA 設計策略 1. 矩陣型導航為主 Netflix 幾乎完全依賴矩陣型導航： 首頁（個人化矩陣） ├── 因為你看了 X 而推薦 ├── 熱門趨勢 ├── 按類型分類（動作、喜劇、劇情...） ├── 按