PNG圖片格式特點(diǎn):
Png這種圖片格式包括了許多子類,但是在實(shí)踐中大致可以分為256色的png和全色的png,你完成可以用256色的png代替gif,用全色的png代替jpeg,Png是完全支持alpha透明的(透明,半透明,不透明),盡管有兩個(gè)怪異的現(xiàn)象(在ie6下)。
png是一種無損耗的圖像格式,這也意味著你可以對(duì)png圖片做任何操作也不會(huì)使 得圖像質(zhì)量產(chǎn)生損耗。這也使得png可以作為jpeg編輯的過渡格式。
PNG在ie中的怪異表現(xiàn):
- IE6以下的瀏覽器支持PNG8的索引透明,但圖片必須為全透明,半透明的png8在瀏覽器下顯示為全透明。
- Alpha透明的全色PNG(png32)在ie6中會(huì)出現(xiàn)背景顏色(通常是灰色)。
由上面可以總結(jié):
(a)全透明的png8可以在任一瀏覽器正常顯示(就像gif一樣)。半透明的png8在除了ie6及其以下的瀏覽器下錯(cuò)誤的顯示成全透明,其它瀏覽器都能正常顯示半透明。這個(gè)bug并不需要特殊對(duì)待,因?yàn)樵诓恢С职胪该鞯臑g覽器下只是顯示為全透明,對(duì)用戶體驗(yàn)影響不大,它反而是透明gif的加強(qiáng)版。
(b)第二個(gè)bug沒有什么好的方法解決,只能通過(AlphaImageLoader濾鏡和htc)方法來處理。
更多關(guān)于PNG:
PNG8
256色PNG的別名,無損格式,體積最小,但最多只支持256色
PNG24
全色PNG的別名,除了png8的特點(diǎn),理論上可以存儲(chǔ)2的24次方種顏色,但ie6之前的版本對(duì)此格式兼容有問題
PNG32
全色PNG的別名,除了以上的特點(diǎn)外,體積稍大
相比GIF
PNG 8除了不支持動(dòng)畫外,PNG8有GIF所有的特點(diǎn),但是比GIF更加具有優(yōu)勢(shì)的是它支持alpha透明和更優(yōu)的壓縮。所以,大多數(shù)情況下,你都應(yīng)該用PNG8不是GIF(除了非常小的圖片GIF會(huì)有更好的壓縮外)。
相比JPEG
JPEG比全色PNG具有更加好的壓縮,因此也使得JPEG適合照片,但是編輯JPEG過程中容易造成質(zhì)量的損失,所以全色PNG適合作為編輯JPEG的過渡格式.
到底是png24 Alpha透明還是png32 Alpha透明?
這個(gè)可能跟每個(gè)人使用切圖軟件有關(guān)。
1、Photoshop
1)只能導(dǎo)出布爾透明(全透明或者全不透明)的PNG8。
2)能導(dǎo)出alpha透明(全透明,全不透明,半透明)的PNG24。
3)不能導(dǎo)出PNG32。
2、Fireworks
1)既能導(dǎo)出布爾透明的PNG8,也能導(dǎo)出alpha透明的PNG8,半透明的png8在除了ie6及其以下的瀏覽器下錯(cuò)誤的顯示成全透明。
2)能導(dǎo)出PNG24,但是和jpeg差不多,不能透明。
3)能導(dǎo)出alpha透明的PNG32。
應(yīng)該說PNG24和PNG32是一樣,(The difference between PNG24 and PNG32)一文中指出PNG32中每個(gè)像素不僅存儲(chǔ)了24位真彩信息還存儲(chǔ)了8位alpha通道。所以fw導(dǎo)出PNG32不用選擇透明,而ps導(dǎo)出 PNG24時(shí)是要勾選透明度的,這時(shí)候的PNG24應(yīng)該就轉(zhuǎn)化成了PNG32了吧。
PNG8與PNG24的區(qū)別:
PNG-8和PNG-24,其最大的區(qū)別不是顏色位的區(qū)別,而是存儲(chǔ)方式不同;
PNG-8 色盤索引、調(diào)色板中一位透明值、不支持阿爾法通道的半透明,存儲(chǔ)格式中每個(gè)像素?zé)o透明度的數(shù)據(jù)塊定義;PNG-8是用8位索引值來在調(diào)色盤中索引一個(gè)顏色,因?yàn)橐粋€(gè)索引值的最大上限為2的8次方既128,故調(diào)色盤中顏色數(shù)最多為128種,所以該文件格式又被叫做PNG-8128仿色。
PNG-24 無調(diào)色板、支持阿爾法通道的半透明、每個(gè)點(diǎn)陣都有透明度的定義,最低32位真彩色;是PNG-24是用24位來保存一個(gè)像素值,是真彩色。
PNG-8 和 gif 有一些相似之處,模式都是索引顏色,只支持像素級(jí)的純透明,不支持 alpha 透明。我們通常說的“IE6 不支持 PNG 透明”,是指不支持 PNG-24 的透明(將透明區(qū)域顯示為灰色)。
png的優(yōu)化:http://www.csspeople.cn/?p=86 http://www.csspeople.cn/?p=136
淘寶UED:圖片格式與設(shè)計(jì)那點(diǎn)事兒
網(wǎng)易UED: PNG8圖片在IE下有色差,不過解決方法也很簡(jiǎn)單