在台灣經營電商，最容易被忽略卻最致命的問題之一，就是網站速度。多數老闆會花大錢買廣告、找網紅、做促銷，卻很少有人認真盯著自己的網站到底要載入幾秒。事實上，速度是整條轉換漏斗的隱形破口：流量買進來了，頁面卻慢半拍，消費者在你還沒把商品圖載出來之前就按了上一頁。這不只是體感問題，Google 早已把使用者體驗量化成一組可衡量的指標，也就是 Core Web Vitals。本文以 ECPRO 編輯實際協助品牌健檢的經驗，完整講清楚速度為何影響轉換與 SEO、三大指標怎麼看、用什麼工具量、常見的拖慢原因，以及開店平台用戶到底能做與不能做哪些事。
網站速度為什麼直接影響轉換與 SEO
先講結論：速度同時影響兩件你最在乎的事，一是「人會不會留下來買」，二是「Google 願不願意把你排前面」。這兩條路最後都通往營收。
從轉換的角度看，消費者的耐心是有限的。多份公開的產業研究都指出，頁面載入每多一秒，跳出率與放棄率就明顯上升；以電商常見的情境推估（屬範例估算，非保證值），首頁從兩秒拖到四秒，跳出率可能上升三到五成。對購物車與結帳頁來說更殘酷，因為這是消費者掏錢的最後一哩路，任何卡頓、跳動、按鈕沒反應，都會讓人懷疑「這網站是不是怪怪的」而中途離開。
從 SEO 的角度看，Google 自 2021 年起把 Core Web Vitals 納入排名訊號的一環。它不是唯一也不是最重要的因素，內容相關性仍排在前面，但在內容品質相近的競爭情境下，速度與體驗就成了拉開差距的關鍵。更重要的是，Google 看的是「真實使用者」的數據，而不是你在自己高速光纖上開出來的體感。這代表你必須用對的工具，看真實族群的表現。
Core Web Vitals 三大指標是什麼
Core Web Vitals 目前由三個指標組成，分別對應「載入速度」「互動回應」與「視覺穩定」。把它們想成三個面向的體檢數字，每一個都有明確的及格線。
LCP（最大內容繪製）
LCP 衡量的是頁面上「最大、最主要的內容」多久才出現，通常是主視覺大圖或主要標題區塊。對電商來說，這多半是商品主圖或首頁 banner。LCP 慢，代表使用者盯著半空白的畫面等待，這是最直接的「慢」的感受。
INP（互動到下一次繪製）
INP 在 2024 年正式取代了過去的 FID，衡量的是使用者點擊、輸入之後，畫面多久才有反應。對電商而言，加入購物車、切換商品規格、展開選單這些動作的回應速度，都會被計入。INP 差，使用者會覺得「按了沒反應」，於是連點好幾下，體驗極差。
CLS（累積版面配置位移）
CLS 衡量畫面在載入過程中「亂跳」的程度。最典型的災難是：你正要按「加入購物車」，結果上方一張圖突然載入把版面往下推，你的手指按到了旁邊的廣告。CLS 高的頁面會讓人誤觸、感到煩躁，對結帳轉換傷害特別大。
| 指標 | 衡量什麼 | 良好（及格） | 需改善 | 不佳 | 電商常見元兇 |
|---|---|---|---|---|---|
| LCP | 主要內容載入速度 | ≤ 2.5 秒 | 2.5 - 4.0 秒 | > 4.0 秒 | 未壓縮大圖、無快取、伺服器回應慢 |
| INP | 互動後的回應速度 | ≤ 200 毫秒 | 200 - 500 毫秒 | > 500 毫秒 | 過多 JavaScript、第三方腳本卡住主執行緒 |
| CLS | 版面跳動穩定度 | ≤ 0.1 | 0.1 - 0.25 | > 0.25 | 圖片未設尺寸、字體晚載、彈出元素插入 |
上表的標準值為 Google 官方公布的門檻；判定通常以真實使用者數據第 75 百分位為準，也就是「七成五的訪客」要落在良好區間才算過關。
怎麼量測：三個你該用的工具
量測分成兩種數據：一種是「實驗室數據」，在固定環境模擬一次載入；另一種是「實地數據（CrUX）」，蒐集真實 Chrome 使用者過去 28 天的表現。Google 排名看的是後者，所以兩種都要會看。
- PageSpeed Insights：免費網頁工具，輸入網址就能同時看到實驗室分數與實地 CrUX 數據，並列出具體的改善建議。這是最適合電商老闆入門的工具，不需要任何技術背景。
- CrUX（Chrome 使用者體驗報告）：真實使用者數據的來源，PageSpeed Insights 上半部那塊「實際使用者體驗」就是它。流量夠大的站才會有足夠樣本，小站可能顯示資料不足，這時要靠實驗室數據與經驗判斷。
- Google Search Console：在「網站使用體驗核心指標」報表裡，它會把你整站的網址分成良好、需改善、不佳三群，並依問題類型分組。這是看「整站」而非「單頁」的最佳入口，能讓你知道是哪一類頁面（例如所有商品頁）集體出問題。
建議的健檢節奏是：用 Search Console 找出整站的問題群組，再拿代表性的網址丟進 PageSpeed Insights 看細節，最後對照 CrUX 確認真實使用者是否真的受影響。三者搭配，才不會被單一數字誤導。
常見的拖慢原因
實務上看過上百個電商站，會發現拖慢的原因高度重複，幾乎都逃不出以下幾類。先認得元兇，後面的優化才有方向。
- 大圖未壓縮：這是電商第一大兇手。商家直接把手機拍的、或攝影棚交付的數 MB 原圖丟上去，一個商品頁十幾張圖就是幾十 MB。圖片往往佔了整頁載入量的七到八成，LCP 慢通常都怪它。
- 裝太多 App 與外掛：開店平台的 App 商店很方便，但每裝一個彈窗、評論、行銷轉盤、聊天機器人，就多載一份腳本。十幾個外掛疊加，INP 直接崩盤。
- 第三方腳本：Facebook Pixel、GA4、各家廣告追蹤碼、客服外掛、A/B 測試工具……每一個都在搶瀏覽器的主執行緒。它們對行銷很重要，但失控堆疊就是互動卡頓的主因。
- 沒有快取或快取設定不良：每次訪客進來都要伺服器重新算一次、重新傳一次，沒有善用瀏覽器快取與 CDN 邊緣快取，回訪與尖峰流量時就會明顯變慢。
- 伺服器回應慢與沒上 CDN：主機在國外、或共享主機資源被搶，使用者連線到伺服器拿到第一個位元組的時間就拖很久，後面再怎麼優化都被卡在起跑點。
具體優化做法
知道元兇之後，對策其實很明確。以下依「投報率」由高到低排列，電商可以照順序做，先把 CP 值最高的圖片處理掉。
圖片：壓縮、改 WebP、延遲載入
把圖片轉成 WebP 或 AVID 這類新格式，檔案大小通常能比 JPEG 再小三到五成（範例估算，依圖而異）。同時做三件事：依顯示尺寸輸出（別用 2000px 寬的圖去塞 400px 的版位）、為非首屏圖片加上延遲載入（lazy load），讓使用者滑到才載；以及一定要替每張圖標明寬高，避免載入時把版面推來推去造成 CLS。
減少與延後腳本
盤點所有外掛與追蹤碼，砍掉沒在用或重複的。真正必要的第三方腳本，盡量設定為非同步（async）或延後（defer）載入，別讓它們擋住主要內容。行銷碼建議透過代碼管理工具集中控管，方便檢視與清理。
CDN 與快取
上 CDN 把圖片與靜態資源放到離使用者最近的節點，台灣使用者就由鄰近節點供應，回應更快也更穩。同時設定合理的快取策略，讓回訪者直接用本機快取，減少重複傳輸。
字體優化
中文字型檔案動輒數 MB，是隱形的速度殺手。盡量使用系統字型、或對自訂字型做子集化（只保留用到的字），並設定 font-display 讓文字先用替代字顯示，避免字體晚載造成空白與跳動。
開店平台用戶能做與不能做的
如果你用的是 Shopline、Cyberbiz、91APP、easystore 這類 SaaS 開店平台，必須先認清一個現實：底層的伺服器、CDN、程式架構是平台決定的，你動不了。但這不代表你束手無策，能掌控的部分其實佔了成效的一大半。
你能做的：上架前先壓縮圖片、控制每頁圖片數量與尺寸、精簡安裝的 App 數量、定期檢查並移除沒在用的行銷腳本、挑選對速度友善的版型、避免在首頁塞滿自動輪播大圖與嵌入影片。光是把圖片管好、外掛砍乾淨，多數平台用戶的分數就能明顯回升。
你不能做、只能反映給平台的：伺服器回應時間、平台預設載入的核心腳本、主題框架本身產生的版面跳動、CDN 節點配置。這些遇到瓶頸時，正確做法是把 PageSpeed Insights 的報告整理好提供給平台客服，請他們從架構面改善，而不是自己硬改範本把網站改壞。
若你是自架（例如 WooCommerce 或自寫前端），可調整的空間就大得多，但相對地責任也全在自己身上，從主機、CDN 到程式碼都要自己顧。
行動優先：手機才是主戰場
台灣電商的行動裝置流量普遍超過七成，部分美妝、服飾類甚至逼近九成。Google 採用行動優先索引，也就是它主要看你「手機版」的表現來決定排名。這帶來兩個提醒：第一，所有量測都要以行動裝置模式為準，別被桌機的漂亮分數騙了；第二，手機的網路與運算資源比桌機差，桌機跑得動的一堆腳本，到手機上就會明顯卡頓。優化時請永遠先問「這在 4G 的中階手機上順不順」。
怎麼衡量改善有沒有用
優化不是改完就結束，要能證明它有效，否則只是工程上的自我感覺良好。建議建立這樣的衡量習慣：改動前先記錄基準（三大指標的數值與 PageSpeed 分數），改動後等 CrUX 與 Search Console 累積足夠的真實數據（通常需要數週，因為實地數據是 28 天滾動），再回頭比對。更重要的是，把速度數據和你的商業數據對照看：跳出率、加入購物車率、結帳完成率有沒有跟著變好。當你能說出「LCP 從 4 秒降到 2.3 秒，同期結帳完成率上升了 X 個百分點」（此為示範句型，數字需以你自家後台為準），速度優化才真正從技術議題變成營收議題。
速度優化沒有一勞永逸，每次換版型、裝新 App、上新檔活動，都可能讓分數退步。把 Core Web Vitals 健檢排進每月固定的營運檢查清單，就像盤點庫存一樣，才能讓你辛苦買來的每一份流量，都不會在載入畫面前白白流失。
常見問題
網站速度真的會影響 Google 排名嗎？
會，但要正確理解它的權重。Core Web Vitals 是排名訊號之一，內容相關性與品質仍排在更前面。它的角色比較像「在內容實力相近時的決勝點」：兩個內容都不錯的競爭頁面，速度與體驗較好的那個更有機會勝出。所以別期待單靠提速就衝上第一，但放著爛速度不管，等於主動讓對手贏。
PageSpeed Insights 分數要幾分才算合格？
那個 0 到 100 的分數是「實驗室」的綜合評分，方便參考但不是 Google 排名的依據。真正決定排名的是上半部「實際使用者體驗」那塊的 CrUX 數據，也就是 LCP、INP、CLS 三項是否落在良好區間。建議把目標放在三項都通過、且行動版 CrUX 顯示綠燈，而不是執著於把實驗室分數逼到 100。
我用開店平台，速度慢是平台的問題還是我的問題？
通常兩者都有，但你能控制的部分往往佔比更高。先把自己能改的做好：壓縮圖片、減少 App、清掉多餘腳本、選對版型。做完這些若仍不理想，再把 PageSpeed 報告整理給平台客服，請他們處理伺服器與框架層的問題。順序很重要，先自我健檢，再找平台。
圖片到底要壓到多小才夠？
沒有絕對數字，原則是「在不影響肉眼觀感的前提下越小越好」。實務上，商品主圖控制在 150KB 到 300KB 之間、改用 WebP 格式、依實際顯示尺寸輸出，對多數電商已經很夠用。重點不是單張多小，而是整頁的總載入量，與其追求一張圖極致壓縮，不如先減少一頁塞太多張圖。
INP 是什麼？跟以前的 FID 有什麼不同？
INP 在 2024 年取代了 FID，成為 Core Web Vitals 衡量互動性的正式指標。FID 只看「第一次互動」的延遲，而 INP 會綜合評估整個瀏覽過程中所有互動的回應表現，更貼近真實使用感受。對電商來說，這意味著加入購物車、切換規格、展開選單等每一個操作的順暢度都會被計入，過多的 JavaScript 與第三方腳本是 INP 不佳的主因。