blogger_Blogger：知道何时使用JPG和何时使用PNG，并始终压缩它们

最新推荐文章于 2024-09-14 18:46:05 发布

cunfuxiao7305

最新推荐文章于 2024-09-14 18:46:05 发布

阅读量113

点赞数

文章标签： java 人工智能机器学习 python 数据分析

原文链接：https://www.hanselman.com/blog/bloggers-know-when-to-use-a-jpg-and-when-to-use-a-png-and-always-squish-them-both

版权

blogger

The best rule of thumb for bloggers using images in their posts is:

对于博客作者在其帖子中使用图像的最佳经验法则是：

Use JPGs for photographs, landscapes, and faces. Use PNGs for charts, graphs, screenshots and cartoons. Use GIFs only for animations, and sparingly.

使用JPG拍摄照片，风景和面部。将PNG用于图表，图形，屏幕截图和卡通。仅将GIF用于动画，并且要谨慎使用。

As with all rules of thumbs, you should use your best judgment. You should aim to understand how these two image formats work so you can make the right decision.

与所有经验法则一样，您应该使用自己的最佳判断。您应该旨在了解这两种图像格式的工作方式，以便做出正确的决定。

JPEG文件 (JPEGs)

JPGs (JPEGs) are "lossy." That means they lose data. They literally throw image data away that they figure your eyes won't see. A good example would be a landscape with a large blue sky. The image format could hold all the detail of the blue sky, literally millions of pixels saying blue, blue, dark blue, darkish blue, sky blue...or it could say "this is a whole area of mostly blueish." Sure, some detail is lost, but for the most part, it's a big blue sky, right? When you save a JPG in your paint program (like Paint.NET) and there's a quality slider for the JPG, the lower the number the more data you'll throw away.

JPG(JPEG)是“有损的”。那意味着他们丢失数据。他们从字面上扔掉了他们看不到您的眼睛的图像数据。蓝天大的景观就是一个很好的例子。图像格式可以容纳蓝天的所有细节，实际上有数百万个像素表示蓝色，蓝色，深蓝色，深蓝色，天蓝色……或者可以说“这是一个大部分为蓝色的区域”。当然，有些细节丢失了，但是在大多数情况下，它是一片蓝天，对吧？当您在绘画程序(如Paint.NET )中保存JPG时，并且JPG有一个质量滑块，数字越小，丢弃的数据越多。

PNG (PNGs)

PNGs are "lossless." That means that they don't lose data when they are saved. They are more like ZIP files than like JPGs. PNGs also are known for their ability to have transparent regions. With a JPG you might have a white background, but a similar PNG could have a transparent background and be overlaid on other graphics.

PNG是“无损的”。这意味着它们在保存时不会丢失数据。它们更像是ZIP文件，而不是JPG。 PNG还具有透明区域的能力而闻名。使用JPG，您可能会具有白色背景，但是类似的PNG可能会具有透明背景并覆盖在其他图形上。

Regardless of which one you choose, chances are that the paint app you use (even Photoshop) haven't removed all the unneeded data from your graphics files. Applications like PNGGauntlet or PNGOut can squeeze 10, 20, even 30% from a already-saved file without any loss in quality. This is especially important given the number of folks browsing on mobile devices. Bandwidth matters, and you do everyone a disservice with every one megabyte graphics file you upload to your blog.

无论选择哪种，您使用的绘画应用程序(甚至是Photoshop)都有可能没有从图形文件中删除所有不需要的数据。诸如PNGGauntlet或PNGOut之类的应用程序可以从已保存的文件中压缩10％，20％甚至30％，而不会造成质量损失。考虑到在移动设备上浏览的人数众多，这一点尤其重要。带宽很重要，上传到博客中的每1 MB图形文件都会使每个人都受到损害。

I'm a huge fan of PNGGauntlet. There's also Trimage that optimizes JPGs and PNGs on Linux, and ImageOptim for Mac.

我是PNGGauntlet的忠实粉丝。还有Trimage ，它可以优化Linux上的JPG和PNG，以及用于Mac的ImageOptim 。

PNGGaultlet works HARD. It will turn your PCs fan on, I'm sure, as it works very hard. But PNGGauntlet tries all of PNGOUT, OptiPNG, and DeflOpt and picks the best result to create the smallest PNGs.

PNGGaultlet工作困难。我敢肯定，它将非常有效，它将打开您的PC风扇。但是PNGGauntlet会尝试所有PNGOUT ， OptiPNG和DeflOpt并选择最佳结果以创建最小的PNG。

After you've got that blog post perfect, I recommend you add a "squish the graphics" step to your workflow. You'll only gain speed and happier readers.

在使该博客文章变得完美之后，我建议您在工作流程中添加一个“压缩图形”步骤。您只会获得更快的速度和更快乐的读者。