網頁常用的PNG,GIF,JPG圖片壓縮率對比分析說明

2020-04-19 10:49:54

字體：大中小

來源：轉載

供稿：網友

令人感到驚訝的是,根據我的一個項目調查表明(調查:http://www.webdesignerwall.com/),還有相當多的設計人員在用fireworks.就我個人而言,我很少用fireworks.photoshop是我做設計的首選軟件,從圖片編緝到整站制作.但是你知道嗎,fireworks對圖片的壓縮率比photoshop要更好.我不是一個軟件工程師,所以我也無法解釋為什么fireworks的壓縮率會更好.但是我可以舉一些例子向你證明這個事實.

我們就以網頁常用的:PNF,GIF,JPG這三個格式來講一下.

PNG的壓縮率

為了測試,我使用了一張沒有經過壓縮的透明圖像.首先我用photoshop來輸出圖像為:PNG-24,這樣生成的文件大小為:352kb.然后我再用fireworks來壓縮生成的文件大小為:332kb.在這兩張圖像我們從視覺來看,是沒有多大的區別(至少我看來是這樣的),但文件的大小卻相差大約20kb.

設計理論,網頁美工教程,網頁設計教程

gif的壓縮率

接下來我們來看一下gif格式是怎么樣子的,先定義,256色,自適應無抖動.fireworks=88kb,photoshop=92kb.我們可以看到相差是4kb.雖然看起來相差無幾,但是fireworks有更多的細節調節功能.
設計理論,網頁美工教程,網頁設計教程

jpg的壓縮率

現在來看來jpg的壓縮率,在photoshop中設圖像輸出60%的質量,最后文件的結果:80kb.在fireworks中設質量為80%質量的圖像輸出,其文件大小為:72kb.我們可以看到結果差不了多少.但是fireworks還是比photoshop少8kb.

設計理論,網頁美工教程,網頁設計教程

有什么大不了的

你可能會想:這有什么大不了的.這只有幾KB而已......不要小看這幾KB的差異,便它能夠對你的帶寬和負載時間有很大的影響--不相信,那我舉個例子給你看.比如說你的網站有一張圖像,我用fireworks壓縮,這樣圖偈就可以減少20kb.比如說你的網站一天有16,000的訪問量,那么:20kb*16,000=320,00kb.也就是說每天可以減少320mb的帶寬.這只是一張圖像,但是如果是十張,一百張呢?那么你可以節省下多少的銀子.最重要的是也可以提高網站的加載速度.那么你現在還會覺得"沒有什么大不了"嗎?

設計理論,網頁美工教程,網頁設計教程

結論:

所以你可以試一下用用fireworks.