為什麼 WordPress 圖片上傳後看起來模糊（以及解決方法）

十之八九你的圖片其實並不模糊——WordPress 在上傳時把它縮小了，現在提供的是那份被限制尺寸的副本。從 WordPress 5.3 起，任何寬度或高度超過 2560px 的圖片，都會被悄悄替換成最長邊上限為 2560px 的 -scaled 版本，而那個較小的檔案就是你的佈景主題拿去撐滿主視覺、全寬區塊或視網膜螢幕的來源。解決方法是先證明事情確實如此，然後要嘛提高門檻值，要嘛別再上傳那些需要比其顯示框更大的圖片。

為什麼會發生

當你上傳一張相片時，WordPress 會執行 wp_create_image_subsizes()（位於 wp-admin/includes/image.php）。如果最長邊超過 big_image_size_threshold——預設為 2560px——它就會呼叫 _wp_image_meta_replace_original()，產生 your-photo-scaled.jpg，並改寫附件的中繼資料，讓 full 尺寸現在指向那份縮放後的副本。你真正的原始檔會以 your-photo.jpg 保留在磁碟上，並由 wp_get_original_image_path() 參照，但前端不會提供它。每一個中間尺寸、每一個 srcset 候選項，都是從那份 2560px 的縮放檔案產生的，而不是從你上傳的檔案。

模糊就是這樣來的。你為一個滿版標題上傳了一張清晰的 4000px 圖片，WordPress 把它限制到 2560px。在標準螢幕、1600px 寬的容器裡，這沒問題。但在 2x 視網膜螢幕上，瀏覽器大約需要 3200 個實際像素才能清晰填滿那個容器，卻只有 2560 個，於是它把差距放大補足。邊緣變軟、圖片裡的文字糊掉——正是那種「上傳後變模糊」的症狀。

同一個問題的另一半，是 srcset 挑了一個太小的尺寸。如果你的佈景主題回報的內容寬度與實際算繪出的框不符，WordPress 就會交給瀏覽器一個 -1024x683 或 -1536x1024 的中間檔，然後它被放大拉伸。成因相同——顯示框大於可用像素——只是觸發點不同。

檢查 WordPress 實際提供了什麼

別用猜的。在模糊的圖片上按右鍵，用新分頁開啟它，看看網址裡的檔名。如果它以 -scaled.jpg 結尾，或帶有像 -1024x683.jpg 這樣的尺寸後綴，就確認了：瀏覽器算繪的是縮小後的衍生檔，而不是你上傳的原檔。你也可以檢視元素、讀取 currentSrc，看瀏覽器究竟選了哪個候選項。

在重新上傳任何檔案之前，若想看清全貌，把圖片丟進 WordPress 圖片尺寸工具——它會顯示 WordPress 從那個確切檔案將產生的每一份衍生檔，包括是否會建立 -scaled 副本以及其尺寸，讓你事先就知道你的來源檔對於要擺放的位置是否夠大。

在伺服器上，你可以列出每一個被限制尺寸的檔案：

find wp-content/uploads -name '*-scaled.*'

如何解決，依序進行

1. 如果你的圖片確實需要大於 2560px（大型主視覺、視網膜、印刷品質相簿），就提高門檻值：

// functions.php or a small mu-plugin
add_filter( 'big_image_size_threshold', function () {
    return 3840; // longest edge, in pixels
} );

或是完全關閉這個上限：

add_filter( 'big_image_size_threshold', '__return_false' );

2. 重新上傳受影響的圖片。 這是大家會跳過的步驟。更改門檻值只會影響新上傳的檔案。已經在你媒體庫裡的圖片仍保留舊的中繼資料，而重新產生縮圖是從那個被限制尺寸的 -scaled 檔案重建中間尺寸——它並不會把已經丟棄的解析度加回來。可靠的做法是：更改篩選器、刪除該附件、再重新上傳。

3. 如果你的來源檔已經 ≤2560px 卻仍然模糊， 那門檻值就不是你的問題——是顯示框比圖片還大。上傳一個更大的來源檔，或縮小容器。若要視網膜等級的清晰度，你的來源檔需要大約是它所填滿之框 CSS 像素寬度的兩倍。

4. 只有在做完上述步驟之後，才重新產生縮圖，讓中間尺寸保持一致——但要明白這是善後清理，不是治本。

不該做的事

別把 JPEG 品質調到 100。 WordPress 透過 wp_editor_set_quality 以預設品質 82 進行壓縮，而網路上一半的建議都叫你覆寫它：

add_filter( 'wp_editor_set_quality', function () { return 90; } );

要減少壓縮產生的雜訊，這麼做沒問題，但一張被拉伸、被放大的圖片是解析度問題，不是壓縮問題。從 82 調到 100 會讓你的檔案變肥，對你看到的那種模糊幾乎沒有幫助。

別反射性地停用 -scaled。 關閉這個上限（有個工具可以做這件事）是正確的選擇——前提是你會提供大於 2560px 的圖片——但如果你真正的問題是一個太小的中間檔被拉伸，停用它什麼也改變不了，還讓你白白失去節省頻寬的好處。先診斷。

別先怪快取或先重新產生縮圖。 重新產生會從同一個被限制尺寸的來源檔讀取，所以它無法還原細節。清除 CDN 或頁面快取，也動不了一個一開始在磁碟上就很小的檔案。

別去動佈景主題的 CSS 或 object-fit。 再多的樣式設定也加不出像素。如果提供的檔案以 -scaled 或尺寸後綴結尾，問題出在檔案，不是版面配置。

還是卡住了？

如果你已經確認提供的檔案就是你的全解析度上傳檔——沒有 -scaled、沒有尺寸後綴——卻仍然發軟，就檢查是否有某個外掛（最佳化工具、CDN 圖片縮放器，或延遲載入函式庫）把你的 src 改寫成一個壓縮過的代理檔。把圖片丟進圖片尺寸工具確認 WordPress 應該產生什麼，然後拿它跟瀏覽器實際載入的內容比對。當這兩者不一致時，罪魁禍首就在 WordPress 與瀏覽器之間的某個環節。