圖片應準備多少變體，又該如何管理？

圖片變體沒有一套適用所有頁面的固定數量。應依圖片在頁面上的顯示尺寸、使用者裝置與實際用途，準備合理的候選圖片，再衡量使用者體驗。全寬主視覺可能比商品列表縮圖需要更多變體；管理重點不是把所有尺寸與格式備齊，而是在圖片適配程度、快取效率、伺服器成本與 HTML 大小之間取得平衡。

先按圖片用途決定需求，不替每張圖套用同一份清單

web.dev 提醒，不同圖片可能有不同的最佳化結果，因此不能只按網站統一規格決定變體數量。即使同在一個電商網站，首頁全寬主視覺與商品列表縮圖，也不一定需要相同的候選尺寸。

• 全寬主視覺：應依它在頁面中的尺寸及使用者裝置評估，可能需要較多變體。
• 商品列表縮圖：不必直接沿用主視覺的變體清單，應按縮圖本身的顯示需求決定。
• 不同圖片：即使用途相近，也應衡量最佳化結果，不預設增加變體一定能改善體驗。

變體越多，不代表整體效能越好

更多候選圖片有機會提供更貼近需求的版本，但每增加一個變體，都有管理與傳送上的代價。材料指出，每個變體需要各自的快取項目；相較於所有使用者取得同一版本，許多變體可能使快取利用較不有效率。

• 快取與回源：若某個變體的快取已過期，需要重新向來源伺服器取得圖片，可能降低效能。
• 伺服器成本：變體增加可能帶來更高成本，不能只比較單次傳送的圖片是否合適。
• HTML 大小：在 HTML 中逐一列出尺寸與格式候選，也會增加標記量。

這不表示只留一個版本最好，而是新增候選時，也要一起衡量上述代價，避免把「版本齊全」當成最佳化成果。

用體驗衡量結果，讓工具協助處理格式

管理上可先按用途整理候選圖片，再衡量這些選擇對使用者體驗的影響，據此調整數量，而不是一開始就追求最多版本。評估時應同時考慮圖片在頁面中的尺寸與使用者裝置，不能直接把某張圖的結果套用到其他圖片。

圖片 CDN 是可考慮的工具：它能協助最佳化圖片，並依使用者裝置與瀏覽器提供適合的格式。不過，格式選擇與變體數量仍是不同問題；採用 CDN 並不取代對候選數量、快取代價及實際體驗的衡量。