【问题标题】:PNG Compression [closed]PNG压缩[关闭]
【发布时间】:2014-08-16 20:47:44
【问题描述】:

一些 PNG 图像虽然只有 150 像素 x 160 像素宽,但文件大小为 60KB。我已经通过优化器(ImageOptim for Mac)运行了它们,但这并没有多大帮助。

有没有办法进一步压缩它,无论是手动还是使用其他工具?正常的 150x160 图像 60KB 实在是不可接受,我不能在那里使用 JPG 或 GIF,因为我需要透明度。

我尝试将 PNG 导出为 8 位 PNG,但文件大小已显着减小!

【问题讨论】:

    标签: image optimization png


    【解决方案1】:

    这与 PNG 压缩的工作原理有关。

    与 JPEG 不同,PNG 是一种无损格式,在位置方面,但不一定在颜色方面。

    也就是说,JPEG 存储从一个区域到另一个区域的颜色转换,而 PNG 逐像素存储数据,然后无损压缩此数据。

    GIF 和 PNG 之间的区别实际上来自于传统约定 - GIF 传统上保存为 8 位,而后来出现的 PNG 通常保存为 32 位(真彩色 + alpha/透明度)。因此,32 位图像每个像素需要四倍的未压缩数据,并且根据图像的具体情况,数据越详细,无损压缩越差。

    因此,如果您要将 8 位 PNG 与 8 位 GIF 进行比较,文件大小应该非常相似。这同样适用于真彩色 PNG 和真彩色 GIF。这解释了为什么选择 8 位选项将解决文件大小问题。否则,它实际上是一个压缩的 BMP。

    【讨论】:

      【解决方案2】:

      你试过PNGOUT吗?

      【讨论】:

      • +1 来自我。除此之外,PNG Gauntlet 为您提供了一个不错的 PNGOUT 窗口前端,如果您想要的话,它是免费的。 pnggauntlet.com
      【解决方案3】:

      在 Smashing Magazine 上有几篇关于优化 PNG 图像的好文章,Clever PNG Optimizaiton TechniquesPNG Optimization Guide: More Techniques。这些重点是您可以对源图像进行的操作,以使它们更好地用于 PNG 压缩器。

      除此之外,我建议使用像 OptiPNGPNGCRUSH 这样的工具。

      【讨论】:

        【解决方案4】:

        尝试导出与 8 位 PNG 相同的 PNG,文件大小显着减小。

        步骤:

        • 在 Photoshop 中打开 PNG
        • 文件 > 为 Web 和设备保存
        • 从“预设”下拉菜单中选择“PNG-8 128 Dithered”
        • 保存

        将 31kb 的图像缩小到 10kb。

        【讨论】:

        • 但是,您会失去 Alpha 透明度。
        • 这只是 Photoshop 错误/限制。您可以使用 pngquant/ImageAlpha 获得 8 位 alpha 透明度。
        【解决方案5】:

        是的,您可以使用pngquant 将 PNG 缩小 60-70%。有一个Mac GUI

        它通过将 RGBA PNG 转换为 8 位调色板 PNG,但是,与 Photoshop 不同,它保留了 alpha 通道。

        【讨论】:

          【解决方案6】:

          我们在大多数最新的网站项目中都遇到了类似的问题/问题,并通过 PHP、.htaccess 和 Javascript 开发了解决方案。我写了两篇关于理论 (part 1: "shrinkImage - A method to reduce the filesize of PNG-images with full alpha-channel by about 70-80%") 和我们最终得到的实用 jQuery 插件 (part 2: "shrinkImage continued - jQuery plugin and automatic generation") 的文章。

          如果您的问题的背景是在网络服务器上使用的,则可以选择检查一下。

          我们解决方案的背景(简而言之)是将 alpha 通道从图像的其余部分中分离出来,并将其保存为一个相当小的 PNG,将颜色信息保存为具有可变压缩的 JPEG,并将两者作为 JSON 文件存储在我们的服务器上这是由 jQuery 插件通过 HTML5 Canvas 请求和处理的(如果支持,否则插件会优雅地回退到原始 PNG)。

          希望这可以帮助您或其他面临同样问题的人,即使这个问题已经相当老了:)

          【讨论】:

            【解决方案7】:

            它已经在评论中被引用,但它应该得到自己的答案。刚刚下载PNG Gauntlet。作为一个真正不想学习命令行开关和 PNG 选项的人,这正是我所需要的:一个简单、非常易于使用的 Windows 实用程序,您只需在其中添加图像并单击按钮即可。

            我从阅读其他网站得到的印象是它不是世界上最快的工具,但这对我来说不是问题(一旦你得到了压缩图像,你就可以排序了)。

            第一个文件从 126k 减少到 47k,这对我有用。

            【讨论】: