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

Question

我正在尝试在网页上创建一个背景图片，这类似于滚筒上使用的404页面......

http://testing404image.tumblr.com/

在这里我们可以看到一个1635 * 1064像素的PNG，但看起来相当平滑。 图像的直接链接是 http://testing404image.tumblr.com/images/status_bg.png?2

当我尝试在Photoshop CS4 for Mac中创建类似的PNG（不同的颜色，但大小相同）时，生成的文件最终为＆gt; 400k，而翻转杯是90k

我尝试过使用所有Photoshop选项，包括将颜色数量减少到55，但我无法将图像降低到240k以下。

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

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

感谢您的任何建议

Answer 1

你好用

改变了颜色

  

图片＆gt;调整＆gt;色相/饱和度 - 在Photoshop CS4中

这就是结果：

你可以看到它的大小几乎相同（75k）。

尝试在

下玩游戏

  

图片＆gt;调整

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

Answer 2

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

顺便说一句，请注意，使用如此大且如此平滑的渐变，数字图像（每像素8位）无法在没有条带的情况下表现出来。该图像实际上是过采样的（您可以将其重新采样为25％或更低，并将其显示为缩放，结果基本相同）

Answer 3

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

填充渐变色时，只需取消选中Dither选项（来自Photoshop顶部工具栏）。渐变的质量和平滑度降低，因此您可以获得非常小的文件大小的PNG输出。