什麼！PNG圖片也能做動圖？

愛生活！愛設計！

設計狗們每天要面對

各種各樣格式的圖片

見的多了難免搞不清楚

每當看到不認識的圖片格式

我覺得

這些字母組成的名字

對初級設計師不夠友好

太不直觀了！

如果這些圖片格式都能用

一些設計師能明白的方式起名就好了。

比如：

動次打次圖（.gif）

高清無碼圖（.jpg）

大的要命圖（.bmp）

就簡單直白很多了

今天，設計大爆料

就通過設計師最看中的幾個方面

來介紹幾個主要的圖片格式，

教大家如何快速區分這些小婊砸!

真 實 度

代表選手.bmp .jpg .tiff

.bmp：不做大哥很多年

bmp三個字

其實就是bitmap（點陣圖）的縮寫

可見它曾經的地位

作為Windows曾經的御用格式

高保真高清晰度

但因為不能壓縮，占空間太大

漸漸被jpeg所代替

.jpeg：點陣圖扛把子

它的優勢不用多說了吧

相比bmp它的真實度不受

什麼影響，還支持壓縮

同樣的清晰度下，尺寸小了很多

然而作為最普及的格式它也有硬傷，

壓縮之後容易在邊緣形成雜色，

仔細看覺得臟髒的。

期待在不久的將來能改善

.tiff：PS爸爸的格式

作為PS爸爸的支持者

tiff 能在存儲時保留PS圖層

這功能貌似有點雞肋

想要圖層直接存psd不就好了嗎

然鵝！！

它的用處體現在印刷的時候

畢竟psd只能在PS里編輯

而 tiff 能在其他排版軟體

進行進一步的操作是不是很棒

透 明 度

代表選手 png：最百搭的小可愛！

它的全稱就是portable network graphic

（便攜網頁圖片）

可以任意穿行於各大瀏覽器

也能輕鬆融入設計作品

只要甲方爸爸都學會使用png

每個提供的素材都是png透明圖

那世界將會變成不用摳圖的人間

GIF/90K

在公眾中回復：png

可以獲得一枚png素材網站

上千素材，設計師必備網站

關於png還有一點應該知道

就是png8和png24是有區別的哦

png8這種小可愛支持的顏色較少

色彩搭配簡單的素材

例如：圖標logo之類的，輕便好用

而png24可就厲害多了，能顯示

的顏色多達1600萬，因此能呈現

很多顏色豐富精妙的圖片

但相對的尺寸會變的很大

PS :png8在支持透明圖的時候

沒有png24的好，時不時會出現毛邊

動 效 圖 片

代表選手 .gif .apng

.gif：只有我最搖擺

GIF/57K

gif最大的特點就是支持動效了

而且它體積小巧，適合多種平台

也支持半透明處理，在動圖界獨得恩寵

但別忘了gif也是點陣圖

並且只能顯示256種顏色

（就這麼多）

這也是為什麼顏色豐富的 gif 圖

總是呈現一種老電視的雪花效果

GIF/438K

但如今這個問題也可以解決了

最近流行的apng格式就不存在這樣的限制

.apng：動次打次的png

apng也就是animated png（動態png）

它兼具了gif和png的優點。

其實 gif 格式誕生於1987年

30年來始終做不到邊緣平滑，

直到apng解決了這個問題

GIF/81K

（圖片來自apng官網）

滿足動效的同時保留了png的圖片質量

還抹去了gif 在深色背景時候尷尬的白邊

GIF/95K

然而。。。這麼牛的apng

目前只能在Firefox和Safari上顯示

以及今年才加入的Chrome

老舊瀏覽器的不支持（對說你呢 ，IE）

這也是它還沒把 gif 打倒的唯一原因了吧

可 編 輯 的

代表選手.eps .svg

矢量圖登場了

我們都知道矢量圖不是由像素

組成的，放大縮小不受清晰度

的限制。

做好的矢量圖形仍然可以

在Ai或Sketch里進行二次編輯

這一點上eps 和svg 是一樣的。

區別在於，eps是Post Script的簡稱

是Adobe爸爸針對印表機設計的語言

因此eps的初衷是用於優化紙張上的圖像的

svg是近幾年流行起來

針對互聯網設計圖形格式

全稱是Scalable Vector Graphics

意思就是可縮放的矢量圖形。

是一種比較智能的格式，能夠記憶

你對圖片的操作。哪怕是相同的圖形

因為操作過程不一樣，也會有差別。

最明顯的好處還在於體積非常的小。

不同於點陣圖，像素越多尺寸越大，

svg的大小是由其圖形的複雜程度決定的。

但是通常再大也不會超過100kb哦~

總之就是一種活好不佔地的好格式！

世上格式千千萬，而且還會不斷的推陳出新

作為設計師我們該做的就是及時了解適應

併合理的利用它們，做個緊跟潮流的小仙女

才能不被時代淘汰

點擊展開全文

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！