E-mail 圖檔格式選擇 JPG, GIF, PNG (8) , PNG (24) 教學卓越中心 2013/12 我們來自 “世新校園授權圖庫” edited by CTE
【困擾】 all-users 信件 因超過 100 KB 而迭遭退件打擊
我是照片, 對啦,我就是 大家常用的 JPG! 常見原因之一是:圖檔格式不適當 許多人喜歡存 JPG,但它未必適合每種圖檔性質 世新校園授權圖庫 我的重點是 “文字” 也請把我存成 PNG 謝謝! 我是照片, 對啦,我就是 大家常用的 JPG! 我是 “色塊” 請把我存成 PNG 謝謝! 這文字在 PPT 裡不是很清晰,但在網頁或e-mail 裡會跟「真字」 一樣清晰。
【狀況】不適合存 JPG 的,卻存為 JPG 例如:都是文字、色塊時 結果: 糊糊的, 且檔案大
【狀況】不適合存 JPG 的,卻存為 JPG 例如:文字、色塊、圖案、 漸層
【狀況】存成 JPG 時,品質過低 JPG 壓縮到文字幾乎已無法閱讀
圖檔格式的選擇?依該圖色彩狀況 選對了 沒選對 選對了
for 網頁用圖檔格式 姑且不管 all-users 信件 100 KB 的限制 先來瞭解網頁用 (含 e-mail) 的圖檔格式 For 網頁用 圖檔格式
網頁用的圖檔格式 GIF 圖形交替格式 (Graphics Interchange Format) JPEG 靜態影像壓縮標準,適合照片。 (Joint Photographic Experts Group) GIF 圖形交替格式 (Graphics Interchange Format) 最多 256 色,可以有 1 色透明。適合色塊、 圖案。 PNG 可攜式網路圖案 (Portable Network Graphics) PNG 有兩種: PNG 8 和 PNG 24
網頁用的圖檔格式 檔案格式 色彩深度 透明度 JPG 無 GIF 周圍常一圈白白的 PNG (8) (同上) PNG (24) 漸漸透明,很平順 全彩,224 28 28 全彩,224 8 位元 索引色 最多 256 種色彩 24 位元 全 彩 16,777,216 種色彩變化
全彩、256 色 224 = 16,777,216 28 =256 〝一千六百多萬色〞數字太長了 「 24 位元」比較好講。 俗稱「全彩」 〝一千六百多萬色〞數字太長了 「 24 位元」比較好講。 俗稱「全彩」 28 =256 8 位元 又叫「索引色」
實例效果比較
JPG、GIF/PNG(8)、PNG(24) 更改投影片背景色 可清楚看到效果…
JPG、GIF/PNG(8)、PNG(24) JPG PNG 8 GIF 更改投影片背景色 可清楚看到效果… PNG 24
JPG、GIF/PNG(8)、PNG(24)
JPG、GIF/PNG(8)、PNG(24) JPG GIF PNG 8 PNG 24
投影片「背景色」與圖檔原來背景色相同時 圖片來源:故宮網站
投影片「背景色」與圖檔原來背景色不同時 圖片來源:故宮網站 PNG 24 PNG 8 GIF
檔案大小舉例: PNG (8): 26 KB JPG (60%): 34 KB
JPG 和 PNG (8) 以字體和圖案為主時,適合 PNG (8) 照片為主時,適合 JPG GIF 和 PNG(8) 外觀效果一樣 但 PNG(8) 檔案比較小 所以兩者作選擇時,建議 PNG(8) 「文字」存成「圖檔」時,會清楚到誤以為還是〝文字〞 【例】英語系以《Write to Learn》線上系統,促進新生的「英文作文」能力 照片為主時,適合 JPG JPG 和 PNG(24) 都是全彩 PNG(24) 很完美,但檔案比較大,適合作備份 all-users 信件上限是100 KB, 所以內嵌於 e-mail 時通常不使用 PNG (24) 採連結方式或另開網頁時則可考慮 【例】可汗學院 (1):教室有牆、教育無界,24 小時「網路家教」
所以… 要嘛 PNG (8) 要嘛 JPG 至於 GIF,除非是動畫,否則不建議 GIF 動畫 圖片來源:Google 首頁
儲存圖檔的軟體 PowerPoint Photoshop Illustrator 較簡單,有時效果較差 可存成 PNG 後,再到 Photoshop 重存 以下二者可較仔細設定 Photoshop Illustrator PowerPoint Photoshop Illustrator
SHU 儲存圖檔:PowerPoint PowerPoint 也可存圖檔, 但 GIF 效果較差,PNG 是 24,沒有 PNG (8) 這是圖檔了 SHU 這還是文字 GIF PNG 24 JPG 選取後, 按右鍵, 選 「另存成圖片」
在 Photoshop「儲存為網頁用」格式 1. 選檔案格式 看這樣好不好 2. 該格式相關設定 例如 JPG要設壓縮品質 這會影響到檔案大小 3. 查看檔案大小
在 Illustrator 「儲存為網頁用」 格式 1. 選格式 看這樣好不好 2. 設寬度 按 [套用] 從向量圖轉存時 寬高愛設多寬就多寬 3. 查看檔案大小
注意事項: JPG 越存會越差 儘量拿原始的製作檔來重設長寬、儲存選項 避免一再拿上一手的 JPG 重存。 變 差
注意事項: 一開始就要選對格式, 不要拿已存錯的檔來改存。 因此,手上要保留最原來的檔 (如:照片、psd、ai、ppt (x)…) 一開始就要選對格式, 不要拿已存錯的檔來改存。 例如應該存成 png,卻存成 jpg 請不要拿 jpg 來另存 請拿原始製作檔 (例如 psd) 來重新設定儲存 因此,手上要保留最原來的檔 (如:照片、psd、ai、ppt (x)…)
校園授權圖庫 本校校園授權圖庫:照片類 61 類,各舉 4 例,共 244 例 本校校園授權圖庫:向量圖案類 (19 輯) 照片類 向量圖
祝 順 利