除了文本之外，網(wǎng)頁(yè)上最重要的設(shè)計(jì)元素莫過(guò)于圖像了。一方面，圖像的應(yīng)用使網(wǎng)頁(yè)更加美觀、有趣；另一方面，圖像本身也是傳達(dá)信息的重要手段之一。與文字相比，它直觀、生動(dòng)，可以很容易地把那些文字無(wú)法表達(dá)的信息表達(dá)出來(lái)，易于瀏覽者理解和接受。 　　1.圖像的格式 　　Web通常使用兩種圖像格式：GIF和JPEG。除此以外，還有兩種適合網(wǎng)絡(luò)傳播但沒(méi)有被廣泛應(yīng)用的圖像格式：PNG和MNG。 　　2.圖像的形式 　　同印刷排版一樣，靜態(tài)圖像在網(wǎng)頁(yè)排版中的運(yùn)用不外乎四種形式：方形圖、退底圖、出血圖以及這三種形式的結(jié)合使用。 　 （1）方形圖　即圖形以直線邊框來(lái)規(guī)范和限制，是一種最常見(jiàn)、最簡(jiǎn)潔、最單純的形態(tài)。方形圖使圖像內(nèi)容更突出且將主體形象與環(huán)境共融，可以完整地傳達(dá)主題思想，富有感染性。配置方形圖的頁(yè)面，給人以穩(wěn)重、可信、嚴(yán)謹(jǐn)、理性、莊重和安靜等感覺(jué)，但有時(shí)也顯得平淡、呆板。 　 （2）退底圖　將圖像中的背景去掉，只留下主題形象。退底圖形自由而突出，更具有個(gè)性，因而給人印象深刻。配置退底圖的頁(yè)面，輕松、活潑，動(dòng)態(tài)十足，而且圖文結(jié)合自然，給人以親和感。但也容易造成凌亂和不整體的感覺(jué)。 　 （3）出血圖　圖像的一邊或幾個(gè)邊充滿頁(yè)面，有向外擴(kuò)張和舒展之勢(shì)。一般用于傳達(dá)抒情或運(yùn)動(dòng)信息的頁(yè)面，因不受邊框限制，感覺(jué)上與人更加接近，便于情感與動(dòng)感的發(fā)揮。 　　3.圖像的編排 　 （1）四角與中軸四點(diǎn)結(jié)構(gòu) 　　頁(yè)面的四個(gè)角與對(duì)角線、中軸四點(diǎn)及水平與垂直的中軸線，具有支配頁(yè)面結(jié)構(gòu)的作用。 　　四角是頁(yè)面邊界相交形成的四個(gè)點(diǎn)，把四角連接起來(lái)的斜線即對(duì)角線，交叉點(diǎn)為頁(yè)面中心。中軸四點(diǎn)指經(jīng)過(guò)頁(yè)面中心的垂直線和水平線的端點(diǎn)。這四個(gè)點(diǎn)可上、下、左、右移動(dòng)。 　　通過(guò)四角與中軸四點(diǎn)結(jié)構(gòu)的不同組合、變化，可以求得多樣的頁(yè)面結(jié)構(gòu)。在圖像排版時(shí)緊緊抓住這八個(gè)點(diǎn)，可以突出網(wǎng)頁(yè)的形式美感，網(wǎng)頁(yè)的版式設(shè)計(jì)、視覺(jué)流程的籌劃也得到相應(yīng)簡(jiǎn)化。 　 （2）塊狀組合與散點(diǎn)組合結(jié)構(gòu) 　　塊狀組合，即通過(guò)水平、垂直線分割，將多幅圖像在頁(yè)面上整齊有序地排列成塊狀，這種結(jié)構(gòu)具有強(qiáng)烈的整體感和秩序美感。各幅圖像相互自由疊置或分類疊置而構(gòu)成的塊狀組合，具有輕快、活潑的特性，同時(shí)也不失整體感。 　　散點(diǎn)組合，即圖像分散排列在頁(yè)面各個(gè)部位，具有自由、輕快的感覺(jué)。采用這種結(jié)構(gòu)應(yīng)注意圖像的大小、主次，以及方形圖、退底圖和出血圖的配置，同時(shí)還應(yīng)考慮疏密、均衡、視覺(jué)流程等。 　　4.圖像的處理 　　圖像的外形、大小、數(shù)量以及與背景的關(guān)系，都與內(nèi)容有著密切的聯(lián)系。 　 （1）圖像的外形處理 　　圖像的外形能使頁(yè)面的氣氛發(fā)生變化，并直接影響瀏覽者的興趣。一般而言，方形的穩(wěn)定、嚴(yán)肅，三角形的銳利，圓形或曲線外形的柔軟親切，退底圖及一些不規(guī)則或不帶邊框的圖像活潑。 　 （2）圖像的面積 　　圖像在網(wǎng)頁(yè)中占據(jù)的面積大小能直接顯示其重要程度。一般地，大圖像容易形成視覺(jué)焦點(diǎn)，感染力強(qiáng)，傳達(dá)的情感較為強(qiáng)烈；小圖像常用來(lái)穿插在字群中，顯得簡(jiǎn)潔而精致，有點(diǎn)綴和呼應(yīng)頁(yè)面主題的作用。在一個(gè)頁(yè)面中，如果只有大圖像而無(wú)小圖像或細(xì)密的文字，就會(huì)顯得空洞，但只有小圖像而無(wú)大圖像又使頁(yè)面缺乏視覺(jué)沖擊力。 　　圖像的大小不僅決定著主從關(guān)系，也控制著頁(yè)面的均衡與運(yùn)動(dòng)。大小對(duì)比強(qiáng)烈，給人跳躍感，使主角更突出；大小對(duì)比減弱，則頁(yè)面穩(wěn)定、安靜。這是因?yàn)?，訪問(wèn)者在瀏覽頁(yè)面時(shí)，首先會(huì)注意到大圖像，然后再看到較小的圖像，這種由大到小的引導(dǎo)，使瀏覽者的視線在頁(yè)面上流動(dòng)，便造成一種動(dòng)勢(shì)，使頁(yè)面活潑起來(lái)。 　　因此，在網(wǎng)頁(yè)設(shè)計(jì)時(shí)，應(yīng)首先確定主要形象與次要形象，擴(kuò)大主要圖像的面積，使次要角色縮小到從屬地位。只有大小圖像主次得當(dāng)?shù)卮┎褰M合，才能構(gòu)成最佳的頁(yè)面視覺(jué)效果。 　 （3）圖像的數(shù)量 　　圖像的數(shù)量是根據(jù)內(nèi)容決定的。只用一幅圖像，會(huì)使內(nèi)容突出、頁(yè)面安定。增加一幅圖像，頁(yè)面會(huì)因?yàn)橛辛藢?duì)比和呼應(yīng)而活躍起來(lái)。再增加一幅，則更加熱鬧、活潑。但是，限于目前網(wǎng)絡(luò)的傳輸速度，使用圖像時(shí)一定要謹(jǐn)慎，大的圖像會(huì)降低頁(yè)面顯示速度，即使是小圖像，如果運(yùn)用數(shù)量過(guò)多，同樣會(huì)使頁(yè)面下載速度變慢。隨著網(wǎng)絡(luò)環(huán)境及技術(shù)條件的改善，這種情況已經(jīng)有了很大的改觀。 　 （4）與背景的關(guān)系 　　網(wǎng)頁(yè)圖像與背景是對(duì)比和統(tǒng)一的關(guān)系。也就是說(shuō)，圖像與背景在和諧統(tǒng)一的基礎(chǔ)上，應(yīng)存在一定的對(duì)比，以使主要圖像更加突出。如精密的相機(jī)鏡頭以粗糙的巖石為背景，明亮的文字以深邃的星空為背景，或者使用沒(méi)有背景及陪襯物的退底圖像，周圍留出大面積空白，都是利用對(duì)比對(duì)主體形象起到突出作用。 　　5.圖像在長(zhǎng)頁(yè)面中的應(yīng)用 　　網(wǎng)頁(yè)一般都是縱向的(也有特意設(shè)計(jì)成橫向滾屏的)，其長(zhǎng)度從一屏到三屏不等，有時(shí)甚至更多。訪問(wèn)者在瀏覽頁(yè)面時(shí)，通過(guò)拖動(dòng)垂直滾動(dòng)條使網(wǎng)頁(yè)一屏一屏地顯示，但這并不意味著我們可以將整個(gè)頁(yè)面分割開(kāi)來(lái)，孤立地進(jìn)行每一屏的設(shè)計(jì)。頁(yè)面的整體感是建立在形象的啟承關(guān)系上，盡管頁(yè)面被分割成幾屏來(lái)顯示，但圖像或文字的延續(xù)性應(yīng)使瀏覽者得到完整、統(tǒng)一的視覺(jué)感受。設(shè)計(jì)者所要做的就是進(jìn)行通盤考慮，例如：尋找對(duì)比中的和諧、建立同一的視覺(jué)識(shí)別等，來(lái)處理好每一屏與整個(gè)頁(yè)面的關(guān)系。