在构建网站或界面等时,什么时候应该使用特定的图像文件类型?

他们的优点和缺点是什么?

我知道PNG和GIF是无损的,而JPEG是有损的。 但是PNG和GIF的主要区别是什么呢? 为什么我要选择一个而不是另一个呢? 什么是SVG,什么时候应该使用它?

如果你不关心每一个像素,你应该总是使用JPEG,因为它是“最轻”的?


当前回答

有一个黑客可以使用GIF图像来显示真实的颜色。一个人可以准备一个GIF动画与256色调色帧0帧延迟,并设置动画只显示一次。所以,所有的帧都可以同时显示。最后,一个真正的彩色GIF图像被渲染。

许多软件都能够准备这样的GIF图像。但是,输出文件的大小大于PNG文件。如果确实有必要,就必须使用。

编辑:正如@mwfarnley提到的,可能会有小问题。不过,仍有可能的变通办法。这里可以看到一个工作示例。最终渲染的图像是这样的:

full-color-gif-image

其他回答

主要的区别是GIF是专利,并且得到了更广泛的支持。PNG是一个开放的规范,在IE6中不支持alpha透明度。IE7中的支持得到了改进,但并没有完全修复。

就文件大小而言,GIF有一个较小的默认颜色托盘,所以乍一看它们往往是较小的文件大小。PNG文件有一个更大的默认托盘,但是你可以缩小他们的颜色托盘,这样当你这样做的时候,他们会导致一个比GIF更小的文件大小。问题又来了,这个特性在Internet Explorer中不受支持。

另外,因为png可以支持alpha透明度,所以如果你想要二进制透明度以外的其他透明度,它们是唯一的选择。

有一个黑客可以使用GIF图像来显示真实的颜色。一个人可以准备一个GIF动画与256色调色帧0帧延迟,并设置动画只显示一次。所以,所有的帧都可以同时显示。最后,一个真正的彩色GIF图像被渲染。

许多软件都能够准备这样的GIF图像。但是,输出文件的大小大于PNG文件。如果确实有必要,就必须使用。

编辑:正如@mwfarnley提到的,可能会有小问题。不过,仍有可能的变通办法。这里可以看到一个工作示例。最终渲染的图像是这样的:

full-color-gif-image

JPEG会有较差的质量在尖锐的边缘等,因此它不适合大多数网络图形。它擅长摄影。

与GIF相比,PNG提供了更好的压缩,更大的调色板和更多的功能,包括透明度。而且它是无损的。

GIF基于每个图像的256色调色板(至少在其基本的化身)。PNG可以做“真彩色”,即1670万种颜色。无损PNG压缩比无损gif更好。GIF可以做“二进制”透明度(0%不透明度或100%不透明度)。PNG可以处理alpha透明。

总而言之,如果你不需要使用alpha透明图像并且支持IE6,当你需要像素完美的图像来制作矢量插图等时,PNG可能是更好的选择。JPG是无与伦比的照片。

我通常使用PNG,因为它似乎比GIF有一些优势。GIF曾经有过专利限制,但现在已经过期了。

动图适用于边缘锐利的线条艺术(如logo),颜色数量有限。这充分利用了该格式的无损压缩特性,它有利于色彩均匀、边缘清晰的平面区域(与JPEG相反,JPEG有利于平滑的渐变和更柔和的图像)。

动图可以用于小动画和低分辨率的电影剪辑。

鉴于GIF图像调色板的一般限制为256色,它通常不被用作数字摄影的格式。数码摄影师使用的图像文件格式能够再现更大范围的颜色,如TIFF, RAW或有损JPEG,这是更适合压缩照片。

PNG格式是GIF图像的流行替代品,因为它使用了更好的压缩技术,并且没有256色的限制,但PNG不支持动画。MNG和APNG格式都源自PNG,支持动画,但应用并不广泛。