網站讓我們脫離現實，地圖卻能將數字世界與物質世界重新連接。Reif Larsen 云：「地圖不僅是圖表，它形成這裡與那裡，搭建不同想法的橋梁。」為什麼無數網站仍用默認灰藍 Google Maps？個性何在？定制體驗何在？設計何在？

核心概念：Tiles（瓦片）

地圖按瓦片加載，而非一次性下載。基礎地圖瓦片可完全自定義：顏色、標簽字體、符號系統。對比 Google Roads vs Ordnance Survey：同樣精準環境信息，完全不同視覺語言。精心設計的基礎地圖 = 品牌延伸 + 信息篩選（只顯示目標內容）。

可訪問性關鍵

• 標簽排版：字體選擇同等嚴謹
• 色盲安全：光譜色編碼數據/地形時，必須驗證色盲可辨識性
• 縮放層級信息密度控制：避免雜亂

Michael K Owens Check-in 頁：定制基礎地圖完美融入品牌視覺體系。

數據視覺化：數據瓦片

Plymouth Marine Laboratory 用瓦片顯示北海鱈魚數量分布，光譜色編碼密度。瓦片不僅承載基礎地圖，更是數據視覺化載體。

功能要素

特定小區域用功能表示：多邊形(郵編邊界)、線(路線)、點(POI)。設計挑戰：如何讓用戶理解數據含義？ Choropleth map 需清晰圖例，顏色/形狀編碼需經審美判斷而非純學科知識。

技術棧選型指南

方案	核心特點	適配場景	限制
Google Maps API	Styled Maps 自定義樣式、GeoJSON/KML 支持、Maps Engine 進階可視化	快速接入、需 Google 生態數據	無自定義 WMS/WFS、API 配額限制
Leaflet	輕量(39KB)、開源、無 API 限制、支持 WMS/自定義瓦片模板	自建瓦片服務、追求完全控制權	需自行維護基礎地圖數據
Mapbox	免費增值、Mapbox Studio 可視化樣式表編輯、海量數據源、跨平台 SDK	設計師主導地圖樣式、需豐富數據源	高級功能收費、瓦片導出後綁定生態
OpenLayers 3	功能最全、OGC 標準完整支持(WMS/WFS/WCS)、企業級	複雜 GIS 應用、標準合規要求高	體積大、學習曲線陡峭

UI 設計決策框架

1. 是否需要縮放？ 通常是，提供更多環境脈絡
2. 基礎地圖切換必要性？ Google 風格下拉選單佳：選項少、場景差異大
3. 數據層顯示/隱藏交互？ 簡單下拉 vs 搜索，取決於圖層數量與用戶專業度
4. 移動端優先：觸控縮放、手勢旋轉、GPS 定位一鍵居中

實踐建議

隨意放張 Google Maps 如同網站只用默認字體/顏色。**地圖設計 = 品牌設計的延伸**。選擇工具前先定義：

• 地圖承載什麼核心任務？（導航/數據洞察/品牌氛圍）
• 目標用戶地圖素養如何？
• 數據更新頻率與來源？

概念與標準不變，工具在變。掌握 Tiles/WMS/WFS/功能要素核心模型，才能在工具更迭中保持設計主導權。