優化圖像深度

今年我重新學習到一個重要知識點：密切關注圖像的位深度。過去，我們常常糾結於GIF圖像的2位、4位或8位顏色深度，因為當時許多用戶使用撥號調製解調器上網，每個KB都很重要。

現在，大多數人使用寬帶連接互聯網，但你猜怎麼著？每個KB仍然很重要！因為並非每個人都能使用寬帶，尤其是在移動領域；而且，任何能夠減少頁面渲染時間的優化都值得嘗試。我之前以為優化工具會處理諸如顏色深度優化之類的瑣碎事情，但事實並非如此。

這對於PNG圖像尤其如此。默認情況下，許多圖像編輯工具會以2^24顏色深度保存PNG圖像，以防萬一。

對於照片來說，這樣做有一定的道理（儘管如果是照片，你應該將其保存為JPG或WebP格式），但對於徽標和圖標之類的圖像，這大約比你實際使用的顏色多2^24種。

因此，在我的首選圖像編輯器Acorn中，我特別注意在導出對話框中降低PNG圖像的位深度。在許多情況下，我通過將顏色索引到包含256個或更少值的調色板，將圖像大小減少了80%或更多，而不會損失視覺保真度。 （再次強調，我這裡說的不是照片。）

以下是一個示例：

全彩色深度的PNG圖像大小約為379KB。限制為32色調色板後，大小為61KB。這只是導出時的尺寸：一旦我使用ImageOptim對其進行處理，優化後的尺寸分別為359KB和48KB。僅僅通過降低顏色深度，就能節省大約85%的重量。如果我部署圖像後發現需要更多顏色，我可以重新運行該過程以使用64種顏色：在這種情況下，最終大小為73KB，仍然節省了巨大空間。

通過肉眼減少顏色深度顯然比將優化腳本應用於圖像目錄更費力，但根據我的經驗，這種方法在圖像大小和用戶體驗方面效率更高。而這才是這一切的核心，不是嗎？

以上是優化圖像深度的詳細內容。更多資訊請關注PHP中文網其他相關文章！