網頁設計的布局和用色技巧

軒慎鴻

摘要：網頁設計就是依據網站宗旨，把造型、結構、信息、色彩等視覺元素有機地統(tǒng)一在網頁中，并對網頁風格等進行整體設計。展示網頁中色彩搭配的狀態(tài)，已經色彩搭配的來源，直接明確的闡述最本質的網頁設計中色彩運用的原理。介紹了網頁設計布局和色彩的基礎理論。從而進一步詳細的介紹了布局和色彩搭配在網頁中不可或缺的作用。

關鍵詞： 網頁設計；布局和用色；技巧

【中圖分類號】TP393.092

引言

網頁設計是一門新興的設計類和網絡交叉學科，近幾年隨著網絡的發(fā)展而逐漸受到人們的重視。網頁以網絡為載體，把各種信息以最便捷的方式傳達給受眾。利用造型的原則和規(guī)律，合理的分配和排列文字、圖形等視覺元素，以便準確、系統(tǒng)、有效地傳達信息。因此在明確了網頁藝術設計與網站主題的關系的基礎上，提出了“美”和“功能”都是為了更好地表達網站主題這一觀點。從而更好的認識和理解布局和用色技巧在網頁布局中的發(fā)展和創(chuàng)新。

1.網頁設計的布局

網頁設計者在擬定色彩計劃時，應該盡可能的滿足絕大多數人的視覺感受。它是人們在看到某一運用色彩所表現(xiàn)的客觀事物后，憑感覺事物所傳遞出來的表象信息，在頭腦思維中根據切身感受對事物進行整理加工，留下某種相關記憶與理性信息。在網頁設計時把網頁的各種構成要素（文字、圖片、菜單等等）在頁面內完美的搭配起來。一個精美的網頁，不僅體現(xiàn)在頁面內容的精彩，還要有效地利用頁面的有效顯示空間，創(chuàng)造出合理的布局模式。過純的紅色容易使人疲勞，引起人的心理反感，因此，一般只有在以節(jié)慶為主題的網頁中會大面積使用純紅色，而在其它主題的網頁中，要使用大面積的紅色就需要加入白色或暗色調。而是我們設計網頁之前根據分析調研資料，界面設計共同習慣和使用者習慣及需求，設計的邏輯關系架構圖，也就是網站的主要信息導引。一般情況下，顯示器在640*480像素的分辨率下，頁面的顯示尺寸為620*311像素：在800*600像素的分辨率下，顯示器的分辨率越高，能顯示的頁面尺寸就越大。頂端是標題及廣告橫幅，接下來的左側是一窄列鏈接等，右列是很寬的正文，底端也是一些網站的輔助信息。在這種類型中，一種很常見的類型是，頂端是標題及廣告，左側是導航鏈接。也就是讓一部分內容比其他的大或者小，以明顯的區(qū)分開來。在不能依靠顏色的時候，通過尺寸建立對比將變得非常重要。大標題也是建立視覺結構框的好方法。

2.網頁設計的色彩搭配方法

2.1明確網站的主題、服務對象及用色彩要表達的目的

色彩作為自然界的客觀存在，本身是沒有情感的，只有無數種色相、明度、純度組合在一起的不同變化效果，色彩的情感是觀察者所賦予的一種“人的心理感覺”。在了解色彩的基礎上選擇適合自己的標準色。同時，為了讓主頁更加豐富多彩、引人注目，可以在標準色的基礎上，配以不同的輔色。在標準色的基礎上搭配不同的輔色，使得網頁看起來豐富而統(tǒng)一。 給網站的網頁選一個主色調，以形成一定風格。整個網頁最好只有一個主色調。主調色彩一般可用公司的標準色，這符合公司的形象戰(zhàn)略，可以提升公司形象。

2.2確定網頁的主色調

在設計網站的時候，我們應該關注流行色的發(fā)展趨勢。每年都會有一些流行色出現(xiàn)，這是符合大眾心理的一些基本色調。在設計網站的時候可以巧妙地加以應用，網頁色彩決定訪問者的第一視覺感受。在教學中教師應要求學生根據所選主題，確立網站主體顏色和輔助顏色，利用色彩營造符合主題的環(huán)境與相應的氣氛。但是人們對同一種色彩所表現(xiàn)出來的心理感受差異有著一個廣泛的色彩共同性前提，就是可以看到某種客觀的，受到普遍認可的色彩認知概念。在一個特定的場合或者環(huán)境中，某種色彩會表達一種具有強烈象征意義的事物。色彩的搭配不僅體現(xiàn)美學的訴求，而且是一種可以強化的識別信息，會影響到瀏覽者對網站的印象乃至企業(yè)形象的認識。所以，主題色一經確定，要保持一定的穩(wěn)定性，用這種色彩來幫助瀏覽者對網站的識別。如果你沒有豐富的網頁內容，那么網頁設計中對網站的標準色的設計就顯得尤為重要了。標準色彩能夠體現(xiàn)網站形象和延伸內涵的色彩，它是影響網站整體效果的關鍵。當一種色彩成為流行色的時候，不免使瀏覽者產生麻木的審美效果。因此在網頁中事實的實施一些懷舊色彩，會達到意想不到的效果。即只用一種色相，其輔助色只是在明度和純度上作調整，間用中性色。采用單色調，易形成一種風格，在網頁的局部要采用少量小面積的對比色以達到豐富頁面的效果，

2.3網頁色彩的選擇標準

網頁設計中常見的布局方式有表格式布局，框架式布局以及DIV+CSS方式布局。DIV+CSS布局方式，是目前網頁設計中比較常見的，它實現(xiàn)了網頁結構與樣式的真正分離。隨著網民人數的不斷增加，網民的素質也越來越高，大多數的網民喜歡選擇有特色、風格獨特的網站進行瀏覽。網頁設計師在設計網頁時，可以選擇體現(xiàn)自己風格的色彩大膽應用。 背景色決定了整體印象；融合色被應用于頁面中的不同位置，通過顏色的反復共鳴讓網頁界面更具整體性；強調色是在大面積的背景顏色當中強調出某一亮點，吸引注意。它會受到很大因素的影響，如色彩的面積、時間、亮度等。 重視產品營銷過程中消費者對產品色彩方面的反饋意見和訴求，并加以改進完善。如兒童類網頁，色彩就要以輕快活潑為主，營造出富含童趣的視覺氣氛。教育類網頁則通常以中性色為主，借以體現(xiàn)出一種文化底蘊。應該更加注重整體效果。在設計網站頁面時，要更多地考慮平面設計的因素，把握整體。色彩的明暗、輕重、冷暖，以及調和色和對比色的應用等都要考慮在內。，達到理論與實踐相結合，強化學生的技能操作，鍛煉了學生的創(chuàng)新思維能力，提高了網站建設的綜合素質，為今后動態(tài)網站的建立打下良好的基礎。 在網頁設計中有時為了迎合時代潮流而使自己的設計不顯落伍，設計師要在創(chuàng)新中尋求發(fā)展，不斷設計出新的色彩搭配樣式。

3.結語

色彩既能影響人的視覺，也能影響人的心理。網頁設計人員在設計網頁時要注意合理的運用對比及調和的配色方法。所以布局和色彩的恰到好處的搭配將會使個人和企業(yè)的形象在別人心中留下深刻的印象，從而更好的體現(xiàn)出個人及其企業(yè)的知名度。富有新意的色彩創(chuàng)意能使網頁在同類中引人注目、打動人心、帶給人新鮮感，色彩是網頁設計中不可缺少的元素之一，它以最醒目、活躍的方式應用于網頁設計中。

參考文獻：

[1]劉佳，王倩.網頁設計中的色彩表現(xiàn)[J].美術大觀，2007，（11）.

[2]王娜.Dreamweaver網頁制作與色彩搭配全攻略[M].北京：清華大學出版社，2006.

[3]張淑榮；蘇兵；；探析色彩搭配在網頁設計教學中的有效運用[J]；電腦與電信；2012年08期endprint