網頁設計軟體教學-課程範例

我要如何將我自行拍攝的商品圖片進行圖片壓縮的動作呢？

一般網站中所使用的圖片，我們都會先建議「壓縮」後，再放置於網頁中。然而所謂的圖片壓縮並非指將圖片使用壓縮軟體(例如RAR、ZIP…)加以封裝，而是要幫圖片「瘦身」，也就是說壓縮(瘦身)後的圖片格式仍然不變，依舊是JPG或GIF的格式。一般而言未經瘦身前的圖片檔案都很大，即使將該圖片比例縮小，檔案雖然有變小，但若是要放罝於網頁上，還是稍嫌過大，若您網頁上有許多未經瘦身的圖片將會造成網友瀏覽該頁面時速度變慢，進而影響網站效能及搜尋引擎收錄該網頁的意願，因此無論您是要自行製作網頁或是要將圖片透過後端管理系統，上傳至網站並於網站前台顯示時，務必先確認該圖片是否壓縮(瘦身)過再行上傳。

圖片壓縮的原理其實是把圖片中一些相近的色階，用同樣的顏色來取代，如此可以大幅減少檔案大小，然而若色階數過少將造成該圖片品質不佳(例如變模糊、出現鋸齒狀…等)，因此在壓縮圖片時，最好能做到將圖片檔案變小，但肉眼看到的壓縮後圖片與壓縮前的一樣或是可接受的範圍，一般我們建議壓縮的圖片品質介於70~90%，通常壓縮後的圖片大小約只有原來的十分之一左右。

目前市面上的美工軟體，幾乎都有圖片壓縮的功能，例如PhotoShop，這套美工軟體壓縮圖片的流程及方式如下：

1. 先以PhotoShop開啟要瘦身的圖片
2. 點選「檔案/儲存為網頁用」(或直接按鍵盤 Alt+Shift+Ctrl+S)
3. 此時將出現一個「儲存為網頁用」的視窗，您可直接調整壓縮品質(建議70~90)，並於預覽視窗預瀏壓縮後的圖片，最後選擇您要另存圖檔的格式(一般照片可存成JPEG)。
4. 按儲存鈕後，選擇另存的圖片位置即完成。