建站
咨詢
售后
建站咨詢
新聞中心
創(chuàng)新互聯(lián)作為成都網(wǎng)站建設(shè)公司，專注網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)，有關(guān)成都定制網(wǎng)站方案、改版、費(fèi)用等問(wèn)題，行業(yè)涉及OPP膠袋等多個(gè)領(lǐng)域，已為上千家企業(yè)服務(wù)，得到了客戶的尊重與認(rèn)可。
web中承載信息的主要方式就是圖片與文字了，以下就是對(duì)一些web圖片格式的優(yōu)缺點(diǎn)進(jìn)行歸納。
1、GIF
GIF圖是比較古老的web圖片格式之一，可以追溯到1987，幾乎所有的瀏覽器都支持這一種格式，老有老的好處嘛。GIF是一種索引色模式圖片，所以GIF每幀圖所表現(xiàn)的顏色最多為256種。GIF能夠支持動(dòng)畫，也能支持背景透明，這點(diǎn)連古老的IE6都支持，所以在以前想要在項(xiàng)目中使用背景透明圖片，有一些方案就是生成GIF圖片。GIF與JPEG、PNG相比，在通常情況下確實(shí)體積比較小。不過(guò)里面如果放入了足夠多幀的圖片，那么可能就不是那種情況了。現(xiàn)在網(wǎng)絡(luò)上的GIF可以說(shuō)是爆炸式的再增長(zhǎng)，顯然更多的在與他的兩個(gè)特點(diǎn)：支持動(dòng)畫與兼容性好。缺點(diǎn)就是：色彩表現(xiàn)度不夠豐富。
2、JPEG、JPG
平常我們大部分見(jiàn)到的靜態(tài)圖基本都是這種圖片格式。這種格式的圖片能比較好的表現(xiàn)各種色彩，主要在壓縮的時(shí)候會(huì)有所失真（主要是壓縮時(shí)，會(huì)在細(xì)節(jié)上把相鄰的一些色彩給同化掉），也正因?yàn)槿绱耍炀土诉@種圖片格式體積的輕量。格式被各中老弱病殘的瀏覽器兼容，不過(guò)不支持背景透明與動(dòng)畫。平時(shí)web上的廣告圖、相片、特大背景圖、輪播圖等等一些大圖場(chǎng)景中，都適用這個(gè)。
3、PNG
PNG格式是有三種版本的，分別為PNG-8，PNG-24，PNG-32，所有這些版本都不支持動(dòng)畫的。PNG-8跟GIF類似的屬性是相似的，都是索引色模式，而且都支持背景透明。相對(duì)比GIF格式好的特點(diǎn)在與背景透明時(shí)，圖像邊緣沒(méi)有什么噪點(diǎn)，顏色表現(xiàn)更優(yōu)秀。PNG-24其實(shí)就是無(wú)損壓縮的JPEG。而PNG-32就是在PNG-24的基礎(chǔ)上，增加了透明度的支持。PNG格式在老瀏覽器IE6以及以下，PNG-8透明度的支持度不是很好，PNG-32的透明度基本不支持。正因?yàn)槿绱耍郧坝幸粋€(gè)js插件，專門應(yīng)對(duì)IE6這種BUG，主要是用IE6里的濾鏡來(lái)重新渲染圖片達(dá)到透明.隨著時(shí)代的發(fā)展，PNG也想進(jìn)步，也想支持動(dòng)畫。所以，有人推出了APNG（Animated PNG）格式圖片。從字面上理解，就是會(huì)動(dòng)的PNG圖片，不過(guò)這個(gè)技術(shù)實(shí)現(xiàn)上與PNG開(kāi)發(fā)小組理念不合，沒(méi)有得到有效推廣。到現(xiàn)在，也就有Blink內(nèi)核的瀏覽器（代表瀏覽器：火狐）有比較好的支持，其它的就無(wú)從談起了。
4、webP
這個(gè)格式的圖片的格式是財(cái)大氣粗的Google在2010發(fā)布出來(lái)的，它擁有現(xiàn)有位圖格式的所有優(yōu)點(diǎn)，包括體積小、色彩表現(xiàn)足夠、支持動(dòng)畫（一開(kāi)始是不支持的）。當(dāng)然，新東西的缺點(diǎn)就是兼容性不是很好，還有就是呈現(xiàn)這種圖片格式計(jì)算量比平常的圖片要大很多。由于出生好，東西本身也不錯(cuò)，越來(lái)越多的開(kāi)發(fā)者與設(shè)計(jì)者開(kāi)始關(guān)注它。國(guó)內(nèi)某家公司也在使用這種格式圖片制作表情。
5、SVG
SVG是一種矢量圖，在現(xiàn)在來(lái)說(shuō)，得到的支持是很可觀的。矢量圖比位圖一個(gè)天生的有點(diǎn)，就是它不管放多大都不會(huì)模糊。這種格式的圖片，對(duì)一些簡(jiǎn)單的線條、 形狀表現(xiàn)是很不錯(cuò)的，如果表達(dá)更復(fù)雜的圖像（如照片），那這個(gè)就會(huì)變的太復(fù)雜。SVG能夠支持動(dòng)畫（SVG的動(dòng)畫特性不能被IE瀏覽器很好的支持），以前的flash那樣，還支持css樣式的一些修改。我們現(xiàn)在網(wǎng)頁(yè)上的很多icon圖標(biāo)都是使用這個(gè)的，svg也能夠把多個(gè)SVG組合起來(lái)?？傮w來(lái)說(shuō)，SVG還是一個(gè)比較看好的技術(shù)。
瀏覽器中，對(duì)于圖片的技術(shù)更新一直突破，其較于文字來(lái)說(shuō)唯一缺點(diǎn)就是體積太大，但圖片的表現(xiàn)力是文字無(wú)法比擬的，也相信圖片會(huì)越來(lái)越好吧。關(guān)于web上位圖的技術(shù)還有一個(gè)是database64，這個(gè)是可以把的圖片轉(zhuǎn)化成為16位的代碼直接插入web中。
| 壓縮方式 | 單張圖能支持顏色種類 | 是否支持透明度 | 是否支持動(dòng)畫 | 兼容情況 | |
| GIF | 無(wú)損壓縮 | 256 | 是 | 是 | 基本通用 |
| JPEG | 有損壓縮 | 1600萬(wàn)以上 | 否 | 否 | 基本通用 |
| PNG | 無(wú)損壓縮 | 1600萬(wàn)以上 | 是 | 否 | 基本通用 |
| APNG | 無(wú)損壓縮 | 1600萬(wàn)以上 | 是 | 是 | Firefox51++ Chrom59++ iOS Sarfi9.3++ |
| webP | 有損壓縮 | 1600萬(wàn)以上 | 是 | 是 | Opera 44++ Chrom 45++ |
| SVG | 矢量圖 | 1600萬(wàn)以上 | 是 | 是 | 除了IE8以及以下， 現(xiàn)在各主瀏覽器都支持 |
本文題目：web上種圖片應(yīng)用的優(yōu)缺點(diǎn)
分享網(wǎng)址：http://fisionsoft.com.cn/article/gphodd.html
