png - 如何减小渐变 PNG 的文件大小？

Question

我正在尝试在网页上创建背景图片，类似于不倒翁上使用的 404 页面...

在这里，我们可以看到一个 1623*1064 像素的 PNG，但在渐变方面显得相当平滑。图片的直接链接是 http://testing404image.tumblr.com/images/status_bg.png?2

当我尝试在 Mac 的 Photoshop CS4 中创建类似的 PNG（不同颜色，但大小相同）时，生成的文件最终大于 400k，而 tumblers 为 90k

我尝试使用所有 Photoshop 选项，包括将颜色数量减少到 55，但我无法获得低于 ~240k 的图像。

我还尝试了各种优化工具，例如 ImageOptim (http://imageoptim.com/)，但无济于事。

此 PNG 是否有任何属性导致文件大小如此之小？我尝试使用 JPG，认为它更适合渐变图像，但即使是 100% 质量的 JPG 也会导致明显的锯齿，这是相同内容/大小的 PNG 所没有的。

感谢您的任何建议

score 1 · Accepted Answer

Photoshop 对 PNG 不是很好：我只是用不起眼的 xnView（最大压缩）打开并保存它，得到 74K。您还可以将其转换为调色板图像，并进行一些额外的微调 - PNGoptim 给我的最终尺寸为 64.548。我不希望有比这更好的东西，图像太大了。

顺便说一句，请注意，使用如此大且如此平滑的渐变，以至于数字图像（每像素 8 位）无法在没有一些条带的情况下表示它。该图像确实过采样（您可以将其重新采样为 25% 或更少并按比例显示，结果将基本相同）

score 1 · Accepted Answer

嗨，那里改变了颜色

图像 > 调整 > 色相/饱和度 - 在 Photoshop CS4 中

这是结果：

如您所见，它的大小几乎相同（75k）。

试着在下面玩

图像 > 调整

获取您正在寻找的颜色并保存为 png 并使用 NONE 进行隔行扫描。

score 0 · Accepted Answer

实际原因是您希望源图像的渐变质量低于您正在制作的图像。

填充渐变颜色时，只需取消选中该Dither选项（从 Photoshop 的顶部工具栏中）。渐变的质量和平滑度会降低，因此您会得到一个非常小的文件大小的 PNG 输出。

3 回答 3