資訊專欄INFORMATION COLUMN
Png
PNG包括png-8和png-24 png-32
相對(duì)來(lái)說(shuō)體積??；支持透明
24（160W）比8（256） 像素 色塊 色彩 要多很多
8位保存的時(shí)候會(huì)有鋸齒邊緣
24位是透明邊緣
24位PNG，支持160萬(wàn)種不同的像素顏色且支持Alpha透明效果，這就意味著，無(wú)論透明度設(shè)置為多少，PNG圖片均能夠與背景很好的融合在一起。
Jpg
JPG能顯示的顏色比gif和png要多的多；同時(shí)能得到很好的壓縮；但是是一種失真壓縮（壓縮比；分辨率；可感知失真）;jpg適合應(yīng)用在那些允許輕微失真的像素色彩豐富的場(chǎng)景；不適合做簡(jiǎn)單色彩的圖片（icon，小logo）
Gif
支持動(dòng)畫(huà)；也是一種無(wú)損的圖片格式（修改圖片后；圖片質(zhì)量沒(méi)有損失）；僅支持8位顏色深度；受這個(gè)限制；gif不適合應(yīng)用于各種色彩過(guò)于豐富的場(chǎng)景
Webp
Google開(kāi)發(fā)的一種旨在加快圖片加載速度的圖片格式，圖片壓縮體積大約是jpg的2/3；能大量節(jié)省服務(wù)器帶寬資源和數(shù)據(jù)空間；也是一種有損壓縮；目的就是加快網(wǎng)絡(luò)圖片的傳輸效率；讓圖片更快的顯示在用戶面前；目前所知道的只有高版本的W3C瀏覽器才支持 （chorme39+，safari7+）
Svg
SVG正變得越來(lái)越熱門(mén)，它不同于以上所有的文件類型，因?yàn)樗且粋€(gè)矢量文件格式。這就是說(shuō)它實(shí)際上是由線條和曲線，而不是像素組成的。當(dāng)你放大一個(gè)矢量圖像時(shí)，你仍然看到一條曲線或一條線。當(dāng)你放大一個(gè)由像素構(gòu)成的圖像時(shí)，你會(huì)看到像素。
優(yōu)點(diǎn)：
對(duì)于小logo和圖片來(lái)說(shuō)；svg是很理想的；因?yàn)闊o(wú)論是Retina屏還是其他低分辨率的屏幕上顯示都是一樣的；svg的logo可以放大不失真；如果是像素構(gòu)成的圖片格式想要不失真就要多套的圖片，svg是用XML編寫(xiě)的；可以用js來(lái)改變svg圖片的顏色
缺點(diǎn)：
Svg在渲染的時(shí)候需要比像素圖更多的計(jì)算能力；更加的消耗性能；所以你的svg圖比較復(fù)雜；可能會(huì)很耗費(fèi)性能；甚至文件大小也很大
總結(jié)：小圖片（icon）或則網(wǎng)頁(yè)基本元素（按鈕）可以使用png-24或則gif；圖片考慮jpg
體積 webp
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/117409.html
PngPNG包括png-8和png-24 png-32 相對(duì)來(lái)說(shuō)體積?。恢С滞该?24（160W）比8（256） 像素 色塊 色彩 要多很多 8位保存的時(shí)候會(huì)有鋸齒邊緣 24位是透明邊緣 24位PNG，支持160萬(wàn)種不同的像素顏色且支持Alpha透明效果，這就意味著，無(wú)論透明度設(shè)置為多少，PNG圖片均能夠與背景很好的融合在一起。 JpgJPG能顯示的顏色比gif和png要多的多；同時(shí)能得到很好...
PngPNG包括png-8和png-24 png-32 相對(duì)來(lái)說(shuō)體積?。恢С滞该?24（160W）比8（256） 像素 色塊 色彩 要多很多 8位保存的時(shí)候會(huì)有鋸齒邊緣 24位是透明邊緣 24位PNG，支持160萬(wàn)種不同的像素顏色且支持Alpha透明效果，這就意味著，無(wú)論透明度設(shè)置為多少，PNG圖片均能夠與背景很好的融合在一起。 JpgJPG能顯示的顏色比gif和png要多的多；同時(shí)能得到很好...
摘要：由于采用了無(wú)損壓縮，相比古老的格式，尺寸較小，而且支持透明和動(dòng)畫(huà)。采用無(wú)損壓縮，是基于直接色的位圖格式。正是因?yàn)槠涓咂焚|(zhì)，無(wú)損壓縮，非常適合用于源文件或需要二次編輯的圖片格式的保存。 前言 在大多數(shù)的web頁(yè)面中，圖片占到了頁(yè)面大小的60%-70%。因此在web開(kāi)發(fā)中，不同的場(chǎng)景使用合適的圖片格式對(duì)web頁(yè)面的性能和體驗(yàn)是很重要的。圖片格式種類非常多，本文僅針對(duì)幾種web應(yīng)用中常用的圖...
摘要：由于采用了無(wú)損壓縮，相比古老的格式，尺寸較小，而且支持透明和動(dòng)畫(huà)。采用無(wú)損壓縮，是基于直接色的位圖格式。正是因?yàn)槠涓咂焚|(zhì)，無(wú)損壓縮，非常適合用于源文件或需要二次編輯的圖片格式的保存。 前言 在大多數(shù)的web頁(yè)面中，圖片占到了頁(yè)面大小的60%-70%。因此在web開(kāi)發(fā)中，不同的場(chǎng)景使用合適的圖片格式對(duì)web頁(yè)面的性能和體驗(yàn)是很重要的。圖片格式種類非常多，本文僅針對(duì)幾種web應(yīng)用中常用的圖...
閱讀 2595·2023-04-25 17:37
閱讀 1261·2021-11-24 10:29
閱讀 3789·2021-09-09 11:57
閱讀 770·2021-08-10 09:41
閱讀 2302·2019-08-30 15:55
閱讀 2872·2019-08-30 15:54
閱讀 2015·2019-08-30 15:53
閱讀 963·2019-08-30 15:43
