优化图像深度

今年我学到的一件事（或者，我想说，是重新学到的一件事）是，密切关注图像的位深度有多重要。在很久以前，我们曾经痴迷于在GIF中选择2位、4位或8位的颜色深度，因为当时很多用户使用拨号调制解调器上网，每个千字节都很重要。

现在，我们中的很多人通过宽带访问网络，猜猜怎么了？每个千字节仍然很重要。因为并非每个人都能使用宽带，尤其是在移动领域；而且，任何时候我们都能减少页面渲染时间都是值得追求的。我以为优化工具会处理像颜色深度优化这样微不足道的事情，但后来发现我错了。

对于PNG来说，这一点尤其如此。默认情况下，许多图像编辑工具会将PNG保存为2^24颜色深度，以防万一。

对于照片来说，这样做有一定道理（尽管如果它是照片，你可能应该将其保存为JPG或WebP），但对于徽标和图标之类的东西来说，这大约比你将要使用的颜色多出2^24种。

所以在我的首选图像编辑器Acorn中，我一直特别注意在导出对话框中降低PNG的位深度。在许多情况下，我通过将颜色索引到最多256个值的调色板，从而将图像大小减少了80%或更多，而不会损失视觉保真度。（再说一遍，我说的不是照片。）

这是一个例子

那个全彩色深度的PNG大约为379KB。限制为32色调色板，它的大小为61KB。这仅仅是在导出时：一旦我通过ImageOptim运行它们，优化后的尺寸分别为359KB和48KB。仅仅通过降低颜色深度，就可以节省大约85%的重量。如果我部署了该图像并发现它需要更多颜色，我可以重新运行该过程以使用64种颜色：在这种情况下，最终大小为73KB，仍然节省了巨大空间。

用肉眼降低颜色深度显然比对图像目录使用优化脚本更麻烦，但根据我的经验，在图像大小和用户体验方面，结果效率更高。而这才是这一切的意义所在，不是吗？