認識網路圖檔及其特性
|
您知不知道網路圖檔的這些事情？ |
| 01.甚麼是網際網路上最美的地方？ A：圖片。 02.網際網路所用的圖檔有那些？ A：GIF、JPEG、PNG。 03.網際網路圖片種類有那些？ A：Banner(標題)、Icon(圖示)、Picture(圖片)、Buttom(按鈕)、BackPicture(背景圖檔)、LinPicture(線段圖檔)、AimPicture(動態圖檔)、.............。 04.網際網路圖片解析度要多少？ A：72像素就足夠用。 05.常用的網際網路圖片工具有那些？ A：影像處理軟體：PhotImpact、PhotoShop(*)、FireWork(*)、CorelDraw(*) 動畫及3D軟體：GIF Animator、Flash(*)、Director(*)、Cool 3D、3D Studio(*)、Poser 3D(*) 影像地圖編輯軟體：PhotImpact、Mapedit、FontPage 初學者比較適使用PhotImpact、GIF Animator；打(*)者，屬比較專業性軟體。 06.網際網路圖片要如何產生？ A：掃瞄、數位攝影、繪圖、光碟片、免費資源、線上合成、找人幫忙...。 07.網際網路圖檔還可以作何用途？ A：用表格來作圖框、圖片周邊空點、超鏈結、高檔圖片預視..............。 08.網際網路圖檔那裡找？ A：您只要到搜索引擎輸入：圖片、圖檔、icon、banner...等等，可以找到很多。 09.我是初學者，該如何開始學習？ A：強烈建議您：請立即加入本報特別針對，首次接觸網頁網友而設的教學會員專案。 |
|
認識影像類型 |
| 黑白：影像中的每一點，又稱為像素(pixel)，只佔1 bit(0或1)。 灰階：影像中包含深淺不同的灰色，每個像素佔8 bits，所以每點有 28=256 種變化。 16色：影像呈現，最多用到 16 種顏色，每個像素須佔4 bits，方能有 24=16 種變化。 256色：影像呈現，最多用到 256 種顏色，每個像素須佔8 bits，方能有 28=256 種變化。 全彩：影像呈現，最多用到 1677 萬種顏色，每個像素須佔24 bits，方能有 224 = 1677 萬種變化。 |
|
常見的影像檔案 |
| BMP：未經壓縮的影像檔格式。 JPG：破壞性壓縮，用於網路傳輸。 GIF：非破壞性壓縮，用於網路傳輸。 TIF：標籤影像檔，用於排版、印刷。 PSD：PhotoShop檔案格式。 UFO：PhotoImpact檔案格式。 |
|
認識網路圖檔GIF |
| 01.GIF 是 Graphics Interchange Format 的縮寫，翻譯為圖形交換格式。 02.是由 CompuServe 機構所發展出來的位元映射式 (bitmapped) 影像檔案格式。 03.一個 GIF 檔案包含了六個位元組的檔案標記，目前常見的有『87a』與『89a』兩種。 04.優點：可作動畫、透明圖。 05.缺點：色彩數少、易失真。 06.副檔名：*.gif；注意：請用英文小寫。 |
|
認識網路圖檔JPG |
| 01.JPEG 是 Joint Photographic Experts Group 的縮寫，翻譯為聯合圖像專業團體。 02.是利用離散餘弦轉換壓縮技術來儲存靜態影像的檔案格式。 03.優點：色彩豐富、畫質優美。 04.缺點：不適何文字等圖形運用、檔案過大。 05.副檔名：*.jpg OR jpeg；注意：請用英文小寫。 |
|
認識網路圖檔PNG |
| 01.PNG是 Portable Network Graphics 的縮寫，翻譯為可攜式網路圖形。 02.PNG是個全真圖像格式(true image format)，擁有比GIF更佳的壓縮品質又不會失真。 03.PNG是在 1996由PNG向W3C (World Wide Web Consortium) 提出並得到推薦認可的多媒體圖形格式。 04.優點：集GIF與JPEG優點於一身。 05.缺點：目前不是所有瀏覽器都能支持此格式。 06.副檔名：*png；注意：請用英文小寫。 |
| GIF、JPEG、PNG三者差異比較 | |||||||
| 檔名 | 尺寸 | 色採 | 位元 | 壓縮方式 | 型態 | 傳輸方式 | 適用範圍 |
| GIF | 較大 | 256 | 8 bits | 非破壞性 | 點陣圖 | 交錯式 | 動畫、圖示、透明圖 |
| JPEG | 較小 | 16Mill | 24 bits | 破壞 | 向量圖 | 漸進式 | 照片 |
| PNG | 兩者均宜 | 兩者均宜 | 8-46 bits | 無損耗 | 可攜式網路圖形 | 交錯式 | 動畫、照片、透明圖 |
| 看了這個比較表後，您是否感覺到清楚了很多？ | |||||||
|
認識繪圖軟體 |
| 01.點陣軟體： 所謂【點陣軟體】，乃是將影像以一顆一顆的像素【Pixel】所繪製出來的，放大後的影像即以九宮格的方式所呈現。其檔案容量較向量軟體所繪製出來的影像大，例如：PhotoImpact、Photoshop等屬之。 補充說明：圖形儲存時，以點為紀錄單位。因此，在圖形放大或旋轉後容易失真。在圖形放大後，其邊緣會產生鋸齒狀。 02.向量軟體： 利用數學公式計算出來的影像。即使放大影像，亦不產生如鋸齒般的失真情形，而且檔案容量小，例如：CorelDRAW、Illustrator等屬之。 補充說明：以繪圖元素為紀錄單位的圖形。其中包括點、直線、連續直線、圓、矩形等圖形。放大或旋轉後，會重新計算新的位置、大小、方向等資料。因此，沒有失真的問題，也不會因圖形所佔的空間變大，而須較多的記憶體。 03.如放大1600％影像圖示之比較： 點陣軟體V.S向量軟體(您只要來回移動滑屬便可)。 |
|
常用HTML圖檔語法 |
| 背景圖語法：<body background="圖案名稱.附檔名">。 圖檔語法：<img src="路徑\圖案名稱.附檔名">。 圖檔相關屬性： alt="""""給圖片的註解文字"、Border="N"、Height="pixel"、Width="pixel"、 align="(top/middle/bottom/left/right)"、Hspace="pixel"、Vspace="pixel"。 影像地圖語法： | <MAP NAME="圖片名稱"> <AREA、SHAPE="形狀"、HREF="檔名"、COORDS="坐標"> </MAP>
| 結論 01.使用底圖不宜過深並應考量一致性，以利文件(字)安排及整體性。 02.純文字展示時，應特別注意背景BGCOLOR《背景圖BACKGROUND》及文字FONT之顏色搭配。 03.每一頁切勿放置過多圖檔，全部請控制於60k以下，每一圖檔亦請控制於15k左右。 04.善用ALT="文字說明"，以利那些耐候不住或關閉圖片功能之網友使用。 05.加了Height與Width這兩個屬性，將會縮短瀏覽器排版的時間。 06.善用路徑(目錄)觀念，妥為分類(如pic,image,gif...)，以利以後網頁維護。 07.檔案大小要控制好，icon/1kb、banner/15kb、picture/30kb，必要時分割。 08.學會如何用【ACDSee】看圖軟體查看圖片種類、尺寸等資訊。 09.圖片的運用很重要，網站內容除外，就是整體圖片與色彩的搭配組合。 |
|
圖檔副檔名種類詳解★★★★ |
| 01.點陣性圖形： ● 點陣性圖形( bitmaps 或 raster )：此類圖形由像素 ( pixel )組合而成，所以在點陣性繪圖軟體裡( 如PhotoImpact 、PhotoShop )使用放大鏡工具將圖檔放大數倍，可以明顯地發現圖形變成馬賽克一樣，圖形就是這一格一格的小方塊（像素）組合而成的。由於點陣性圖形是由一個個像素所組成，所以此類圖形的優點是容易呈現出圖像豐富細膩的質感與細緻的色彩變化，缺點則是圖形的篇幅愈大，需要愈多的像素組成圖形，檔案的大小也就隨之增大。 02.向量性圖形 ● 向量性圖形( vector )：此類圖形使用數學運算式來描述組成影像的目標位置和特性（如形狀、弧度、線條和色彩等）。由於圖形以數學運算式來表示，所以此類圖形的優點是圖形可以輕易地被放大、縮小、旋轉而絲毫不影響到原有的畫質與檔案大小，缺點則是圖形靠數學運算式成形所以無法表現出圖像裡豐富細膩的質感與色彩變化。所以幾何圖形、卡通人物、統計圖表等類型的圖形特別適合使用向量性繪圖軟體繪製。 03. GIF圖形 GIF 點陣式 256色 非破壞性 (256色內) 可指定透明色彩做影像去背，及顯示動畫 Word、Excel、PowerPoint、FrontPage、IE ●GIF圖形交換格式...目前唯一可以儲存動畫效果的存檔格式 GIF(Graphics Interchange Format)是由CompuServe公司發展出來的網路圖形交換格式，適合儲存256色彩色或256色灰階影像，檔案的格式有GIF 87a(交錯顯示)及GIF 89a兩種規格，現在通用的是可以儲存透明背景(但不支援Alpha色版)及動畫效果的GIF 89a規格。GIF格式使用LZW技術縮減影像色彩至256色內並壓縮，以減少檔案大小，因為可以儲存的顏色少，所以不適合用於相片等全彩影像的儲存，只適合作為簡單圖形如卡通人物的存檔格式。 交錯顯示(Interlacing)：網頁圖形的顯示一般是由上而下一條線一條線地依序顯示，直到圖形資料下載完後，才能看到完整的圖形；而交錯顯示則是以相隔八條線的方式跳著顯示，所以圖形的出現有如打開百葉窗一般(有些瀏覽器處理的方式可能不同)，可以讓瀏覽者在圖形未完全出現前，先對圖案有個概念，不過製作GIF動畫時，可能就不適合使用交錯顯示，會有鬼影殘留的現象。 04.JPEG(JPG)圖形 JPEG(JPG) 點陣式 全彩 破壞性 有檔案體積小的優點，但影像會有一定程度的失真 Word、Excel、PowerPoint、FrontPage、IE等支援JPEG檔案交換格式但不支援JPEG2000格式 ●JPG靜態影像壓縮格式...超強的檔案塑身減肥格式 JPEG(Joint Photographic Experts Group )圖檔，又稱JPG檔，是由CCITT&ISO的一群專業人員，於1987年正式推出的一種工業壓縮標準，適用於儲存24位元全彩影像及縮小檔案大小，但不支援透明或動畫。JPEG格式運用壓縮運算法則可以將影像資料壓縮成數十分之一的大小，但壓縮比愈高時影像的資料耗損程度會愈大，影像也會愈失真(為達到高度壓縮，部份資料會被忽略)。多數的影像編輯軟體可以調整JPEG的壓縮比值，一般壓縮比10左右比較無法分辨出與原先的差別。雖然JPEG檔好用，但因是破壞性壓縮，所以不宜使用已耗損的JPEG影像一再修改壓縮，以免影像的品質會愈來愈差。 JPEG格式又可分為標準JPEG、漸進式JPEG及JPEG2000三種格式。 1. 標準JPEG格式：此類型圖檔在網頁下載時只能由上而下依序顯示圖片，直到圖片資料全部下載完畢，才能看到全貌。 2. 漸進式JPEG格式：漸進式JPG為標準JPG的改良格式，可以在網頁下載時，先呈現出圖片的粗略外觀後，再慢慢地呈現出完整的內容(就像GIF格式的交錯顯示)，而且存成漸進式JPG格式的檔案比存成標準JPG格式的檔案要來得小，所以如果要在網頁上使用圖片，可以多用這種格式。 3. JPEG2000格式：新一代的影像壓縮法，壓縮品質更好，並可改善無線傳輸時，常因訊號不穩造成馬賽克及位置錯亂的情況，改善傳輸的品質。此外，以往瀏覽線上地圖時總要花許多時間等待全圖下載，JPEG2000格式具有Random Access的特性，可讓瀏覽者先從伺服器下載10%的圖檔資料，在模糊的全圖中找到需要的部分後，再重新下載這部分資料即可，如此一來可以大幅縮短瀏覽地圖的時間。 05.PNS圖檔 PNG 點陣式 全彩 非破壞性 支援透明色彩但只適用於單張圖片不具動畫效果 Word、Excel、PowerPoint、FrontPage、IE ●PNG可攜式網路圖像格式...潛力佳，但目前支援環境未健全 PNG(Portable Network Graphics)格式與同是網路上流通的影像格式JPEG及GIF相較，有諸多優秀的特性：PNG壓縮影像不失真，可儲存 48 位元的彩色影像，比JPEG的24位元高，像素(pixel)色彩也可有256種不同的透明度選擇，可讓圖像在任何背景上，看不到接縫，改善了GIF格式像素色彩只能有透明或不透明兩種選擇，及GIF檔描邊不佳的問題(GIF檔通常需要針對每種背景顏色採用不同的反毛邊修飾)。此外，PNG格式跨平台的影像亮度控制，可讓影像在不同的作業系統(Windows, Mac, linux)上顯示出相同的效果，不像GIF檔在不同的作業系統上顯示出的畫面會跟著不一樣，所以PNG格式格外適合在網路環境流通。 雖然PNG格式幾乎支援了 GIF 與 JPEG格式的所有功能，但是仍有缺點，缺點則是不能儲存多張影像資訊，所以不能像GIF一樣作為動畫檔的儲存格式，另外，因為PNG使用的是非破壞性的壓縮，所以PNG檔通常比JPEG檔大。除了這兩項缺點，目前PNG格式面臨的最大問題是，目前的瀏覽器雖然基本上都支援此格式，但卻不一定支援它所有的功能，例如IE6.0就無法顯示出PNG檔背景透明的效果，所以PNG格式雖然優異，但是支援的環境仍待加強。 06.TIF(TIFF)圖檔 TIF(TIFF) 點陣式 全彩 非破壞性 最適宜作印刷用的圖檔格式 Word、Excel、PowerPoint、FrontPage ●TIFF標籤資訊格式...最適宜作印刷用的圖檔格式 TIFF(Tagged Image File Format)格式是各種點陣式影像處理軟體、排版軟體或不同作業平台之間圖形交換率最高的一種圖檔類型，可適用於不同的解析度、不同的色彩模式和不同的壓縮方式，是一個不失真的24位元彩色影像格式。由於此格式圖檔的影像品質極高，用於高階印刷顏色也比較不失真，彩色的控制能力及分色列印都極為精確，檔案大小比EPS檔案小許多， 列印速度也比EPS圖檔快，在非PostScript印表機上列印時也不用擔心低解析度預視圖檔的粗糙列印品質，而且還可被眾多的軟體所辨識，在不同的作業平台(Windows,Mac OS)間流通，所以專業的設計師多以TIFF格式儲存圖檔。缺點則是存成TIFF圖檔通常比存成GIF或JPEG檔大。 07.BMP圖檔 BMP 點陣式 全彩 非破壞性 不能儲存印刷用的色彩模式影像，為Windows標準的影像格式 Word、Excel、PowerPoint、FrontPage、IE ●BMP點陣格式...顏色越多越逼真 BMP(Windows Bit Map)是標準的Windows影像格式。電腦作業系統都會有主要的影像格式，蘋果麥金塔常用PICT格式，微軟Windows則是使用BMP格式，BMP檔已有支援24位元全彩的能力，可以用於桌面或螢幕保護程式，在多數的Windows軟體中使用，是很好的原始影像檔，不過解析度不夠高時，影像一放大就會出現馬賽克效果。一般的螢幕抓圖大多是儲存成BMP格式，此格式的缺點就是沒有壓縮功能導致檔案太大，和不支援透明色彩。 08.PICT2圖檔 PICT2 點陣式 全彩 非破壞性 可處理印刷和繪圖兩種模式的影像資料，為麥金塔作業系統標準的影像格式 Word、Excel、PowerPoint ●PICT, PICT2 PICT, PICT2是麥金塔電腦作業系統內建的標準影像格式， 因此大部分在麥金塔電腦上使用的軟體，都可以讀取並產生這樣的圖檔格式。PICT通常用於黑白或是256色內的彩色影像。PICT2則用於8位元灰階或24位元彩色影像。PICT格式的特點是可處理印刷和繪圖兩種模式的影像資料。
|
