在设计网站时，您认为用于特定任务的最佳图像格式是什么？
当我试图找出用于特定任务的格式时，我总是陷入两难境地……例如，我应该全面使用 .jpg 吗？ 或者，何时以及为什么应该使用 .png？
例如，以 Amazon 的网站为例，他们使用 .jpg 作为产品图片 (Example)，.gif对于这个透明像素 (Example) 和 .png 对于他们的 CSS Sprites (Example)
另一方面，Play.com 使用 .gif 作为其网站徽标 (Example)，但使用 .jpg 作为其网站产品（如亚马逊) (Example) 并且就他们的主页而言，他们没有任何 .png。
那么我应该为我的网站使用哪些格式？我为什么要使用它们？
[更新]
【问题讨论】：
标签： image-formats
JPEG 用于照片。我偶尔会看到带有文本的 JPEG，它们看起来很糟糕。文本最适合文本，否则使用 PNG。
如果不是照片，但您想要一张图片，请使用 PNG。 PNG 几乎总是比等效的 gif 文件小，并且不会像 JPEG 文件那样丢失质量。相当于 JPEG 的 PNG 通常会大很多（假设它是逼真的）。有时这仍然是可取的。
PNG 确实允许 8 位透明度，但如果您必须支持 IE，您会发现他们不断拒绝正确支持。据我所知，他们确实支持 8 位图像（基本上与 gif 相同）中的一点透明度。还有许多技巧可以让 8 位透明度在 IE 中工作。我自己从来没有打扰过。
总结：
【讨论】：
PNG可以在以下情况下使用：
JPEG可以在以下情况下使用：
GIF可以在以下情况下使用：
尽管存在相反的神话，但在同类比较方面，PNG 在所有方面都优于 GIF。 PNG除了动画之外，还支持GIF的所有图像模式，并且在使用相同的图像模式时，PNG由于其优于LZW的DEFLATE算法而具有更好的压缩率。 PNG 还具有 GIF 无法做到的其他模式，例如 24 位颜色和多位透明度（alpha 透明度）。请注意，当人们使用 IE6 时，多位透明度曾经是一个问题。
PNG 模式包括（这只是一小部分）
为了在 Web 上使用 PNG 的最佳压缩效果，请始终使用调色板模式。如果您发现 PNG 文件比同等的 GIF 文件大，那么您很有可能将 PNG 保存为 24 位颜色，而将 GIF 保存为调色板模式（因为保存全彩色 GIF 总是需要转换为调色板模式）。在这两种情况下，在保存之前尝试将图像转换为调色板模式。
PNG 还具有其他模式，例如调色板中带有 alpha 透明度的调色板颜色。此类模式可在浏览器中使用，但由于不支持这些图像模式，Photoshop 等软件在创建或使用它们时存在（或曾经存在）问题。
【讨论】：
你应该知道几个关键因素...
无损意味着图像变小，但不影响质量。 有损意味着图像被制作（甚至）更小，但有损质量。如果您一遍又一遍地以有损格式保存图像，图像质量会越来越差。
还有不同的颜色深度（调色板）：Indexed color 和 Direct color。
Indexed 表示图片只能存储图片作者选择的有限数量的颜色（通常为 256 种），Direct 表示您可以存储数千种作者没有选择的颜色。
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 Transparency。
重要提示： Photoshop 不支持 PNG-8 文件的 Alpha 透明度。 （该死的，Photoshop！）有一些方法可以将 Photoshop PNG-24 转换为 PNG-8 文件，同时保持其透明度。一种方法是PNGQuant，另一种方法是使用Fireworks 保存文件。
PNG-24 - 无损/直接
PNG-24 是一种很好的格式，它结合了无损编码和直接颜色（数千种颜色，就像 JPEG）。在这方面它非常像 BMP，除了 PNG 实际上压缩图像，因此它产生的文件要小得多。不幸的是，PNG-24 文件仍将比 JPEG、GIF 和 PNG-8 大得多，因此您仍然需要考虑是否真的要使用它们。
尽管 PNG-24 在进行压缩时允许使用数千种颜色，但它们并非旨在取代 JPEG 图像。保存为 PNG-24 的照片可能至少比等效的 JPEG 图像大 5 倍，而可见质量几乎没有改善。 （当然，如果您不关心文件大小并希望获得最佳质量的图像，这可能是一个理想的结果。）
与 PNG-8 一样，PNG-24 也支持 alpha 透明度。
希望对你有帮助！
【讨论】：
JPEG 文件格式
GIF 文件格式
PNG 文件格式
您可以查看此信息图表以获取更多详细信息，Image File Types: When to use JPEG, GIF & PNG
【讨论】：
如果您要存储或呈现大量图像，新的Google WebP format 可能值得考虑，因为它比 PNG/JPG 小 25%。 请注意，目前并非所有浏览器都支持此功能。 注意。这是在发布此问题后于 2010 年发布的。
【讨论】：