欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  网络运营

网站常用图片JPG、PNG、GIF哪个好 该如何选择

程序员文章站 2022-11-28 13:53:08
目前网站图片的采用一共有流行三种,分别是JPG、PNG、GIF,然而很多人并不知道三者在选择的时候究竟应该选谁(BMP就不考虑了吧)。虽然都可以存储图片,但是如果要发布到网上,就必须... 13-08-13...

如果你运用得好,选对图片,那样便会使网站的整体体验上升,如果你运用得不好,就会引起反效果。下面我通过文件大小等多方面的元素来讲一下网站图片的合理选择。

png、gif、jpg 介绍 gif 图片

gif 算是比较老的图片格式了,它的色彩效果最低,用gif保存鲜艳的图片的话会让你的网站看上去非常可怕。但是gif有着不可忽视的特点:体积小,有着极好的压缩效果,支持动画,并且支持透明效果,虽然这个透明没有png的那样渐变透明的强大。动画选gif没错;如果你的图片只有很单调的色彩,没有渐变色,例如只有红蓝两色,那么选gif最好不过了!例如百度的首页logo就是很好的例子,它的大小只有2kb,节省了资源。

网站常用图片JPG、PNG、GIF哪个好 该如何选择

jpg / jpeg 图片

jpg是数码相机最常用的格式,其特点是色彩还原好,可以在照片不明显失真的情况下,大幅降低体积,所以体积不很大,缺点是不支持透明。照片类的图片,例如网站上的gallery,你想要张贴出来的自然风景之类,最好都用jpg。但是屏幕截图呢?一会介绍。

网站常用图片JPG、PNG、GIF哪个好 该如何选择

png 图片

可谓是最适合网络的图片!png的优点是,清晰,无损压缩,压缩比率很高,可渐变透明,具备几乎所有gif的优点;缺点是不如jpg的颜色丰富,同样的图片体积也比jpg略大。但是png应该在网站设计上被推广,它是公认的最适合网页使用的图片格式。google就是一个很好的例子。google所有站点几乎全部的图片资源都是png格式。8位的png完全可以替代掉gif。

网站常用图片JPG、PNG、GIF哪个好 该如何选择

上图就是google的logo,选择png是为了最清晰同时体积更小,并且google主页的logo图片并不是背景透明的,而是白色背景的。既然不是透明的,为什么不选择jpg呢?google难道没有考虑吗,所以png有其优势。

png有着另一个优点,那就是逐次逼近显示(progressive display):传输图像文件的同时,可以先把整个轮廓显示出来,然后逐步显示图像的细节,即先显示低分辨率显示图像,从模糊到清晰,然后逐步提高它的分辨率。这是一个很好的用户体验。

各方面比较

大小比较:通常地,png ≈ jpg > gif

透明性:png > gif > jpg

色彩丰富程度:jpg > png >gif

兼容程度:gif ≈ jpg > png

注意,ie6下png的透明是不能显示的,有其对应的hack方法。