網(wǎng)站界面設(shè)計應(yīng)該注意的地方!

2015-03-16    分類: 網(wǎng)站建設(shè)


網(wǎng)站用戶界面(Website UserInterface)指網(wǎng)站用于和用戶交互的外觀、元素和程序等等。如果你經(jīng)常上網(wǎng),就會看到很多網(wǎng)站設(shè)計很樸素,看起來給人非常舒服的感覺;有的網(wǎng)站很有創(chuàng)意,常常給人帶來意外的驚喜和視覺的沖擊;但相當多的網(wǎng)站頁面上充斥著怪異的字體,花哨的色彩和圖片,給人網(wǎng)頁制作粗劣的感覺。網(wǎng)站界面設(shè)計,既要從外觀上進行創(chuàng)意以到達吸引眼球的目的,還要結(jié)合圖形和版面設(shè)計的相關(guān)原理,從而使得網(wǎng)站界面設(shè)計變成了一門獨特的藝術(shù)。通常,企業(yè)網(wǎng)站用戶界面的設(shè)計一般應(yīng)遵循以下幾個基本原則:

網(wǎng)站界面設(shè)計應(yīng)該注意的地方!

一.用戶導(dǎo)向原則(User oriented)

設(shè)計網(wǎng)頁首先要明確到底誰是這個網(wǎng)頁的使用者,要站在用戶的觀點和立場上來考慮和設(shè)計網(wǎng)站。要做到這一點,就必須要和用戶來溝通,了解他們的需求、目標、期望以及偏好等。網(wǎng)頁的設(shè)計者要清楚,用戶之間的差別是很大的,他們的能力也各有不同。比如有的用戶可能會在視覺方面有所欠缺(如色盲),對很多的顏色分辨不清;有的用戶的聽覺也可能會有些障礙,對于網(wǎng)站的語音提示反應(yīng)比較遲鈍;而且相當一部分用戶的計算機使用經(jīng)驗還很初級,對于復(fù)雜一點的操作就會感覺到很費力。另外,用戶使用的計算機機器配置是千差萬別的,如顯卡、聲卡、內(nèi)存、網(wǎng)速、操作系統(tǒng)以及瀏覽器等都會有所不同。設(shè)計者如果忽視了這些差別,設(shè)計出的網(wǎng)頁在不同的機器上顯示就會造成錯亂。

二.簡潔和易于操作原則(Keep It Simple And Stupid - KISS)

KISS原則就是"Keep It Sample AndStupid"的縮寫,簡潔和易于操作是網(wǎng)頁設(shè)計的最重要的原則。畢竟,網(wǎng)站建設(shè)出來是用于普通網(wǎng)民來查閱信息和使用網(wǎng)絡(luò)服務(wù)。沒必要在網(wǎng)頁上設(shè)置過多的操作,堆積很多復(fù)雜和花哨的圖片。此原則的一般要求:

1、網(wǎng)頁的下載不要超過6秒鐘(普通的家庭寬帶為2M的,速度一般在220kb/s);

2、網(wǎng)頁盡量使用文本鏈接,而減少大幅圖片和動畫的使用,從而加快網(wǎng)頁的打開時間;

3、操作設(shè)計盡量簡單,并且有明確的操作提示;

4、網(wǎng)站所有的內(nèi)容和服務(wù)都盡量在顯眼處向用戶予以說明等。

三.布局控制(Layout)

在網(wǎng)頁排版布局方面,很多網(wǎng)頁設(shè)計者還不夠重視,網(wǎng)頁界面設(shè)計排版過于死板,甚至照抄他人。如果網(wǎng)頁的布局凌亂,僅把大量的信息堆集在頁面上,就會干擾瀏覽者的閱讀。一般在網(wǎng)頁界面的版式設(shè)計上所要遵循的原則有:

1、7±2的Miller公式。

根據(jù)心理學(xué)家George A.Miller的研究表明,人一次性接受的信息量在7個比特左右為宜??偨Y(jié)一個公式為:一個人一次所接受的信息量為 7±2比特。這一原理被廣泛應(yīng)用于網(wǎng)站建設(shè)中,一般網(wǎng)頁上面的欄目選擇好在5~9個之間,如果網(wǎng)站所提供給瀏覽者選擇的內(nèi)容鏈接超過這個區(qū)間,人在心理上就會煩躁,壓抑,會讓人感覺到信息太密集,看不過來,很累。然而很多國內(nèi)的網(wǎng)站在欄目的設(shè)置遠遠超出這個區(qū)間。

2、分組處理。

上面提到,對于信息或欄目的分類,不能超過9個。但如果你的內(nèi)容實在是太多,超出9個,就需要進行分組處理。如果,你的網(wǎng)頁上有幾十篇文章的鏈接,需要每隔7篇加一個空行或平行線做以分組。如果你的網(wǎng)站內(nèi)容欄目超出9個,如騰訊公司的網(wǎng)站或其它幾個比較知名的門戶,有很多個欄目,超過了9個。為了不破壞7±2的Miller公式,在設(shè)計時把比較有代表性的分類加粗,然后再按性質(zhì)分組。

四.視覺平衡(Visual balance)

網(wǎng)頁設(shè)計時,各種元素(如圖形、文字、空白)都要有視覺平衡作用。根據(jù)視覺原理,圖形與一塊文字相比較,圖形的視覺作用要大一些。所以,為了達到視覺平衡,設(shè)計網(wǎng)頁時需要以更多的文字來平衡一張圖片。另外,按照中國人的閱讀習(xí)慣是從左到右,從上到下,因此視覺平衡也要遵循這個這個原則。例如,你的很多的文字是采用左對齊,需要在網(wǎng)頁的右面加一些圖片或一些較明亮、較醒目的顏色。通常情況下,每張網(wǎng)頁都會設(shè)置一個頁眉部分和一個頁腳部分,頁眉部分通常放置一些Banner廣告或?qū)Ш綏l及網(wǎng)站LOGO,而頁腳部分通常放置聯(lián)系方式和版權(quán)信息等,頁眉和頁腳在設(shè)計上也要注重視覺平衡。同時,也決不能低估空白的價值;網(wǎng)頁上所顯示的信息非常密集,這樣不但不利于讀者閱讀,甚至?xí)鹱x者反感,破壞該網(wǎng)站的形象。在網(wǎng)頁設(shè)計上,適當?shù)牡胤皆黾右恍┝舭?,精煉和升華你的網(wǎng)頁的形象及美感,使得頁面變得簡潔。

五.色彩的搭配及文字的可閱讀性(Colors and text can be read)

顏色是影響網(wǎng)頁的重要因素之一,不同的顏色對人的感覺有不同的影響,比如:紅色和橙色使人興奮并使得心跳加速;黃色使人聯(lián)想到陽光,是一種快活的顏色;黑色顯得比較莊重,考慮到你希望對瀏覽者產(chǎn)生什么影響,為網(wǎng)頁設(shè)計選擇最恰當?shù)念伾òū尘吧?、元素顏色、文字顏色、鏈?jié)顏色等)。

為了方便閱讀網(wǎng)站上的信息資訊,可以借鑒參考報紙及雜志的編排方式將網(wǎng)頁的內(nèi)容分欄設(shè)計,甚至兩欄也要比一滿頁的視覺效果要好。另外一種能夠提高文字可讀性的因素是字體的選擇,通用的字體(Arial,CourierNew,Garamond,Times NewRoman,中文宋體)最易閱讀,特殊字體用于標題效果較好,但是不適合正文。如果在整個頁面使用一些特殊字體(如Cloister,Gothic,Script,Westminster,華文彩云,華文行楷),這樣讀者閱讀起來感覺一定很糟糕。這類特殊字體如果在頁面上大量使用,會使得閱讀頗為費力,瀏覽者的眼睛很快就會疲勞,不得不轉(zhuǎn)移到其他頁面。

六.和諧與一致性(Harmony and consistency)

通過對網(wǎng)站的各種元素(顏色、字體、圖形、空白等)使用一定的規(guī)格,使得設(shè)計良好的網(wǎng)頁看起來應(yīng)該是和諧的。或者說,網(wǎng)站的眾多獨立網(wǎng)頁看起來更像一個整體。網(wǎng)站界面設(shè)計上要保持一致性,這是很重要的一點。一致的網(wǎng)站結(jié)構(gòu)設(shè)計,可以讓瀏覽者對網(wǎng)站的形象有深刻的記憶與印象;一致的導(dǎo)航設(shè)計,可以讓瀏覽者迅速而又有效的進入在網(wǎng)站中自己所需要的部分;一致的操作設(shè)計,可以讓瀏覽者快速學(xué)會在整個網(wǎng)站的各種功能操作。如果破壞這一原則,就會誤導(dǎo)瀏覽者,并且讓整個網(wǎng)站顯得雜亂無章,給人留下不良的印象。

當然,網(wǎng)站設(shè)計的一致性并不意味著刻板和一成不變,有的網(wǎng)站在不同欄目使用不同的風格,或者隨著時間的推移不斷的改版網(wǎng)站,會給瀏覽者帶來新鮮的感覺。

七.個性化(Individualization)

1、符合網(wǎng)絡(luò)文化

企業(yè)網(wǎng)站不同于傳統(tǒng)的企業(yè)商務(wù)活動,要符合Internet網(wǎng)絡(luò)文化的要求。首先,網(wǎng)絡(luò)最早為非正式性、非商業(yè)化的,只是科研人員用來交流信息的。其次,網(wǎng)絡(luò)信息是只在計算機屏幕上顯示而沒有打印出來閱讀,網(wǎng)絡(luò)上的交流具備隱蔽性,誰都不知道對方的真實身份和信息。此外,許多人在上網(wǎng)的時候是在家中或網(wǎng)吧等一些比較休閑,比較隨意的環(huán)境下。此時訪客的使用環(huán)境所蘊涵的思維模式與坐在辦公室里西裝革履的時候是截然不同的。因此,整個互聯(lián)網(wǎng)的文化是一種休閑的、非正式性的、輕松活潑的文化。在網(wǎng)站上使用幽默的網(wǎng)絡(luò)語言,創(chuàng)造一種休閑的、輕松愉快、非正式的氛圍就會使網(wǎng)站的訪問量大增。


文章題目:網(wǎng)站界面設(shè)計應(yīng)該注意的地方!
網(wǎng)頁地址:http://www.muchs.cn/news47/29847.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供營銷型網(wǎng)站建設(shè)、定制開發(fā)、標簽優(yōu)化、網(wǎng)站改版、網(wǎng)站設(shè)計服務(wù)器托管

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

微信小程序開發(fā)