jpg 、 gif 、 png
DESCRIPTION
JPG 、 GIF 、 PNG. 教學卓越中心、電算中心 2009/10/09 ( 五 )A. 我來自 “ 世新校園授權圖庫 ”. edited by Wang. 近日 e-mail 退件例子 (1). From: "Mail Manager" [email protected] To: " 世新 oo 所 " [email protected] Sent: Wednesday, October 07, 2009 12:21 PM Subject: [ 拒絕傳送 ] 99 摮詨僑摨行 ?? 牧 ??(98/10/13?? 鈭 ?- - PowerPoint PPT PresentationTRANSCRIPT
JPG 、 GIF 、 PNG教學卓越中心、電算中心
2009/10/09 (五 )A
我來自 “世新校園授權圖庫”
edited by Wang
2
From: "Mail Manager" [email protected]: " 世新 oo 所 " [email protected]: Wednesday, October 07, 2009 12:21 PMSubject: [ 拒絕傳送 ] 99 摮詨僑摨行 ?? 牧 ??(98/10/13??鈭 ?-
您的信件大小為 514.99 KB ，而寄給 faculty 的信件最大上限為 100 KB請將您的信件縮小後再寄一次，謝謝合作！
電算中心 敬啟
近日 e-mail 退件例子 (1)
3
From: “Mail Manager” [email protected]: “ 世新 oo 所 " [email protected]: Wednesday, October 07, 2009 11:38 AMSubject: [ 拒絕傳送 ] 99 摮詨僑摨行 ?? 牧 ?? 嚗迭餈 ? 撖 ?摰
您的信件大小為 118.15 KB ，而寄給 all-users 的信件最大上限為 100 KB請將您的信件縮小後再寄一次，謝謝合作！
電算中心 敬啟
近日 e-mail 退件例子 (2)
4
From: “Mail Manager” [email protected]: “oo 學系” [email protected]: Thursday, October 08, 2009 9:50 AMSubject: [ 拒絕傳送 ] 98 學年度「培養卓越菁英主播小龍計畫
您的信件大小為 102.20 KB ，而寄給 all-users 的信件最大上限為 100 KB請將您的信件縮小後再寄一次，謝謝合作！
電算中心 敬啟
近日 e-mail 退件例子 (3)
5
該如何估算 e-mail 的檔案大小？…◦ http://cc.shu.edu.tw/~www/week_qa/qa/q_200512
24_e-mail_size.htm
在本校寄給 all-users 的信件最大上限為 100 KB 的情況下，我們該如何縮小 e-mail 的大小？◦ http://cc.shu.edu.tw/~www/week_qa/qa/q_200611
14_e-mail_smgmt.htm
e-mail 的大小？
1 + 約 30%
6
【方案１】◦適當的圖檔格式 gif? jpg?
【方案２】◦ 不要把 Word 裡的一堆
文字 Copy 後貼進 e-mail
【方案３】◦ 圖片 ( 或檔案 ) 採超連
結方式，不要直接嵌進e-mail
郵件不要太大以免被退件之解決方案
本場次重點
《雲門舞集舞作》數位典藏計畫 http://cloudgate.e-lib.nctu.edu.tw/
視該圖檔需要多少色彩？色彩如何分佈？
8
圖檔格式的選擇？
?
9
圖檔格式的選擇？
?
10
格式存錯了，再另存一次？
◦ （上錯天堂投錯胎）◦ 捨棄的資訊、細節再也回不來！
圖片來源：維基網站
希望得到香脆的結果，
可以選擇用 “蒸” 的嗎？
一開始就該用炸的食物，若不小心先蒸了，
之後再炸它，味道會和直接炸的一樣
嗎？
11
長 x 寬 x 色彩深度例：
1024 x 768 x 3 Bytes = 2.25 MB例：
400 x 400 x 3 Bytes = 468.75 KB
【問】不壓縮的全彩點陣圖有多大？
超過 100 KB…
既然不壓縮的檔很大，那就壓縮吧 …
12
1 位元 黑 白 黑白 2 色變化 8 位元 灰 階 256 色灰階變化16 位元 高 彩 65,536 種色彩變化24 位元 全 彩 16,777,216 種色彩變
化---------------------------------------
8 位元 索引色 最多 256 種色彩
色彩深度 ( 位元 )
1313
三大網頁圖檔格式的火拼
GIF
JPG
PNG
PNG
8
24
索引色 全彩
14
色彩深度 -- 1 位元 (bit)
21=2黑白 2 色變化
15
22=4黑灰白 4 階變化
色彩深度 -- 2 位元 (bits)
色階還很明顯地不連續
16
色彩深度 -- 8 位元 (bits)
28=256如為灰階 , 有 256 階變
化
當您的眼睛已分辨不出一階階時
連續色調﹙ 和觀看距離之遠近有關﹚
17
【灰階】與【黑白】
18
28=2568 bits = 1 Byte
24 bits = 3 Bytes
19
28 x 28 x 28
=16,777,216
(1 千 6 百多萬 )
色彩深度 -- 24 位元 (bits)
R G B
色光三原色各用 256 階表示其強度
色光三原色各用 256 階表示其強度
8 bits = 1 Byte24 bits = 3 Bytes
20
索引色 index color ： 8 位元
最多 256 色
網頁上常用的 GIF 檔就是屬於這種。因為顏色少，所以檔案可以壓縮到很小。
從 2 色到最多 256 色
21
索引色
4 色 (10 K)8 色 (14 K)
可以從1
千6
百多萬色中，任意挑選出所要顏色
22
索引色
你的 4 色我的 4 色同樣挑四個顏色，我挑的和你挑的未必相同…
23
練習
26
http://cc.shu.edu.tw/~cte/gallery/ccli/e-mail/20070506_reply_jennifer_r3.htm
例：抓 Word 圖
27
例：抓對話框
Alt PrintScren+
28
http://cc.shu.edu.tw/~cte/gallery/ccli/e-mail/20061012_for_rhetoric_class.htm
http://cc.shu.edu.tw/~cte/gallery/ccli/e-mail/20061003_rhetoric.htm
例：抓 PowerPoint 圖
?
to GIF or to PNG-8 ？
練習檔
PNG-8 ？PNG-24 ？
33
JPG 、 GIF 、 PNG24
34
JPG 、 GIF 、 PNG24
35
PNG 24 的舞台：簡報檔、 Flash…
請更改投影片背景色以便清楚看到效果…
PNG 24 的舞台：簡報檔、 Flash…
請更改投影片背景色以便清楚看到效果…
37
練習
3838
GIF圖形交替格式 (Graphics Interchange Format) ◦ 是全球資訊網和其他線上服 務上，在超文字標記語言
(HTML) 文件中顯示索引色圖像和影像常用的檔案格式。◦ GIF 是一種 LZW 壓縮的格式，可以最小化檔案大小
和電子傳輸的時間。◦ GIF 格式可以保留索引色影像中的透明，但卻不能支援
Alpha 色版。
三大網頁圖檔格式
本段直接摘自 Photoshop 7 說明
少講一個很重要的：最多 256 色！
3939
JPEG 靜態影像壓縮標準(Joint Photographic Experts Group) ◦ 是全球資訊網和其他線上服 務上，在超文字標記語言
(HTML) 文件中顯示照片和其他連續色調影像常用的格式。BMP 格式支援「 CMYK」、「 RGB」和「灰階」色彩模式，且不支援 Alpha 色版。
◦與 GIF 格式不同的是， JPEG 會保留 RGB 影像中所有的顏色資訊， 但會選擇性地放棄資料以壓縮檔案大小。
◦ JPEG 影像會在開啟時自動地解除壓縮。較高的壓縮層級會導致影像的品質較低，而較低的壓縮層級會導致影像品質較佳。
◦ 在多數的情況下，「最大」的品質選項製造的結果，與原始影像幾乎沒有差別。
三大網頁圖檔格式
本段直接摘自 Photoshop 7 說明
4040
PNG 可攜式網路圖案 (Portable Network Graphics) ◦ 是研發出來的另一種無專利的格式 (除 GIF 外的另一
種格式 ) ，可以用來進行無減色壓縮和在全球資訊網上顯示影像。
◦與 GIF 不同的是： PNG 支援 24 位元影像，並且可以製造沒有鋸齒邊緣的背景透明。
◦但是，有些網頁瀏覽器不支援 PNG 影像。◦ PNG 格式支援沒有 Alpha 色版的「 RGB」、「索引色」、「灰階」和「點陣圖」模式影像。 PNG 可以保留灰階和 RGB 影像中的透明。
三大網頁圖檔格式
本段直接摘自 Photoshop 7 說明
有兩種：PNG 8
和PNG 24
41
比較
42
比較
PNG: 26 KB JPG (60%): 34 KB
43
將 .ai 的向量圖，存成網頁使用之格式
Illustrator CS 版介面
一切順利
PNG 8PNG 24