設計師需要看數據嗎？需要
「我是設計師，數據是 SEO 和行銷的事。」這句話放在十年前可能還說得通，但現在不行了。
Google Search Console（以下簡稱 GSC）裡面有一大堆跟設計直接相關的數據——你的網站在手機上有沒有問題、頁面載入速度夠不夠快、哪些頁面的設計讓使用者一看就跳出去。這些資訊如果設計師不看，等於是蒙著眼睛做設計。
根據 Sistrix 的研究，Google 搜尋結果第一名的平均點擊率是 28.5%，第二名掉到 15.7%，到第十名只剩 2.5%。你的設計品質直接影響 Core Web Vitals 分數，而 Core Web Vitals 又是 Google 排名的參考因素之一。設計師如果能從 GSC 數據中找到改善方向，對整個網站的搜尋表現都有幫助。
這篇會從設計師的角度，帶你看 GSC 裡最重要的幾個報表，以及怎麼把這些數據轉化成具體的設計改善行動。
行動裝置可用性報表：手機版設計的健檢報告
這可能是 GSC 裡面對設計師最直接相關的報表。它會告訴你哪些頁面在手機上有問題，而且會具體指出是什麼問題。
常見的行動裝置問題
「文字太小，無法閱讀」 Google 認為手機上的文字至少要 16px 才能讓多數使用者輕鬆閱讀。如果你的設計用了 12px 或 14px 的內文字體，GSC 就會標記這個問題。
「可點擊的元素過於靠近」 兩個按鈕或連結之間的距離太近，手指點擊的時候容易誤觸。這通常出現在導航列的選項太密集，或是表單的欄位和按鈕擠在一起的情況。
「內容超出螢幕」
頁面上有元素的寬度超過了螢幕寬度，導致出現水平捲軸。這常常是因為圖片沒有設定 max-width: 100%，或是某個 table 的寬度是固定值。
設計師該怎麼用這個報表
每次做完一個網站或完成改版之後，過一兩週來 GSC 看一下這個報表。如果 Google 抓到了行動裝置問題，修好之後可以在 GSC 裡面按「驗證修正」，Google 會重新檢查。
這比你自己用手機看一看就覺得沒問題要可靠得多——你只有一支手機，但你的使用者可能用各種不同尺寸的螢幕。
Core Web Vitals 報表：你的設計跑多快
Core Web Vitals 報表用真實使用者的數據告訴你，你的頁面載入體驗到底好不好。這不是模擬測試，是真實的使用者數據。
LCP（Largest Contentful Paint）
最大內容繪製——也就是頁面上最大的那個元素（通常是 Hero 圖片或標題）需要多久才能顯示出來。標準是 2.5 秒以內。
設計師能做的事：
- 首屏的 Hero 圖片用 WebP 格式，控制在 150KB 以內
- 如果用背景影片，用靜態圖片作為 poster 先顯示
- 避免首屏使用需要額外 HTTP 請求才能載入的網路字型
INP（Interaction to Next Paint）
互動延遲——使用者點了一個按鈕之後，畫面多久才有反應。標準是 200 毫秒以內。
設計師能做的事：
- 不要在頁面上放太多 JavaScript 動畫效果
- 複雜的互動效果（比如圖片 gallery 的切換）要用 CSS transition 而不是 JS 動畫
- 避免在滾動事件中觸發大量的 DOM 操作
CLS（Cumulative Layout Shift）
累積版面位移——頁面載入過程中版面跳動的程度。標準是 0.1 以下。
設計師能做的事：
- 所有圖片和影片都要標示寬高比（
aspect-ratio或明確的 width/height） - 廣告版位預留固定空間
- 自訂字型載入時使用
font-display: swap並選擇 fallback 字型外觀接近的系統字型
搜尋成效報表：哪些頁面的設計值得參考
搜尋成效報表顯示你的每個頁面在 Google 搜尋中的曝光數、點擊數、點擊率和平均排名。對設計師來說，這些數據可以幫你找到「設計做得好」和「設計需要改善」的頁面。
高曝光低點擊率的頁面
如果一個頁面在搜尋結果中出現了很多次（曝光高），但很少人點進來（CTR 低），問題可能出在 title 和 description 不夠吸引人。這不完全是設計師的問題，但如果你負責的是整個網站的 UX，你可以建議行銷團隊改善這些頁面的標題。
高點擊低停留的頁面
這個數據需要搭配 GA4 來看。如果使用者點進來了，但馬上就離開（停留時間很短），問題可能出在頁面的設計——內容版面不好讀、載入太慢、或是跟搜尋意圖不符。
表現最好的頁面
找出點擊率和停留時間最好的頁面，分析它們的設計有什麼共通點——版面配置、圖片使用方式、CTA 位置、內容結構。然後把這些優點複製到其他頁面。
索引問題排查：設計師也該知道的技術細節
GSC 的「索引」報表會告訴你 Google 爬蟲在抓取你的網站時遇到了什麼問題。有些索引問題是設計決策造成的。
「已找到但目前未建立索引」
Google 發現了你的頁面但選擇不索引它。可能的原因之一是頁面內容太少——如果你設計了一個頁面只有一張大圖和三行字，Google 會認為這個頁面沒什麼價值。
「軟式 404」
頁面實際上存在，但內容太少讓 Google 以為它是 404 錯誤頁。這在電商網站上很常見——篩選結果為零的分類頁面，只顯示「沒有找到商品」一行字。設計師應該為這種頁面設計有意義的內容，比如推薦相關商品。
JavaScript 渲染問題
如果你的網站大量依賴 JavaScript 來渲染內容（比如 SPA 架構），Google 的爬蟲可能看到的頁面跟真實使用者看到的不一樣。GSC 的「網址檢查」工具可以讓你看到 Google 實際「看到」的頁面長什麼樣。
這對設計師來說是一個重要的提醒：你用 JavaScript 做的華麗互動效果，Google 不一定看得到。核心內容應該在初始 HTML 中就存在，不要完全依賴 JavaScript 渲染。
一個實際案例：從 GSC 數據改善設計的醫療診所網站
我們曾協助一間台北的皮膚科診所改善他們的網站。這個網站的設計在視覺上看起來很不錯，但 GSC 的數據揭露了幾個嚴重的問題。
GSC 發現的問題
- 行動裝置可用性報表顯示 47 個頁面有「文字太小」的問題
- Core Web Vitals 報表中，72% 的頁面 LCP 超過 4 秒（標準是 2.5 秒）
- 搜尋成效數據顯示，最熱門的關鍵字「皮膚科推薦」排在第 14 名，CTR 只有 0.8%
- 索引報表有 23 個頁面被標記為「已找到但目前未建立索引」
我們做了什麼設計改善
- 全站內文字體從 14px 調到 17px，行高從 1.4 調到 1.8
- 所有頁面的 Hero 圖片從 PNG 轉為 WebP，檔案大小平均減少 65%，LCP 從 4.2 秒降到 1.8 秒
- 把那 23 個內容太少的頁面重新設計，加入更完整的衛教資訊和常見問題
- 優化手機版的導航列，從下拉選單改為漢堡選單加上底部固定導航
三個月後的結果
- 行動裝置問題從 47 個降到 0 個
- Core Web Vitals 全部通過（綠燈）
- 「皮膚科推薦」排名從第 14 名爬到第 6 名
- 整體自然流量提升了 38%
這個案例說明了一件事：GSC 的數據不是給 SEO 人員看的報告，它是給設計師看的改善指南。
設計師應該多久看一次 GSC
不需要每天看，但也不能都不看。建議的頻率是：
每週看一次 快速瀏覽行動裝置可用性和 Core Web Vitals 有沒有新的紅色警示。如果有，優先處理。
每月看一次 看搜尋成效的趨勢變化。哪些頁面的表現在進步？哪些在退步？退步的頁面是不是最近有做過設計調整？
每次改版後看 網站改版或做了大幅度的設計變更之後，等 2-3 週讓 Google 重新抓取，然後來 GSC 檢查有沒有產生新的問題。
結語：數據驅動的設計才是好設計
好的設計不只是好看，還要好用、好找、好快。GSC 提供的數據讓你能用客觀的方式評估自己的設計品質，而不是憑感覺。
花 30 分鐘學會怎麼看 GSC 的關鍵報表，然後每週花 10 分鐘檢查一下數據。這個小小的習慣可以讓你的設計品質持續進步，也能讓你在跟客戶溝通的時候更有說服力——「你看，改了設計之後，Google 的數據顯示載入速度快了 60%、排名上升了 8 個位置」。如果你需要一個從設計到技術 SEO 都考量周全的網站，澳戰的網頁設計服務能幫你從架構面打好基礎。
用數據說話的設計師，客戶不會跑掉。