jpg/jpeg/png格式的區別與應用場景

注：在存儲圖像時採用JPG仍是PNG主要依據圖像上的色彩層次和顏色數量進行選擇

 

1、.jpg/jpeg格式的圖片(jpg全名：jpeg)

JPG（或是JPEG）：

優勢：

　　（1）佔用內存小，網頁加載速度快

　　（2）主要用於攝影做品或者寫實做品（或者其餘細節、色彩豐富的圖片）或大的背景圖；對多色彩表現較好，不適於文字較多的圖片。根據咱們在頁面中使用的商品圖片、採用人像或者實物素材製做的廣告banner等圖像更適合採用jpg的圖片格式保存

 

缺點：

　　jpg格式圖片是有損壓縮的圖片，有損壓縮會使原圖片數據質量降低，即jpg會在壓縮圖片時下降圖片品質。

 

2、PNG格式的圖片

.png：

優勢：

　　（1）png格式圖片是無損壓縮的圖片，能在保證最不失真的狀況下儘量壓縮圖像文件的大小。 

　　（2）圖片質量高；色彩表現好；支持透明效果；提供鋒利的線條和邊緣，因此作出的logo等小圖標效果會更好；更好地展現文字、顏色相近的圖片。

　　（3）PNG用來存儲灰度圖像時，灰度圖像的深度可多到16位，存儲彩色圖像時，彩色圖像的深度可多到48位，而且還可存儲多到16位的α通道數據。 

　　  (4)  所含顏色不多、具備大塊顏色相近的區域或亮度差別十分明顯的較簡單的圖片則須要採用PNG。但也會有一些特殊狀況，例若有些圖像儘管色彩層次豐富，但因爲圖片尺寸較小，上面包含的顏色數量有限時，也能夠嘗試用PNG進行存儲。而有些矢量工具繪製的圖像因爲採用較多的濾鏡特效也會造成豐富的色彩層次，這個時候就須要採用JPG進行存儲了。主要用於小圖標或顏色簡單對比強烈的小的背景圖。根據經驗用於頁面結構的基本視覺元素，如容器的背景、按鈕、導航的背景等應該儘可能用PNG格式進行存儲，這樣才能更好的保證設計品質。

 

缺點：

　　（1）佔內存大,會致使網頁加載速度慢;

　　（2）對於須要高保真的較複雜的圖像，PNG雖然能無損壓縮，但圖片文件較大，不適合應用在Web頁面上。 

 

實踐中的示例圖：

 

 

 

原文連接：https://blog.csdn.net/qq_30541261/article/details/70154282