Presentation is loading. Please wait.

Presentation is loading. Please wait.

圖檔格式選擇 JPG, GIF, PNG (8) , PNG (24)

Similar presentations


Presentation on theme: "圖檔格式選擇 JPG, GIF, PNG (8) , PNG (24)"— Presentation transcript:

1 E-mail 圖檔格式選擇 JPG, GIF, PNG (8) , PNG (24)
教學卓越中心 2013/12 我們來自 “世新校園授權圖庫” edited by CTE

2 【困擾】 all-users 信件 因超過 100 KB 而迭遭退件打擊

3 我是照片, 對啦,我就是 大家常用的 JPG!
常見原因之一是:圖檔格式不適當 許多人喜歡存 JPG,但它未必適合每種圖檔性質 世新校園授權圖庫 我的重點是 “文字” 也請把我存成 PNG 謝謝! 我是照片, 對啦,我就是 大家常用的 JPG! 我是 “色塊” 請把我存成 PNG 謝謝! 這文字在 PPT 裡不是很清晰,但在網頁或 裡會跟「真字」 一樣清晰。

4 【狀況】不適合存 JPG 的,卻存為 JPG 例如:都是文字、色塊時 結果: 糊糊的, 且檔案大

5 【狀況】不適合存 JPG 的,卻存為 JPG 例如:文字、色塊、圖案、 漸層

6 【狀況】存成 JPG 時,品質過低 JPG 壓縮到文字幾乎已無法閱讀

7 圖檔格式的選擇?依該圖色彩狀況 選對了 沒選對 選對了

8 for 網頁用圖檔格式 姑且不管 all-users 信件 100 KB 的限制 先來瞭解網頁用 (含 e-mail) 的圖檔格式 For
網頁用 圖檔格式

9 網頁用的圖檔格式 GIF 圖形交替格式 (Graphics Interchange Format)
JPEG 靜態影像壓縮標準,適合照片。 (Joint Photographic Experts Group) GIF 圖形交替格式 (Graphics Interchange Format) 最多 256 色,可以有 1 色透明。適合色塊、 圖案。 PNG 可攜式網路圖案 (Portable Network Graphics) PNG 有兩種: PNG 8 和 PNG 24

10 網頁用的圖檔格式 檔案格式 色彩深度 透明度 JPG 無 GIF 周圍常一圈白白的 PNG (8) (同上) PNG (24)
漸漸透明,很平順 全彩,224 28 28 全彩,224 8 位元 索引色 最多 256 種色彩 24 位元 全 彩 16,777,216 種色彩變化

11 全彩、256 色 224 = 16,777,216 28 =256 〝一千六百多萬色〞數字太長了 「 24 位元」比較好講。 俗稱「全彩」
〝一千六百多萬色〞數字太長了 「 24 位元」比較好講。 俗稱「全彩」 28 =256 8 位元 又叫「索引色」 256 色

12 實例效果比較

13 JPG、GIF/PNG(8)、PNG(24) 更改投影片背景色 可清楚看到效果…

14 JPG、GIF/PNG(8)、PNG(24) JPG PNG 8 GIF 更改投影片背景色 可清楚看到效果… PNG 24

15 JPG、GIF/PNG(8)、PNG(24)

16 JPG、GIF/PNG(8)、PNG(24) JPG GIF PNG 8 PNG 24

17 投影片「背景色」與圖檔原來背景色相同時 圖片來源:故宮網站

18 投影片「背景色」與圖檔原來背景色不同時 圖片來源:故宮網站 PNG 24 PNG 8 GIF

19 檔案大小舉例: PNG (8): 26 KB JPG (60%): 34 KB

20 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, 所以內嵌於 時通常不使用 PNG (24) 採連結方式或另開網頁時則可考慮 【例】可汗學院 (1):教室有牆、教育無界,24 小時「網路家教」

21 所以… 要嘛 PNG (8) 要嘛 JPG 至於 GIF,除非是動畫,否則不建議 GIF 動畫 圖片來源:Google 首頁

22 儲存圖檔的軟體 PowerPoint Photoshop Illustrator 較簡單,有時效果較差
可存成 PNG 後,再到 Photoshop 重存 以下二者可較仔細設定 Photoshop Illustrator PowerPoint Photoshop Illustrator

23 SHU 儲存圖檔:PowerPoint PowerPoint 也可存圖檔, 但 GIF 效果較差,PNG 是 24,沒有 PNG (8)
這是圖檔了 SHU 這還是文字 GIF PNG 24 JPG 選取後, 按右鍵, 選 「另存成圖片」

24 在 Photoshop「儲存為網頁用」格式
1. 選檔案格式 看這樣好不好 2. 該格式相關設定 例如 JPG要設壓縮品質 這會影響到檔案大小 3. 查看檔案大小

25 在 Illustrator 「儲存為網頁用」 格式
1. 選格式 看這樣好不好 2. 設寬度 按 [套用] 從向量圖轉存時 寬高愛設多寬就多寬 3. 查看檔案大小

26 注意事項: JPG 越存會越差 儘量拿原始的製作檔來重設長寬、儲存選項 避免一再拿上一手的 JPG 重存。 變 差

27 注意事項: 一開始就要選對格式, 不要拿已存錯的檔來改存。 因此,手上要保留最原來的檔 (如:照片、psd、ai、ppt (x)…)
一開始就要選對格式, 不要拿已存錯的檔來改存。 例如應該存成 png,卻存成 jpg 請不要拿 jpg 來另存 請拿原始製作檔 (例如 psd) 來重新設定儲存 因此,手上要保留最原來的檔 (如:照片、psd、ai、ppt (x)…)

28 校園授權圖庫 本校校園授權圖庫:照片類 61 類,各舉 4 例,共 244 例 本校校園授權圖庫:向量圖案類 (19 輯) 照片類 向量圖

29 祝 順 利 我周圍稍微有一圈白白的, 在不嚴格要求的場合下, 就無所謂啦~ 畢竟 png(8) 比 png(24) 小很多 。


Download ppt "圖檔格式選擇 JPG, GIF, PNG (8) , PNG (24)"

Similar presentations


Ads by Google