Welcome! 登入 註冊
專區首頁 專區百科 專區論壇 專區部落格 專區地圖

Advanced

[講義] 圖檔尺寸調整《圖片請盡量縮小至100K以下》

很多人喜歡使用圖片來美化網頁,增加網站的吸引力,可是大量圖片,以及大量體積龐大的圖片,卻會讓網站像大象一樣很難行走,越來越慢,降低瀏覽效率,也會讓人缺乏耐心,即使設得再好看,也達不到網站瀏覽效果。

因此網站瘦身是很重要的事,如何讓網站既美麗又有效率,請執行以下步驟:

1. 檢視與修改圖檔大小的步驟:



1. 1.準備好圖片之後,請開啟資料夾檢查檔案大小



開始資料夾→檢視→詳細資料

若發現超過100K 的圖檔就要執行瘦身動作,單一檔案最好能降低到50K以下,圖檔寬度,非必要不要超過500px


[IMG]http://i1136.photobucket.com/albums/n481/parkparkyang/resize-00.jpg[/IMG]


2. 2.若超過100K以上檔案,請以Photoshop開啟



檔案→儲存為網頁與裝置用

[IMG]http://i1136.photobucket.com/albums/n481/parkparkyang/resize-01.jpg[/IMG]


3. 3.檢視目前檔案檔格式、大小及速率



範例圖檔原為PNG檔,521.7K,以2M的上網速度,下載本圖需要4秒

[IMG]http://i1136.photobucket.com/albums/n481/parkparkyang/resize-04.jpg[/IMG]


4. 4.以其他格式或降低色彩數目,來調整圖片檔案大小



選擇JPG圖檔,品質60,則檔案降低為80.67K,以2M的上網速度,下載本圖需要1秒

[IMG]http://i1136.photobucket.com/albums/n481/parkparkyang/resize-05.jpg[/IMG]



[hr]

請同學務必牢記網頁圖檔瘦身的原則,隨時檢查有無檔案尺寸過大的圖檔,發現即將之修改,如此將更能朝更有效率也更專業的網站前進。



Edited 1 time(s). Last edit at 11/08/2011 09:55PM by JinJin.
(編輯記錄)