共计 1640 个字符，预计需要花费 5 分钟才能阅读完成。
从某种程度上说，判断一个网页设计师是否优秀，可以从其在 WEB 开发（或网页设计）中是否合理的采用各种图片格式得出结论。事实上，或许所有人都知道图片存在 GIF,JPG 和 PNG 等格式，但并非所有人都知道它们之间的具体区别和使用技巧。
接下来，代码吾爱将给大家介绍：WEB 开发中几种最受欢迎图片格式的前世今生以及如何正确的使用它们。
1.JPEG?
JPEG 格式是一种大小与质量相平衡的压缩图片格式。通俗一点讲，就是：高的压缩比 = 低的图片质量 = 小的文件大小。反之，低的压缩比 = 高的图片质量 = 大的文件大小。由于 JPEG 文件无法保持 100 %的原始图像的像素数据，所以它不被认为是一种无损图像格式。
用途：
由于这种极其敏感的平衡特性，JPEG 非常适合被应用在那些允许轻微失真的像素色彩丰富的图片（照片）场合。反之，JPEG 格式图片并不适合做简单色彩（色调少）的图片，比如 LOGO，各种小图标（ICONS）。
2.GIF
GIF 格式，是为使图片能够应用在在线（online）应用程序上所特别开发的图片格式。Gif，有时也被成为“Giff”，是一种无损，8 位图片格式。“无损”是指 100% 的保持原始图片的像素数据信息。专业名词“8 位”是指，所能表现的颜色深度——一个 8 位图像仅最多只能支持 256 种不同颜色（一个多余 256 种颜色的图片若用 gif 图片保存会出现失真）。
用途：
由于 8 位颜色深度的限制，Gif 不适合应用于各种色彩过于丰富的照片存储场合。但它却非常适合应用在以下场合：
- Logo
- 小图标（Icon）
- 用于布局的图片（例如某个布局角落，边框等等）
- 仅包含不超过 256 种色彩的简单，小型图片场合
透明特性：
GIF 支持基本的透明特性，这意味着你能够使图片的某些像素“不可见”。在其被放置到网页中时，我们就可以看到通过这些不可见区域看到此图片后面的背景颜色（图片）。此特性非常有用：如果你需要将某个 gif 图片的内容置于所有图片的上层，你可以将其设置为透明。
压缩特性：
GIF 格式采用 LZW 算法进行压缩，此算法是 Unisys 申请的一项专利。在很久很久之前，如果你想使用 GIF 格式，那么就意味着你需要向 Unisys 付费申请专利许可。不过值得高兴的是，此项专利技术已于 2003 年 6 月 20 日过期，我们现在可以免费的使用 GIF 了！
隔行扫描：
GIF 同时也支持隔行扫描。隔行扫描能够令图片在浏览器中更快的加载和显示。此特性对于那些慢网速的浏览者来说尤其实用。
动画 GIF：
一个动态的 GIF 文件，是由若干帧图片所联结而成的动态图片。在显示时，这些动态帧被反复的绘制读取出来从而形成了简单的动画效果。合理的运用 GIF 动画能够为网页增添动静结合的效果，而过度的使用则会使网页杂乱无章。
3.PNG
PNG，读“ping”，初始时被作为 GIF 的免费替代格式所开发，采用公共专利压缩算法。PNG 格式也是一种无损压缩，但与 GIF 格式不同的是，PNG 同时支持 8 位和 24 位的图像。
8 位 PNG 图像：
一个 8 位 PNG 图片，支持透明背景且像素颜色不能超过 256 种。除了压缩算法不同之外，此 8 位 PNG 格式与 GIF 格式极其相似；
用途：
8 位 PNG 图片的用途与 GIF 格式基本相同，
- Logo
- 小图标（Icon）
- 用于布局的图片（例如某个布局角落，边框等等）
- 仅包含不超过 256 种色彩的简单，小型图片场合
24 位 PNG 图像：
24 位 PNG，支持 160 万种不同的像素颜色且支持 Alpha 透明效果，这就意味着，无论透明度设置为多少，PNG 图片均能够与背景很好的融合在一起。
对 PNG 的支持：
由于 PNG 格式的广泛使用和开发者更加重视网页的 WEB 标准，不同浏览器对 PNG 的支持就显得相当重要了。不过，幸运的是，目前市场上主流的浏览器对 PNG 格式都有很好的支持，这包括：IE*, Firefox, Safari, Opera, and Konqueror。
但不幸的是，IE6 及 IE6 以下的浏览器对 PNG 透明背景的支持并不好。不过我们仍可以通过其他方法来解决这个问题，详情请查看如何在 IE6 中正常显示透明 PNG。
