圖片優化的那些工具

　　圖片作為頁面的一個主要因素，它的大小直接影響了頁面的載入速度，這一點在移動端尤顯突出。

　　怎麼讓圖片的大小更小？除了選擇合適的格式（jpeg、gif、png），我們還可以利用網上的應用（如smushit、tinypng、imagemin、imageOptim）對圖片進行壓縮。在這裡我想給大家介紹一下上述應用主要使用到了哪些命令列工具以及它們的使用方法。

　　Jpegtran

　　JPEG的壓縮工具有jpegtran和jpegoptim，這兩款工具的壓縮效果幾乎沒有區別，在這裡我們推薦使用jpegtran，相比後者，jpegtran可以進行progressive編碼，使圖片漸進式的展現，先顯示模糊的圖片，再逐步清晰。

　　推薦命令列引數：

　　jpegtran –copy none –optimize -progressive -outfile out.jpg in.jpg

　　想知道這些引數的具體作用，可使用命令“jpegtran –h”瞭解，下同。

　　Gifsicle

　　Gif動畫可使用gifsicle來優化，它會剝離不同幀中重複的畫素來優化gif動畫，對於單幀gif我們推薦還是使用png8來替代。

　　推薦命令列引數：

　　gifsicle –interlace -O3 –careful –no-comments –no-names –same-delay –same-loopcount –no-warnings -o out.gif in.gif

　　pngcrush、optipng、pngout

　　PNG壓縮可分為無失真壓縮和有失真壓縮，以上三款可以說是現在比較主流的無失真壓縮工具了。從ImageOptim的壓縮效果可以看出，optipng和pngcrush對於色彩比較單一、大小比較小的圖片壓縮效果好於pngout，而對於色彩比較豐富、透明漸變的圖片來說pngout的壓縮比明顯更高。另外，經測試，Google的PageSpeed上提供的可壓縮比是按照optipng給出的。

　　推薦命令列引數：

　　pngcrush -brute -rem alla -nofilecheck -bail -blacken -reduce -cc in.png out.png

　　optipng -strip all -quiet -clobber -o3 -i0 in.png -out out.png

　　pngout -k1 -r -v in.png out.png

　　pngquant、pngnq

　　兩款PNG的有失真壓縮工具，基本都能將圖片壓縮掉40%以上，它們會將PNG轉換成alpha透明的PNG8，由於PNG8最多支援256色，所以內容豐富的圖片壓縮後會看出些許差異，但屬於可接受範圍內，而純色圖片基本能保持原圖的質量。另外，這種alpha透明的PNG8圖片在IE6以上及其他標準瀏覽器可以顯示正常的alpha透明度，在IE6中則會忽略掉有alpha透明度的顏色，作為全透明處理（邊緣稍有鋸齒但影響不大），而不像png32那樣alpha透明區域在IE6下顯示灰色。

　　推薦命令列引數：

　　pngnq –s 1 –d outdir/ in.png

　　pngquant -s1 –o out.png in.png

　　PS：pngquant的-s是speed引數，可選值1-10，預設為3，在經過多圖測試後發現1的壓縮比和效果都是最佳的，其他的引數或多或少存在缺陷，這裡推薦選1。

　　總結

　　如果您已經學會如何使用這些命令列軟體對自己的圖片進行壓縮優化，那麼恭喜您，您的圖片瘦身成功。如果您覺得命令列一行一行的壓縮圖片太麻煩，那麼除了去使用文章開頭所說到的那幾款應用外，感興趣的同學也可以整合它們去開發一套自己的應用，利用php的exec、nodejs的child_process.exec(cmd, [options], callback)等等方法執行shell命令，再配上一些互動，一款好用的圖片優化應用就此誕生。最後希望這篇文章對大家有所幫助。