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