門戶型網(wǎng)站的布局與色彩選擇發(fā)布者:本站 時間:2020-05-02 14:05:14
網(wǎng)頁設(shè)計的視覺效果日新月異,隨著互聯(lián)網(wǎng)技術(shù)應(yīng)用的不斷發(fā)展,視覺形式的呈現(xiàn)也更加貼切地服務(wù)于用戶的瀏覽與應(yīng)用需要。在眾多門類的網(wǎng)站中,資訊類網(wǎng)站是最普遍的網(wǎng)站類型之一,目前大部分政府、企業(yè)、綜合門戶網(wǎng)站都屬于這一類網(wǎng)站。
資訊類網(wǎng)站的視覺效果多以簡潔大方的風格呈現(xiàn)。在看似簡單實則收納了大量繁雜訊息的網(wǎng)頁版面上,科學的視覺傳達規(guī)律起到了重要的作用。就顏色而言,門戶類網(wǎng)站的用色要整體統(tǒng)一協(xié)調(diào),局部對比醒目。確定主色,主色調(diào)是頁面的主要色彩傾向。企業(yè)網(wǎng)站設(shè)計中非常重視主色調(diào)的作用,如IBM的蔚藍色、可口可樂的紅色等,這些顏色已經(jīng)成為企業(yè)的象征。
綜合門戶網(wǎng)站由于其內(nèi)容頻道廣泛的原因,它們在主色調(diào)的運用上相對靈活。而政府門戶網(wǎng)站對主色調(diào)的選擇則較為嚴謹,多以紅、藍作為其主色。設(shè)計者要根據(jù)網(wǎng)站的定位、主題、瀏覽用戶,表現(xiàn)利用色彩想要傳達的視覺效果,大膽地用色。
從方法上來說,門戶網(wǎng)站通常從網(wǎng)站內(nèi)容的主題立意角度選擇主色。如針對網(wǎng)站的布局,從圖片著手選擇主色,運用Photoshop軟件使圖片彩塊化呈現(xiàn):用吸管工具將顏色提取出來,按規(guī)律排列,得到一組可用樣色。在眾多可用色調(diào)中,選擇切合主題且視覺效果出眾的顏色作為主色。
主色調(diào)確定后,要合理運用色彩規(guī)律進行配色工作。將主色調(diào)在色相環(huán)上定位,以此尋找與主色調(diào)協(xié)調(diào)的色彩。第一,單色調(diào):主色的深、中、淺的組合被稱為單色調(diào)。單色調(diào)沒有色相上的變化,卻提供了色彩明度對比,使得版面給人以統(tǒng)一的整體印象,常用于風格穩(wěn)健的設(shè)計中。第二,類似色色調(diào):在色相環(huán)中與主色相鄰的顏色是類似色。類似色之間具有很強的潛在關(guān)聯(lián)性,這種色調(diào)既有單色調(diào)的統(tǒng)一,又具有活力和變化。類似色色調(diào)類別豐富,相對容易駕馭。第三,對比色色調(diào):將色相或色彩差異大的色調(diào)搭配在一起,利用對比呈現(xiàn)出強烈的視覺效果,稱為對比配色。它與前面兩種配色相反,會給人強烈的視覺沖擊力。對比配色在門戶類網(wǎng)頁設(shè)計中通常以強調(diào)色的身份出現(xiàn),同色系低飽和度、變化少且單調(diào)的配色中,用與主色成對比的色彩色調(diào)作為強調(diào)重點,如標題橫幅(banner)區(qū)域的文字和標志(logo)使用對比關(guān)系色彩,能讓整個網(wǎng)頁看起來更完整且色彩分明。而此時所用的重點色就成為強調(diào)色。小面積使用高明度、高飽和度的強調(diào)色是為了與主色形成對比。如果大范圍、大面積使用強烈色彩,則會打亂視覺平衡,使整體網(wǎng)頁視覺印象過于強烈。
就布局而言,門戶類網(wǎng)站的訊息繁多,各類信息的位置十分重要。布局要以美觀清晰、便于用戶瀏覽閱讀為根本。這首先就涉及視覺流程的問題。所謂視覺流程,是指網(wǎng)站界面設(shè)計對于用戶的視覺引導,用戶瀏覽網(wǎng)頁時首先會看到什么,然后會看到哪里,在哪個位置瀏覽停留時間長,哪里用時少,這些都是運用科學的視覺流程規(guī)律來引導的。有人認為網(wǎng)站的版式布局、選色配色、字體安排只關(guān)乎頁面的美觀問題,其實這些版式布局同樣對用戶的心理產(chǎn)生一定的影響。
從位置上來講,人們的視線習慣于從上至下、從左到右地瀏覽頁面內(nèi)容。所以,網(wǎng)頁的上方位置比下方重要,左側(cè)位置比右側(cè)重要。通常,中上部被稱為“優(yōu)選視域”,多用于放置重要內(nèi)容。從面積上來說,用戶在掌握整體畫面信息之后,不管是文字還是圖片,一定會先從大面積的部分看到小面積的部分。從色彩上來說,用戶視線會從濃烈的色彩開始,移動到淺淡的色彩,容易從色調(diào)高的部分移向色調(diào)低的部分。此外,在色彩統(tǒng)一的版面中加入性質(zhì)不同的色彩后,人們也會自然地將視線移到不同的色彩上。
以上引導視線的方法在傳達視覺印象或呈現(xiàn)視覺感受時,都能在網(wǎng)站的版面設(shè)計中反映出先后順序。以政府門戶類網(wǎng)站為例,在首頁設(shè)計中,一些重要信息多以大圖的動態(tài)形式出現(xiàn)在左側(cè),右側(cè)為推薦文字信息。實時突出的重大新聞用大字置頂。首頁的下半部分(頂部導航欄以下)放置更新速度相對較慢的常規(guī)信息,這樣整個版面的層次就拉開了,讓瀏覽用戶第一眼就能找到主次關(guān)系。
綜合門戶類網(wǎng)站的布局相對更靈活,因為其頻道范圍廣,其導航欄占據(jù)更大的空間,位置的擴張本身就加強了其功能性,在視覺順序上也提前了,讓瀏覽者一目了然,直奔主題。標題和站內(nèi)搜索引擎雖然置頂,但由于面積和導航欄對比懸殊,在視覺順序上相對要弱些,想看的時候才能看見它--這正是設(shè)計者、瀏覽用戶所需要的。此類門戶網(wǎng)站多在導航欄下方配圖,以廣告居多,可靈活運用位置空間。
網(wǎng)頁設(shè)計中的文字也是影響布局的重要因素。字體、字形大小的選擇要觀察可用區(qū)域面積的比例,如配圖及圖案中肌理的走勢。首頁整體格調(diào)也是選用文字的重要參考因素,文字要與之相呼應(yīng)。如時尚的氣氛配時尚的字體,樸素的氣氛配平靜的字體等。
門戶類網(wǎng)站信息量龐大,只有科學地運用色彩與布局等視覺傳達規(guī)律,合理地配色、排版,才會使頁面呈現(xiàn)出條理清晰、主次分明、簡潔大方的視覺效果,從而方便瀏覽者使用。
選擇我們,優(yōu)質(zhì)服務(wù),不容錯過
1. 優(yōu)秀的網(wǎng)絡(luò)資源,強大的網(wǎng)站優(yōu)化技術(shù),穩(wěn)定的網(wǎng)站和速度保證
2. 15年上海網(wǎng)站建設(shè)經(jīng)驗,優(yōu)秀的技術(shù)和設(shè)計水平,更放心
3. 全程省心服務(wù),不必擔心自己不懂網(wǎng)絡(luò),更省心。
------------------------------------------------------------
24小時聯(lián)系電話:021-58370032