網(wǎng)頁(yè)規(guī)劃中：完美的圖畫(huà)處理五大要素

制造網(wǎng)頁(yè)離不開(kāi)大量的圖畫(huà)處理操作。網(wǎng)頁(yè)圖畫(huà)處理與用于打印、視頻的圖畫(huà)處理有著很大的差異，Web規(guī)劃者應(yīng)該有針對(duì)性地把握網(wǎng)頁(yè)圖畫(huà)處理方法和技巧。一般情況下，應(yīng)考慮以下幾個(gè)要素。

　　1. 格式

　　由計(jì)算機(jī)發(fā)作的方式簡(jiǎn)略的圖畫(huà)(如標(biāo)識(shí)、圖標(biāo))首選PNG格式，而色彩豐厚的相片則一定是JPEG。假如色彩不多且沒(méi)有突變，應(yīng)當(dāng)運(yùn)用GIF格式。

　　GIF是用得最多的網(wǎng)頁(yè)圖畫(huà)格式。GIF最多包容256種色彩，幾乎適用于除相片以外的所有圖畫(huà)。它還具有生成簡(jiǎn)略的動(dòng)畫(huà)和通明圖畫(huà)的才能。

　　PNG格式相對(duì)較新，也是W3C引薦的格式。PNG-8最多可包括256種色彩，堪比GIF;PNG-24支撐RGB形式，即能夠體現(xiàn)任何色彩，質(zhì)量較高;PNG-32在PNG-24的基礎(chǔ)上增加了alpha通道，也即能夠設(shè)置通明。

　　JPEG能夠保存約1670萬(wàn)種色彩，常用于保存相片。但除此之外，幾乎用不到JPEG。假如圖畫(huà)色彩少于256種，或許含有大片純色，則JPEG的作用反而不好——為獲得高質(zhì)量的圖畫(huà)，文件巨細(xì)可能成倍增加。

　　挑選圖畫(huà)格式應(yīng)當(dāng)綜合考慮其運(yùn)用范圍，如下文詳細(xì)打開(kāi)的色彩、通明、動(dòng)畫(huà)等方面。能夠經(jīng)過(guò)Photoshop或Fireworks的導(dǎo)出向?qū)П容^各項(xiàng)參數(shù)。挑選的規(guī)范是，確保可接受的圖畫(huà)質(zhì)量的前提下，文件應(yīng)盡可能小。

　　2. 色彩

　　創(chuàng)立圖畫(huà)應(yīng)運(yùn)用RGB形式，而非用于打印的CMYK形式。不必考慮瀏覽器安全色，由于幾乎不再有人運(yùn)用8位的顯示器。色彩的挑選應(yīng)當(dāng)參照統(tǒng)一的規(guī)范，如視覺(jué)辨認(rèn)(VI)系統(tǒng)。色彩的數(shù)量和作用是決定圖畫(huà)格式的重要因素，如色彩突變往往發(fā)作大量色彩，假如保存為GIF則會(huì)發(fā)作失真，文件巨細(xì)也大幅增加，這時(shí)應(yīng)考慮運(yùn)用PNG-24、PNG-32或JPEG格式。

　　3. 尺度

　　運(yùn)用矢量創(chuàng)造東西制造的圖畫(huà)往往適合保存為PNG格式，其尺度應(yīng)在矢量繪圖東西中確定，變?yōu)槲粓D后便不再容易對(duì)其進(jìn)行縮放操作(尤其不應(yīng)進(jìn)行擴(kuò)大操作)。值得注意的是，在Fireworks中創(chuàng)立的PNG文件包括圖層等可編輯信息，其間的直線、形狀、文字都?xì)w于矢量圖。將這樣的圖畫(huà)應(yīng)用于網(wǎng)頁(yè)應(yīng)先進(jìn)行輸出操作以壓縮文件巨細(xì)，而輸出的PNG圖畫(huà)也會(huì)由于丟掉可編輯信息而轉(zhuǎn)為位圖。因此，圖畫(huà)尺度的調(diào)節(jié)應(yīng)在輸出操作之前完結(jié)。不對(duì)位圖進(jìn)行縮放是為了確保圖畫(huà)的輪廓和突變滿足清晰。

　　關(guān)于已有的位圖和相片，應(yīng)先運(yùn)用Photoshop等軟件調(diào)整好尺度后再刺進(jìn)到網(wǎng)頁(yè)中，而不應(yīng)運(yùn)用HTML言語(yǔ)中的width和height屬性改動(dòng)圖畫(huà)尺度。直接運(yùn)用HTML言語(yǔ)控制圖畫(huà)尺度可能會(huì)使圖畫(huà)失真嚴(yán)重。

　　一般，放入網(wǎng)頁(yè)中的圖片應(yīng)控制到一個(gè)比較小的尺度。假如與文字混排，寬度最好在300 px左右。即便單獨(dú)呈現(xiàn)，寬度也最好在600 px以下。至于高度，以不超越一屏為宜。

　　4. 通明

　　GIF和PNG都支撐通明，但方式并不相同。GIF僅僅單純地將某一種或幾種色彩設(shè)為徹底通明，并不考慮與它附近的突變色的通明度。這意味著，假如背景色彩發(fā)作重大改動(dòng)(或許本來(lái)就包括幾種比照明顯的色彩)，與通明部分交界的地方將得不到平滑過(guò)渡，呈現(xiàn)一條明顯的分界線。假如要?jiǎng)?chuàng)立通明GIF，有必要將畫(huà)布背景色設(shè)置成與目標(biāo)作用的背景色相同(或挨近)。PNG不存在這個(gè)問(wèn)題，同時(shí)還能夠設(shè)置半通明。

　　可是默認(rèn)情況下IE6不能正確地顯示通明PNG，需求采取恰當(dāng)?shù)霓k法。

　　5. 動(dòng)畫(huà)

　　網(wǎng)頁(yè)上的動(dòng)畫(huà)一般包括Flash和動(dòng)畫(huà)GIF兩種。Flash功能強(qiáng)壯，作用豐厚，圖畫(huà)質(zhì)量高，且具有強(qiáng)壯的創(chuàng)造軟件，是多數(shù)情況下首選的網(wǎng)頁(yè)動(dòng)畫(huà)方式。動(dòng)畫(huà)GIF的不足是僅能運(yùn)用不超越256種色彩，且難以制造作用復(fù)雜的動(dòng)畫(huà)，但它的優(yōu)勢(shì)是文件小，且無(wú)需插件支撐就能夠在任何舊式的或現(xiàn)代的瀏覽器播映