av网站免费线看精品_国产做a爱视频免费不_深爱激情网开心五月天_伊人五月天在线视频网

 
網(wǎng)頁(yè)圖片優(yōu)化大全
發(fā)布時(shí)間:2005-01-04   瀏覽次數(shù):1188012
    一個(gè)好的站點(diǎn),不但要有精彩的內(nèi)容,還需要有一個(gè)美觀的頁(yè)面。談到美觀離不開圖片,在頁(yè)面中適當(dāng)?shù)赜靡恍┚赖膱D片作為點(diǎn)綴,會(huì)使你的網(wǎng)頁(yè)大放異彩。但是,圖片使用不當(dāng),也會(huì)適得其反,把你的訪問(wèn)者給嚇跑。主要原因在于圖片尺寸太大,訪問(wèn)者還沒(méi)等打開早已不耐煩了。  現(xiàn)在向大家介紹一些對(duì)圖片進(jìn)行處理的方法,以使圖片能在網(wǎng)頁(yè)中迅速顯示出來(lái)! ∵x好圖片格式  圖片文件的格式有很多,如GIF、JPEG(文件擴(kuò)展名為.jpg)、BMP、PNG等,它們都是可以用瀏覽器瀏覽的,但到底選擇哪種圖片格式比較好呢?其實(shí)在一般情況下我們只需選擇前面的兩種,即GIF格式與JPEG格式。因?yàn)檫@兩種文件格式能對(duì)圖像進(jìn)行很大程度的壓縮,使得在產(chǎn)生相近視覺效果的前提下,圖像文件尺寸卻小很多。如果圖像是通過(guò)掃描儀或者數(shù)碼相機(jī)獲取的,這種圖片中所用到的色彩比較多,這時(shí)候我們應(yīng)該選擇使用JPEG格式來(lái)存儲(chǔ)圖像。如果圖片色彩比較少,一般選擇GIF格式! p少圖片色彩數(shù)量  圖片內(nèi)色彩數(shù)量愈多,文件尺寸愈大,在PaintShopPro軟件的“Color”下拉菜單中,有一項(xiàng)“DecreaseColorDepth”功能,它是用來(lái)減少圖像所用顏色數(shù)目的,你可以選擇其中的“16Colors”,即將圖片所使用的色彩數(shù)量減到16種顏色。當(dāng)顏色數(shù)目減少后,如果你認(rèn)為圖像質(zhì)量變化不大,這時(shí)你可以選用GIF格式。  對(duì)圖片進(jìn)行適當(dāng)壓縮  如果你認(rèn)為色彩數(shù)量減少后圖像的視覺效果明顯變差,讓你不能忍受,那么我們可以采用JPEG壓縮格式。無(wú)論是使用什么樣的圖形處理軟件,在以JPEG格式存盤時(shí),都要向你詢問(wèn)JPEG的壓縮比。通常,采樣50%到70%的壓縮率比較好。你不妨在這時(shí)試著使用256色的格式將圖片存儲(chǔ)成GIF格式,與JPEG格式的文件比一比哪個(gè)字節(jié)數(shù)更少、圖像質(zhì)量如何,最終再?zèng)Q定使用什么圖像格式! D1  控制圖片的尺寸  圖形尺寸越小,則字節(jié)數(shù)相應(yīng)會(huì)越少。這要求在制作圖像時(shí),應(yīng)盡量將圖形四周無(wú)用的信息去掉,比如說(shuō)你制作了一個(gè)非常漂亮的標(biāo)題文字的圖片,這個(gè)圖片的背景與網(wǎng)頁(yè)的底色相同或者用透明色,這時(shí)你制作的圖片一定要讓美術(shù)字盡量充滿整個(gè)圖像,不要讓圖片中底色邊框過(guò)大。還有是在制作網(wǎng)頁(yè)使用圖片時(shí),可以添加“Width”和“Height”屬性,即標(biāo)注原始圖片的長(zhǎng)度與寬度。這樣可以幫助瀏覽器迅速、準(zhǔn)確地對(duì)網(wǎng)頁(yè)的版面進(jìn)行安排,避免瀏覽器在顯示圖片的過(guò)程中重新調(diào)整、配置網(wǎng)頁(yè)的版面。圖2  圖片長(zhǎng)寬度的標(biāo)注方法為:width=x,height=y。其中的“x”、“y”表示圖片的長(zhǎng)寬各為多少像素(Pixels)。需要說(shuō)明的是,這個(gè)寬度和高度與圖片本身的尺寸無(wú)關(guān)。也是說(shuō),在一個(gè)大的圖片上我們可通過(guò)更改圖片這兩個(gè)屬性使圖片在顯示的時(shí)候變形,可以變大,也可以變小。  更改圖片的顯示方式  圖片的方法已經(jīng)全部送上,也是說(shuō)圖片的字節(jié)數(shù)已經(jīng)是無(wú)法再減少了。但是,我們還可以想辦法在圖片文件大小一定的情況下,讓瀏覽者可以耐心地等待圖片全部出來(lái)(抓住瀏覽者的心,^_^)的方法。其方法是采用隔行GIF和逐級(jí)JPEG方式。  隔行GIF是指圖片文件按照隔行的方式來(lái)顯示,比如先出奇數(shù)行,再出偶數(shù)行,造成圖片是逐漸變清楚的。將圖片文件保存成隔行GIF格式的方法是:在Photoshop中進(jìn)行保存時(shí),選擇“Interlaced”(如圖1);在PaintShopPro中進(jìn)行保存時(shí),點(diǎn)擊“Option…”按鈕,選擇“Interlaced”(不要選擇“NonInterlaced”)! D3  逐級(jí)JPEG文件可以讓圖片先以比較模糊的形式顯示,隨著文件數(shù)據(jù)不斷從網(wǎng)上傳過(guò)來(lái),圖片逐漸變清晰。將圖片文件保存成逐級(jí)JPEG格式的方法是:在Photoshop中進(jìn)行保存時(shí),選擇“Progressive”,圖2是Photoshop6.0英文版中的選項(xiàng)菜單,圖3是Photoshop5.0中文版中的選項(xiàng)菜單。我們可以發(fā)現(xiàn),在6.0中還增加文件尺寸與使用Modem下載時(shí)所需時(shí)間的指示,使我們的工作更加方便了。在PaintShopPro中進(jìn)行保存時(shí),點(diǎn)擊“Option…”按鈕,選擇“Progressiveencoding”! ∵x用lowsource圖片  如果在網(wǎng)頁(yè)上要放一個(gè)較大的圖片的時(shí)候,不妨選用“l(fā)owsource”(預(yù)覽圖)圖片的方法。即在顯示原圖之前,先提供一個(gè)解析度略差或長(zhǎng)寬度略小的圖片當(dāng)做“l(fā)owsource”,使得瀏覽器可以先快速地展現(xiàn)出這個(gè)“l(fā)owsource”圖片,圖4是Dreamweaver中的圖片屬性面板。然后再漸漸地以高畫質(zhì)或較大圖片取代之。通常,“l(fā)owsource”圖片都是主圖片的低分辨率、高壓縮率的版本。4  注意  其中的width=x,height=y是指Src(主圖片)的長(zhǎng)寬度,并非LowSrc(預(yù)覽圖)的長(zhǎng)寬度。如果你不加上width=x,height=y的標(biāo)示,瀏覽器將一律視為以較小圖片作為長(zhǎng)寬尺寸! √貏e提示  ,還要說(shuō)明一點(diǎn)的是:在制作圖片時(shí),單張圖片不要超過(guò)30KB,每個(gè)網(wǎng)頁(yè)的圖片總量不要超過(guò)60KB(一般情況)。據(jù)統(tǒng)計(jì)分析,每頁(yè)不超過(guò)60KB圖片的網(wǎng)頁(yè),其下載速度是可以讓人接受的。所有的圖片都必須“”為小圖片(100×40),一般可以控制在6KB以內(nèi),動(dòng)畫控制在15KB以內(nèi),較大的圖片可以分割成小圖片! 
立即預(yù)約