關(guān)于網(wǎng)頁設(shè)計與制作問題的研究

摘 要：伴隨信息技術(shù)的發(fā)展，各類企業(yè)單位都推出自己的網(wǎng)站，本文針對網(wǎng)頁設(shè)計過程中如何做到不失主題又體現(xiàn)特色的問題進行研究，首先要針對企業(yè)特點明確網(wǎng)頁設(shè)計的任務(wù)，在設(shè)計過程總要遵循一定的原則的基礎(chǔ)上，闡述了網(wǎng)頁設(shè)計與制作的過程。從而做到實用性與藝術(shù)性的統(tǒng)一。

關(guān)鍵詞：網(wǎng)頁設(shè)計；色彩；網(wǎng)頁優(yōu)化

中圖分類號：TP393.092

隨著信息技術(shù)的飛速發(fā)展，網(wǎng)絡(luò)是人們獲取信息的主要手段，尤其目前的很多商業(yè)性網(wǎng)站，除了追求信息量豐富、操作便捷之外，要求網(wǎng)頁的視覺效果也要體現(xiàn)個性，突出網(wǎng)站的特色。因此，這就對網(wǎng)頁的設(shè)計與制作提出了更高的要求。

在網(wǎng)頁的設(shè)計過程中，首先要注重內(nèi)容，無論是內(nèi)容的承載信息量的廣度和深度，還是內(nèi)容的組織層次上都很重要，很多人瀏覽網(wǎng)頁的針對性很強，比如上網(wǎng)查找軟件、MP3、小說下載或一定的資訊、教材等能夠更好地滿足需求；其次是網(wǎng)站的速度。在確定內(nèi)容的基礎(chǔ)上，盡量提高速度十分必要，速度太慢，訪問者也只有失去耐心，從而影響你網(wǎng)站的訪問量；最后，是頁面視覺的美觀。要強調(diào)藝術(shù)性，注重通過獨特的藝術(shù)風(fēng)格來突出設(shè)計目的。

1 網(wǎng)頁設(shè)計的任務(wù)

1.1 資訊類網(wǎng)站，目前知名新華網(wǎng)、新浪網(wǎng)、搜狐等都屬于這類網(wǎng)站。它以提供信息的量大、及時、全面、權(quán)威等特點吸引廣大訪問者。因此在網(wǎng)頁設(shè)計過程中要做到布局合理、頁面分割有序，更要注重界面的親和力等問題。

1.2 資訊和形象兼顧的網(wǎng)站，如高等學(xué)校的網(wǎng)站，一方面宣傳辦學(xué)理念、優(yōu)勢、特色等企業(yè)形象；另一方面也會向社會發(fā)布招生、就業(yè)等資訊。再如海爾海爾、索尼等一些知名企業(yè)的網(wǎng)站。在設(shè)計上既要保證資訊類網(wǎng)站的要求，同時又要突出企業(yè)、單位的形象。甚至要突出企業(yè)的經(jīng)營理念，所以從目前狀況上來看，很多企業(yè)不惜重金，不斷更新軟硬件設(shè)施，翻新網(wǎng)絡(luò)內(nèi)容和網(wǎng)頁設(shè)計。

1.3 形象類網(wǎng)站，目前各類企業(yè)都會通過媒體宣傳自己，樹立企業(yè)的形象。所有的企業(yè)幾乎追求的都是同一個目標，就是讓自己企業(yè)的名字，產(chǎn)品以及服務(wù)都能深入人心，網(wǎng)絡(luò)的出現(xiàn)也就提供給了企業(yè)另一個宣傳的平臺，為企業(yè)樹立形象提供了一條新的路線。因此這類網(wǎng)站對設(shè)計者的美工水平要求較高。

2 網(wǎng)頁設(shè)計應(yīng)遵循的原則

在網(wǎng)頁的設(shè)計過程中，畫面中的所有元素組織要達到良好的效果，這就需要遵循以下幾項原則：

2.1 統(tǒng)一性原則。畫面中的各組成部分不能鼓勵分散，缺乏條理性，能夠放在同一界面的當中，就要保證內(nèi)容的整體性，設(shè)計風(fēng)格的一致性。

2.2 連貫性原則。頁面之間都是相互聯(lián)系的，每一條目猶如城市路標，清晰地指引瀏覽者走下目的地，這就需要將內(nèi)容恰當歸屬；表現(xiàn)形式上也要前后一致、相互呼應(yīng)，實現(xiàn)視覺上和心理上的連貫，使整個頁面設(shè)計的各個部分極為融洽，猶如一氣呵成。

2.3 分割性原則。頁面分成小塊更容易產(chǎn)生清晰的視覺效果，使觀者第一時間完整目標定位，在眾多信息中找到重點，節(jié)省大量的信息篩選時間。

2.4 對比性原則。就是通過矛盾和沖突，使設(shè)計更加富有生氣。在使用對比的時候應(yīng)慎重，對比過強容易破壞美感，影響統(tǒng)一。

2.5 和諧性原則。頁面在多個元素之間劃分，但也不失整體性，這是藝術(shù)設(shè)計中追尋美的法則。設(shè)計的作品中顏色、形狀、線條太多、太雜就會失去其靈魂所在，充滿太多隨意性的作品無法實現(xiàn)覺設(shè)計的傳達功能。和諧不僅要看結(jié)構(gòu)形式，而且要看作品所形成的視覺效果能否與人的視覺感受形成一種溝通，產(chǎn)生心靈的共鳴，這是設(shè)計能否成功的關(guān)鍵。

3 網(wǎng)頁的設(shè)計與制作過程

3.1 網(wǎng)頁設(shè)計的實現(xiàn)。網(wǎng)頁設(shè)計的實現(xiàn)過程可以分為兩個環(huán)節(jié)：首先，手工繪制階段，用紙和筆畫出站點的規(guī)劃及草圖。設(shè)計網(wǎng)頁的版面布局，我們將以合適最適合的方式將圖片和文字排放在頁面的不同位置，動畫也要設(shè)置恰當?shù)穆肪€、恰當?shù)臅r機?！爱嬛褚芍裼谛亍庇辛诉@份藍圖，我們就到了真正的藍圖實現(xiàn)階段了。第二環(huán)節(jié)在計算機上完成網(wǎng)頁的制作。這時除了要有一臺配置不錯的計算機外，軟件也是必需的。微軟的FrontPage、前Macromedia公司的DreamWeaver及網(wǎng)頁設(shè)計新貴Adobe公司的Golive。利用這些軟件工具，將藍圖中的組織形式和設(shè)計理念付諸于實踐。在設(shè)計的過程中要體現(xiàn)創(chuàng)意，融入恰當?shù)乃囆g(shù)元素規(guī)劃組織結(jié)構(gòu)，體現(xiàn)信息內(nèi)容。

3.2 色彩的運用。色彩是美麗而豐富的，它能喚起人類的心靈的共鳴，促使人們產(chǎn)生無限遐想。每種顏色都有其深刻的寓意，如紅色是熱烈、沖動、強有力的色彩，它能使肌肉的機能和血液循環(huán)加快。由于紅色容易引起注意，所以在各種媒體中也被廣泛的利用，除了具有較佳的明視效果之外，更被用來傳達有活力，積極，熱誠，溫暖，前進等涵義的企業(yè)形象與精神，另外紅色即是警告，危險，禁止，防火的指定色。因此網(wǎng)站設(shè)計過程中色彩設(shè)計是重要一環(huán)，網(wǎng)站的整體色彩搭配應(yīng)符合網(wǎng)站的主題信息特征。而網(wǎng)站的整體色彩搭配是由主色調(diào)和輔助色調(diào)兩部分。

主色調(diào)是構(gòu)成網(wǎng)站形象的一種或一組主要色彩。明確網(wǎng)站的主題、服務(wù)對象之后我們再根據(jù)每種顏色的寓意進行選擇。如綠色食品類的網(wǎng)站以綠色為主，突出希望、健康的主題。通過主色調(diào)體現(xiàn)企業(yè)形象，以此達到品牌或產(chǎn)品宣傳的目的，給消費者留下一個多種媒介的統(tǒng)一印象。如麥當勞的紅、黃，可口可樂的紅。主題色的數(shù)量不可過多，一種或兩種即可。

而輔助色調(diào)在網(wǎng)頁設(shè)計的色彩設(shè)計環(huán)節(jié)中，經(jīng)常要小面積地使用主題色以外的其它色彩，來增加頁面的色彩層次或輔助實現(xiàn)某種功能。輔助色的面積雖然小，但卻能起到緩沖和強調(diào)的作用。合理地使用輔助色，能讓主色調(diào)更加鮮明、生動，使得頁面視覺效果更加流暢、和諧。輔助色應(yīng)在主色調(diào)確定后進行選擇。要在保持主色調(diào)主導(dǎo)地位的前提下，與主色調(diào)間形成相互和諧的局面?？梢赃x用柔和的相近色，也可選用反差較大的對比色。

3.3 造型的組合。在網(wǎng)頁設(shè)計中，我們主要通過視覺傳達來表現(xiàn)主題。在視覺傳達中，造型是很重要的一個元素。拋去是圖還是文字的問題，畫面上的所有元素可以統(tǒng)一作為畫面的基本構(gòu)成要素點、線、面來進行處理。在一幅成功的作品里，是需要點、線、面的共同組合與搭配來構(gòu)造一個有機整體，引導(dǎo)受眾的視野。通常使用的組合手法有秩序、比例、均衡、對稱、連續(xù)、間隔、重疊、反復(fù)、節(jié)奏、韻律、歸納、變異、特寫、反射等等，它們都有各自的特點。突出頁面上的重要元素，突出設(shè)計的主題，增強美感。

3.4 網(wǎng)頁的優(yōu)化：（1）文字優(yōu)化。文字是網(wǎng)頁中傳達信息的基本載體，因此字體的優(yōu)化就顯得尤為重要了。通常指定字體為宋體字號大小為12px，字體顏色要與背景色相協(xié)調(diào)，在能看清楚的基礎(chǔ)上要求達到整體和諧。白色背景、黑色字體是最為常用的，防止瀏覽者產(chǎn)生眼疲勞，保證較長時間地瀏覽網(wǎng)頁。（2）圖片優(yōu)化。圖片的優(yōu)化可以在保證瀏覽質(zhì)量的前提下將其size降至最低，這樣可以成倍地提高網(wǎng)頁的下載速度。利用Photoshop6或Fireworks4可以將圖片切成小塊，分別進行優(yōu)化。輸出的格式可以為gif或jpeg，要視具體情況而定。一般我們把有較為復(fù)雜顏色變化的小塊優(yōu)化為jpeg，而把那種只有單純色塊的卡通畫式的小塊優(yōu)化為gif，這是由這兩種格式的特點決定的。（3）表格優(yōu)化。設(shè)定表格的寬度、高度、邊框、背景色、對齊方式等參數(shù)。

4 結(jié)束語

綜上所述，靈活運用網(wǎng)頁設(shè)計軟件實現(xiàn)網(wǎng)頁的設(shè)計，在不失網(wǎng)頁設(shè)計主題的前提下，摻雜巧妙的藝術(shù)手法將網(wǎng)頁的內(nèi)容以個性化的方式呈現(xiàn)出來，更好地滿足受眾的需要，并達到瞬間產(chǎn)生深刻印象的藝術(shù)效果。

參考文獻：

[1]王娟.網(wǎng)頁設(shè)計中的色彩運用[J].電影評介，2010（03）.

[2]陳心威.淺談色彩在網(wǎng)頁設(shè)計中的應(yīng)用[J].福建電腦，2009（10）.

作者簡介：李英杰（1963.11-），女，吉林遼源人，高級講師，工學(xué)學(xué)位，研究方向：計算機。

作者單位：遼源技師學(xué)院，吉林遼源 136200