Transcript jpg_gif_png8_png24

教學卓越中心
2013/12
edited by CTE
2

許多人喜歡存 JPG，但它未必適合每種圖檔性質
世
新
校
園
授
權
圖
庫
我是照片，
對啦，我就是
大家常用的 JPG！
我是 “色塊”
請把我存成 PNG
謝謝！
我的重點是 “文字”
也請把我存成 PNG
謝謝！
這文字在 PPT 裡不是很清
晰，但在網頁或e-mail
裡會跟「真字」 一樣清晰。 3
◦ 例如：都是文字、色塊時
◦ 結果： 糊糊的， 且檔案大
4
◦ 例如：文字、色塊、圖案、 漸層
5
◦ JPG 壓縮到文字幾乎已無法閱讀
6
7

姑且不管 all-users 信件 100 KB 的限制
先來瞭解網頁用 (含 e-mail) 的圖檔格式
For
網頁用
圖檔格式
8
 JPEG
靜態影像壓縮標準，適合照片。
(Joint Photographic Experts Group)
 GIF
圖形交替格式
(Graphics Interchange Format)
◦ 最多 256 色，可以有 1 色透明。適合色塊、 圖案。
 PNG
可攜式網路圖案
(Portable Network Graphics)
PNG 有兩種：
PNG 8
和 PNG 24
9
9
檔案格式 色彩深度
透明度
JPG
無
GIF
PNG (8)
PNG (24)
全彩，224
周圍常一圈白白的
28
（同上）
28
漸漸透明，很平順
全彩，224
8 位元 索引色
24 位元 全
彩
最多 256 種色彩
16,777,216 種色彩變化
10
 224 ＝ 16,777,216
◦ 〝一千六百多萬色〞數字太長了
「 24 位元」比較好講。
◦ 俗稱「全彩」
 28 ＝256
◦ 8 位元
◦ 又叫「索引色」
11
更改投影片背景色
可清楚看到效果…
JPG
更改投影片背景色
可清楚看到效果…
PNG 24
15
JPG
PNG 24
圖
片
來
源
：
故
宮
網
站
圖
片
來
源
：
故
宮
網
站

PNG (8): 26 KB

JPG (60%): 34 KB
19

以字體和圖案為主時，適合 PNG (8)
◦ 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 小時「網路家教」
20
PNG (8)
要嘛 JPG
 要嘛
 至於
GIF，除非是動畫，否則不建議
GIF 動畫
圖片來源：Google 首頁
21

PowerPoint
◦ 較簡單，有時效果較差
◦ 可存成 PNG 後，再到 Photoshop 重存
以下二者可較仔細設定

Photoshop

Illustrator
PowerPoint
Photoshop
Illustrator
22

PowerPoint 也可存圖檔，
但 GIF 效果較差，PNG 是 24，沒有 PNG (8)
這是圖檔了
這還是文字
選取後，
按右鍵，
選 「另存成圖片」
JPG
PNG 24
GIF
23
24
從向量圖轉存時
寬高愛設多寬就多寬
25

儘量拿原始的製作檔來重設長寬、儲存選項
避免一再拿上一手的 JPG 重存。
變差
26

一開始就要選對格式，
不要拿已存錯的檔來改存。
◦ 例如應該存成 png，卻存成 jpg
請不要拿 jpg 來另存
請拿原始製作檔 (例如 psd) 來重新設定儲存

因此，手上要保留最原來的檔
（如：照片、psd、ai、ppt (x)…）
27

本校校園授權圖庫：照片類

本校校園授權圖庫：向量圖案類 (19 輯)
◦ 61 類，各舉 4 例，共 244 例
向
量
圖
照
片
類
28