網(wǎng)站的可用性界面設(shè)計(jì)初探

[摘要] 網(wǎng)站的界面設(shè)計(jì)是伴隨著計(jì)算機(jī)互聯(lián)網(wǎng)絡(luò)的產(chǎn)生而形成的視聽(tīng)設(shè)計(jì)的新課題，本文詳盡介紹了網(wǎng)站可用性設(shè)計(jì)的內(nèi)涵及網(wǎng)站界面設(shè)計(jì)的相關(guān)元素，并從用戶的角度來(lái)探討網(wǎng)站可用性界面設(shè)計(jì)的原則和未來(lái)的發(fā)展趨勢(shì)。

[關(guān)鍵詞] 網(wǎng)站 可用性 界面設(shè)計(jì)

隨著時(shí)代的發(fā)展，網(wǎng)站的建設(shè)越來(lái)越接近于一門藝術(shù)而不僅僅是一項(xiàng)技術(shù)，網(wǎng)站的界面設(shè)計(jì)是藝術(shù)與技術(shù)的高度統(tǒng)一，是伴隨著計(jì)算機(jī)互聯(lián)網(wǎng)絡(luò)的產(chǎn)生而形成的視聽(tīng)設(shè)計(jì)的新課題。同時(shí)，網(wǎng)站的界面設(shè)計(jì)需強(qiáng)調(diào)交互過(guò)程，即一方面是網(wǎng)站的信息傳達(dá)，另一方面是用戶（人）的接受與反饋，對(duì)網(wǎng)站的信息都能動(dòng)地認(rèn)識(shí)與把握。即網(wǎng)站的可用性界面設(shè)計(jì)是一個(gè)人性化的課題。

一個(gè)好的網(wǎng)站應(yīng)該有：非常好看的設(shè)計(jì)、友好的界面、毫無(wú)缺點(diǎn)的結(jié)構(gòu)、智能化的后臺(tái)處理、非常優(yōu)秀的內(nèi)容以及優(yōu)良快捷的交互性。即網(wǎng)站的建設(shè)具有交互性與持續(xù)性、藝術(shù)與技術(shù)結(jié)合的緊密性等特點(diǎn)。網(wǎng)站的可用性界面設(shè)計(jì)在e時(shí)代十分重要。

一、可用性的內(nèi)涵

可用性是一個(gè)多因素概念，涉及到容易學(xué)習(xí)、容易使用、系統(tǒng)的有效性、用戶滿意，以及把這些因素與實(shí)際使用環(huán)境聯(lián)系在一起針對(duì)特定目標(biāo)的評(píng)價(jià)。如Shakel（1991）對(duì)可用性的定義：可用性是指技術(shù)的“能力（按照人的功能特性），它很容易有效地被特定范圍的用戶使用，經(jīng)過(guò)特定培訓(xùn)和用戶支持，在特定的環(huán)境情景中，去完成特定范圍的任務(wù)。”即可用性不僅是涉及到界面的設(shè)計(jì)，也涉及到整個(gè)系統(tǒng)的技術(shù)水平。同時(shí)可用性是通過(guò)人因素反映的，通過(guò)用戶操作各種任務(wù)去評(píng)價(jià)的。另外環(huán)境因素必須被考慮在內(nèi)，在各個(gè)不同領(lǐng)域，評(píng)價(jià)的參數(shù)和指標(biāo)是不同的，不存在一個(gè)普遍適用的評(píng)價(jià)標(biāo)準(zhǔn)。我們應(yīng)多從用戶操作心理角度分析可用性的含義。再有要考慮非正常操作情況。例如用戶疲勞、注意力比較分散、緊急任務(wù)、多任務(wù)等具體情況下的操作。一般說(shuō)，可用性被表達(dá)為“對(duì)用戶友好”，“直觀”，“容易使用”，“不需要長(zhǎng)期培訓(xùn)”，“不費(fèi)腦子”等。

從心理學(xué)的角度看，可用性的基本含義是：

1.網(wǎng)站的設(shè)計(jì)能夠使用戶把知覺(jué)和思維集中在自己的任務(wù)上，可以按照自己的行動(dòng)過(guò)程進(jìn)行操作，不必分心在尋找人機(jī)界面的菜單或理解網(wǎng)站結(jié)構(gòu)、人機(jī)界面的結(jié)構(gòu)與圖標(biāo)含義，不必分心考慮如何把自己的任務(wù)轉(zhuǎn)換成計(jì)算機(jī)的輸入方式和輸入過(guò)程；

2.用戶不必記憶面向計(jì)算機(jī)硬件軟件的知識(shí)；

3.用戶不必為手的操作分心，操作動(dòng)作簡(jiǎn)單重復(fù)；

4.在非正常環(huán)境和情景時(shí)，用戶仍然能夠正常進(jìn)行操作；

5.用戶理解和操作出錯(cuò)較少；

6.用戶學(xué)習(xí)操作的時(shí)間較短。

其中：

有效性 ——指用戶完成特定任務(wù)和達(dá)到特定目標(biāo)時(shí)所具有的正確和完整程度；

效率 ——指用戶完成任務(wù)的正確和完整程度與所使用資源（如時(shí)間）之間的比率；

滿意度 ——指用戶在使用操作過(guò)程中所感受到的主觀滿意和接受程度。

二、網(wǎng)站的界面設(shè)計(jì)

界面的說(shuō)法以往常見(jiàn)于人機(jī)工程學(xué)中。“人機(jī)界面”是指人機(jī)間相互施加影響的區(qū)域，凡參與人機(jī)信息交流的一切領(lǐng)域都屬于人機(jī)界面。 從心理學(xué)意義來(lái)分，界面可分為感覺(jué)（視覺(jué)、觸覺(jué)、聽(tīng)覺(jué)等）和情感兩個(gè)層次。網(wǎng)站界面設(shè)計(jì)的三大原則是：置界面于用戶的控制之下；減少用戶的記憶負(fù)擔(dān)；保持界面的一致性。

通常一個(gè)網(wǎng)站界面的元素包括界面主顏色、字體顏色、字體大小、界面布局、界面交互方式、界面功能分布、界面輸入輸出模式。其中，對(duì)用戶工作效率有顯著影響的元素包括：輸入輸出方式、交互方式、功能分布，在使用命令式交互方式的系統(tǒng)中，命令名稱、參數(shù)也是界面元素的內(nèi)容，如何設(shè)計(jì)命令及參數(shù)也很重要。影響用戶對(duì)系統(tǒng)友好性評(píng)價(jià)的元素則有：顏色、字體大小、界面布局等，這種劃分不是絕對(duì)的，網(wǎng)站界面作為一個(gè)整體，其中任何一個(gè)元素不符合用戶習(xí)慣、不滿足用戶要求都將降低用戶對(duì)網(wǎng)站的認(rèn)可度，甚至影響用戶的工作效率，而使用戶最終放棄登陸使用該網(wǎng)站。圍繞界面元素所要達(dá)到的設(shè)計(jì)目的是讓最終用戶能夠獲得美感、提高工作效率、易于操作使用系統(tǒng)。

界面設(shè)計(jì)在工作流程上分為結(jié)構(gòu)設(shè)計(jì)、交互設(shè)計(jì)、視覺(jué)設(shè)計(jì)三個(gè)部分。結(jié)構(gòu)設(shè)計(jì)Structure Design是界面設(shè)計(jì)的骨架；交互設(shè)計(jì) Interactive Design的目的是使網(wǎng)站讓用戶能簡(jiǎn)單使用，如操作錯(cuò)誤時(shí)，系統(tǒng)提供針對(duì)性的提示；同一種功能可以用鼠標(biāo)，也可用鍵盤操作；具有導(dǎo)航功能，用戶能知道自己當(dāng)前的位置，使其做出下一步行動(dòng)的決定等；視覺(jué)設(shè)計(jì)Visual Design是要達(dá)到用戶愉悅使用的目的，包括色彩、字體、頁(yè)面等。如提供默認(rèn)（default）、撤銷（undo）恢復(fù)（redo）的功能；盡量使用真實(shí)世界的比喻，如：電話、打印機(jī)的圖標(biāo)設(shè)計(jì)；依賴認(rèn)知而非記憶，如打印圖標(biāo)的記憶、下拉菜單列表中的選擇；網(wǎng)站上所有的圖像、文字，包括背景顏色、區(qū)分線、字體、標(biāo)題、注腳等，都統(tǒng)一風(fēng)格，貫穿全站；在網(wǎng)站設(shè)計(jì)的配色中，盡量控制在三種色彩以內(nèi)，以避免花、亂、沒(méi)有主色的顯現(xiàn)。背景和前文的對(duì)比盡量大，突出主要文字內(nèi)容，使用戶在瀏覽信息的時(shí)候不會(huì)覺(jué)得累；同樣功能用同樣的圖形等。

三、網(wǎng)站的可用性界面設(shè)計(jì)原則

1.網(wǎng)站的設(shè)計(jì)形式與網(wǎng)站的內(nèi)容要統(tǒng)一。什么樣的網(wǎng)站，應(yīng)該有什么樣的設(shè)計(jì)，設(shè)計(jì)是為網(wǎng)站的主題服務(wù)的。設(shè)計(jì)的內(nèi)容就是指它的主題、形象、題材等要素的總和，形式就是它的結(jié)構(gòu)、風(fēng)格或設(shè)計(jì)語(yǔ)言等表現(xiàn)方式。內(nèi)容決定形式，形式反作用于內(nèi)容。網(wǎng)站設(shè)計(jì)所追求的形式美，必須適合網(wǎng)站主題的需要，這是基本的前提。例如，百度作為一個(gè)搜索引擎，首先要實(shí)現(xiàn)“搜索”的“功能”。它的主題即是它的“功能”。而一個(gè)個(gè)人網(wǎng)站，可以只體現(xiàn)作者的設(shè)計(jì)思想，或者僅僅以設(shè)計(jì)出“美”的“個(gè)性化”網(wǎng)頁(yè)為目的，它的主題就是——“美與個(gè)性”。 深入領(lǐng)會(huì)網(wǎng)站主題的精髓，再融合自己的思想感情，找到一個(gè)完美的表現(xiàn)形式，才能體現(xiàn)出網(wǎng)站設(shè)計(jì)獨(dú)具的分量和特有的價(jià)值。只有通過(guò)認(rèn)真設(shè)計(jì)和充分的考慮來(lái)實(shí)現(xiàn)全面的功能并體現(xiàn)美感才能實(shí)現(xiàn)網(wǎng)站設(shè)計(jì)形式與網(wǎng)站內(nèi)容的統(tǒng)一。

2.交互性和可持續(xù)性的體現(xiàn)。網(wǎng)站它不是一個(gè)被動(dòng)的媒體。網(wǎng)站具備大多數(shù)媒體所不具備的特殊性：用戶的選擇和主動(dòng)性。訪問(wèn)網(wǎng)站和看電視的最大區(qū)別是訪問(wèn)網(wǎng)站需要根據(jù)用戶的主動(dòng)選擇， 瀏覽網(wǎng)站的內(nèi)容根據(jù)用戶的個(gè)人喜好，在眾多的連接和下拉菜單中選擇用戶自己喜歡或者關(guān)心的內(nèi)容或者連接到另外一個(gè)站點(diǎn)。因此，現(xiàn)在很多的網(wǎng)站有著非常漂亮的圖形界面，豐富的媒體格式和在線游戲等。同時(shí)網(wǎng)頁(yè)設(shè)計(jì)人員必須根據(jù)網(wǎng)站各個(gè)階段的經(jīng)營(yíng)目標(biāo)，配合網(wǎng)站不同時(shí)期的經(jīng)營(yíng)策略，以及用戶的反饋信息，經(jīng)常地對(duì)網(wǎng)頁(yè)進(jìn)行調(diào)整和修改。例如，為了保持瀏覽者對(duì)網(wǎng)站的新鮮感，很多大型網(wǎng)站總是定期或不定期的進(jìn)行改版，這就需要設(shè)計(jì)者在保持網(wǎng)站視覺(jué)形象一貫性的基礎(chǔ)上，不斷創(chuàng)作出新的網(wǎng)頁(yè)設(shè)計(jì)作品。

另外，構(gòu)建合理的網(wǎng)站組織結(jié)構(gòu)，讓瀏覽者對(duì)網(wǎng)站提供的巨量信息感到條理，建立完善的包括站點(diǎn)索引、幫助頁(yè)面、查詢功能在內(nèi)的導(dǎo)航系統(tǒng)等。由于超級(jí)鏈接的出現(xiàn)，網(wǎng)站的組織結(jié)構(gòu)更加豐富，瀏覽者可以在各種主題之間自由跳轉(zhuǎn)，從而打破了以前人們接收信息的線性方式。例如，可將網(wǎng)站頁(yè)面的組織結(jié)構(gòu)分為序列結(jié)構(gòu)、層次結(jié)構(gòu)、網(wǎng)狀結(jié)構(gòu)、復(fù)合結(jié)構(gòu)等。但網(wǎng)站頁(yè)面之間的關(guān)系過(guò)于復(fù)雜，不僅使瀏覽者檢索和查找信息增加了難度，也給設(shè)計(jì)者帶來(lái)了更大的困難。為了讓瀏覽者在網(wǎng)站上迅速找到所需的信息，設(shè)計(jì)者必須考慮快捷而完善的導(dǎo)航設(shè)計(jì)。 網(wǎng)站導(dǎo)航要清晰， “您所在位置”在大型網(wǎng)站中是不可缺少的一部分，其作用表明您現(xiàn)在所處在的位置，使用戶不會(huì)不知東西南北迷失在網(wǎng)站中。其次還有讀者進(jìn)入目的頁(yè)的點(diǎn)擊次數(shù)，不能超過(guò)三次。在大型的行業(yè)網(wǎng)站里面主導(dǎo)航條最好是用文字形式，避免使用圖片或Flash做導(dǎo)航條等。

四、網(wǎng)站的可用性界面設(shè)計(jì)的發(fā)展趨勢(shì)

網(wǎng)站的可用性界面設(shè)計(jì)的目的是使網(wǎng)站讓用戶能簡(jiǎn)單的、愉快的、方便的使用。網(wǎng)站是傳播信息的載體，它要表達(dá)的是一定的內(nèi)容、主題和意念，在適當(dāng)?shù)臅r(shí)間和空間環(huán)境里為人們所理解和接受，它以滿足人們的實(shí)用和需求為目標(biāo)。要使網(wǎng)站從形式上獲得良好的誘導(dǎo)力，鮮明地突出訴求主題，具體可以通過(guò)對(duì)網(wǎng)站的空間層次、主從關(guān)系、視覺(jué)秩序及彼此間的邏輯性的把握運(yùn)用來(lái)達(dá)到。

另外，多種媒體技術(shù)的綜合運(yùn)用是提高網(wǎng)站藝術(shù)性的方法之一，是未來(lái)的發(fā)展方向。 網(wǎng)站中使用的多媒體視聽(tīng)元素主要有文字、圖像、聲音、視頻等，目前國(guó)內(nèi)有些網(wǎng)站已經(jīng)出現(xiàn)了模擬三維的操作界面，在數(shù)據(jù)壓縮技術(shù)的改進(jìn)和流（Stream）技術(shù)的推動(dòng)下，Internet網(wǎng)上也已出現(xiàn)了實(shí)時(shí)的音頻和視頻服務(wù)，典型的有在線音樂(lè)、在線廣播、網(wǎng)上電影、網(wǎng)上直播等。

再有，網(wǎng)絡(luò)技術(shù)與藝術(shù)創(chuàng)意的緊密結(jié)合是開(kāi)創(chuàng)網(wǎng)站優(yōu)良的可用性界面設(shè)計(jì)的必經(jīng)之路！它使網(wǎng)站的藝術(shù)設(shè)計(jì)由平面設(shè)計(jì)擴(kuò)展到立體設(shè)計(jì)，由純粹的視覺(jué)藝術(shù)擴(kuò)展到空間聽(tīng)覺(jué)藝術(shù)，接近電影或電視的觀賞效果。技術(shù)發(fā)展促進(jìn)了技術(shù)與藝術(shù)的緊密結(jié)合，把瀏覽者帶入一個(gè)真正現(xiàn)實(shí)中的虛擬世界。網(wǎng)站設(shè)計(jì)者應(yīng)該積極主動(dòng)地掌握現(xiàn)有的各種網(wǎng)絡(luò)技術(shù)規(guī)律，注重技術(shù)和藝術(shù)緊密結(jié)合，全面使用大腦，設(shè)計(jì)得到一個(gè)更具可用性的站點(diǎn)，滿足瀏覽者對(duì)網(wǎng)站信息的高質(zhì)量需求。

參考文獻(xiàn):

[1]UI界面設(shè)計(jì)的需求分析方法 http://:www.51UI.CN

[2]馬月:網(wǎng)站界面設(shè)計(jì).北京理工大學(xué)出版社，2006年8月

[3]關(guān)于網(wǎng)站結(jié)構(gòu)和交互性的探討.http://www.jtr.cn