JPEG并不是适合所有类型的图片(甚至可能不是大部分图片)最轻的文件格式。在压缩级别不同的情况下，角落、直线和简单的“填充”(块状纯色)会显得模糊或有伪像。它是一种有损压缩格式，最适合于你无法清晰看到伪像的照片。直线(例如在绘画和漫画中)在PNG中压缩得非常好，而且它是无损的。GIF只有支持256种颜色的调色板，但它也是无损的，应该仅在需要IE6工作的透明或动画时使用。

所以，基本上有一个决定图片格式的方法:

• 如果需要动画或在IE6上工作的透明度，请使用GIF(请注意，PNG透明度在IE6之后起作用)
• 如果图片是照片，则使用JPEG。
• 如果需要直线(如漫画或其他绘画)或需要广泛的颜色范围和透明度(IE6不是因素)，请使用PNG。

正如评论所述，如果您不确定哪种格式适合，请尝试使用不同的压缩比例来尝试每种格式，并权衡图片的质量和大小，选择您认为最好的那一种。我只是提供一些经验法则。

你应该注意几个关键因素...

首先，有两种压缩类型：无损压缩和有损压缩。

• 无损压缩意味着图像在不降低质量的情况下变小。
• 有损压缩意味着在图像变小时，图像的质量会有所降低。如果你一次又一次地以有损压缩格式保存图像，图像的质量会逐渐变差。

还有不同的色深（调色板）：索引色和直接色。

• 索引色意味着图像只能储存有限的颜色（通常是256种），由作者控制在一个叫作“颜色映射表”中。
• 直接色意味着你可以储存许多作者并未直接选择的颜色。

BMP - 无损压缩/索引色和直接色

这是一个旧的格式。它是无损压缩的（保存时不会丢失图像数据），但几乎没有压缩，这意味着保存为BMP会产生非常大的文件大小。它可以有索引色和直接色的调色板，但这只是小小的安慰。文件大小是如此不必要的大，以至于几乎没有人会真正使用这种格式。

对于：实际上没有什么是BMP擅长的，其他格式都做得更好。

GIF - 无损/仅索引

GIF使用无损压缩，这意味着您可以反复保存图像，而不会丢失任何数据。文件大小要比BMP小得多，因为实际上使用了很好的压缩，但它只能存储一个索引颜色板。这意味着在文件中最多只能有256种不同的颜色，这听起来是相当少的，而且确实如此。

GIF图像也可以实现动画和透明。

适用于：需要较小的标志、线条图形和其他简单图像。只有在创建网站时才会实际使用。

JPEG - 有损/直接

JPEG图像旨在通过删除人眼无法注意到的信息，使详细的摄影图像尽可能小。结果它是一种有损格式，并且反复保存同一文件会导致随着时间的推移更多的数据丢失。它有数千个颜色的调色板，因此非常适合照片，但有损压缩意味着对于标志和线条图形来说效果不佳：它们不仅会看起来模糊，而且与GIF相比，这些图像的文件大小也更大！

适用于：照片。另外，渐变色。

PNG-8 - 无损 / 索引

PNG是一种较新的格式，而PNG-8（PNG的索引版本）确实是GIF的很好替代品。但遗憾的是，它有一些缺点：首先，它不能像GIF一样支持动画（虽然它可以，但只有Firefox似乎支持它，而GIF动画则被每个浏览器支持）。其次，它在旧版浏览器（如IE6）中存在一些支持问题。第三，重要的软件（如Photoshop）对该格式的实现非常差。（该死的，Adobe！）PNG-8只能存储256种颜色，就像GIF一样。

适合用于：PNG-8比GIF做得更好的主要方面是支持Alpha透明度。

PNG-24 - 无损 / 直接

PNG-24是一种很棒的格式，它将无损编码与直接颜色（成千上万种颜色，就像JPEG一样）结合起来。它在这方面非常类似于BMP，但PNG实际上压缩了图片，因此结果文件要小得多。不幸的是，PNG-24文件仍然比JPEG（对于照片）和GIF/PNG-8（对于标识和图形）大，因此您仍然需要考虑是否真的想使用它。

即使PNG-24允许使用成千上万种颜色进行压缩，但它们并不意味着要替换JPEG图像。保存为PNG-24的照片可能会比等效的JPEG图像大至少5倍，而可见质量几乎没有什么提高。（当然，如果您不关心文件大小，并想获得最佳质量的图片，则这可能是一个理想的结果。）

与PNG-8一样，PNG-24也支持透明度。另一个当前流行的文件类型是SVG，它与上面介绍的所有类型不同，因为它是一种矢量文件格式（上述都是光栅）。这意味着它实际上是由线条和曲线组成，而不是像素。当您放大矢量图像时，您仍然会看到曲线或线条。而当您放大光栅图像时，您将看到像素。这意味着SVG非常适合于您希望在Retina屏幕上以及在不同尺寸下保持清晰度的标志和图标。这也意味着可以使用较小的SVG标志在更大的（更大）尺寸上使用，而不会影响图像质量——这在光栅格式中需要单独的较大（以文件大小计）文件。SVG文件的大小通常非常小，即使它们在视觉上非常大，这是很棒的。然而，需要注意的是，这取决于所使用的形状的复杂性。 SVG需要比光栅图像更多的计算能力，因为涉及到绘制曲线和线条的数学计算。如果您的徽标特别复杂，它可能会减慢用户计算机的速度，甚至具有非常大的文件大小。因此，重要的是尽可能简化矢量形状。此外，SVG文档是以XML格式编写的，因此可以在文本编辑器中打开和编辑(!)。这意味着它的值可以即时操作。例如，您可以使用JavaScript更改网站上SVG图标的颜色，就像您处理文本一样（即无需第二个图像），甚至可以进行动画处理。总的来说，它们最适合简单的平面形状，如徽标或图表。