眾所周知,可用性是網(wǎng)站設(shè)計(jì)中至關(guān)重要的一個(gè)因素,不管你是在設(shè)計(jì)作品集網(wǎng)站、網(wǎng)店還是網(wǎng)站應(yīng)用,最關(guān)鍵的一-點(diǎn)就是要讓網(wǎng)頁(yè)使用起來(lái)簡(jiǎn)單舒服。近幾年來(lái),針對(duì)網(wǎng)站和用戶界面設(shè)計(jì)的各方面因素的研究有許多,研究結(jié)果對(duì)改善我們的工作很有幫助。本文收集了10項(xiàng)有用的可用性結(jié)論以及一些指南,可以在網(wǎng)站用戶體驗(yàn)設(shè)計(jì)方面助你一臂之力。
-
Form (表單)標(biāo)簽最好是在字段之上
UX Matters的一份研究顯示,表單中標(biāo)簽的最理想位置應(yīng)該是在輸入框.上方。許多表單中,標(biāo)簽一般都位于輸入框左側(cè),形成一個(gè)兩欄的布局。雖然這看起來(lái)還行,實(shí)際使用起來(lái)卻不是最方便的。為什么會(huì)這樣呢?通常情況下,表單是垂直導(dǎo)向的,也就是說(shuō),用戶從上到下填寫表單,一邊填寫、一邊掃視表單,因此將標(biāo)簽放在輸入框上方要比放在左側(cè)更方便瀏覽。
-
用戶注意力集中在面部
一旦有人進(jìn)入視線范圍,人們就會(huì)本能地注意到。在網(wǎng)頁(yè)上,我們會(huì)比較關(guān)注人的面部與眼睛,這便為市場(chǎng)營(yíng)銷人員吸引訪客注意力提供了一個(gè)好方法。但我們對(duì)人們面部與眼睛的關(guān)注還只是開始,事實(shí)證明,我們會(huì)看向圖像中人物眼睛所看的方向。
-
設(shè)計(jì)質(zhì)量是可信度的標(biāo)桿
為找出哪些因素會(huì)影響人們對(duì)網(wǎng)站可信度的看法,大家做了很多研究。
●Stanford-Makovsy網(wǎng)站可信度研究,2002:當(dāng)前影響網(wǎng)站可信度因素的調(diào)查。
●影響網(wǎng)站可信度的因素是什么?大量定量研究報(bào)告。
●計(jì)算機(jī)可信度因素。
●影響網(wǎng)站可信度的因素:自主研究報(bào)告前期結(jié)果。
-
大多數(shù)用戶不喜歡滾屏
Jakob Nielsen關(guān) 于用戶怎樣滾屏閱讀的研究表明,只有23%的訪客初次訪問(wèn)頁(yè)面時(shí)會(huì)拉動(dòng)滾動(dòng)條,這意味著77%的訪客是不會(huì)滾屏閱讀的,他們只會(huì)看看折疊線以上的內(nèi)容(也就是網(wǎng)頁(yè)上他們只會(huì)看看折疊線以上的內(nèi)容(也就是網(wǎng)頁(yè)上外,之后再訪問(wèn)頁(yè)面時(shí),拉滾動(dòng)條的用戶就更少了,只有16%的訪客在他們第二次訪問(wèn)時(shí)向下滾動(dòng)屏幕。從這組數(shù)據(jù)就能明顯看出,把重要內(nèi)容放在突出位置有多么重要,尤其是在登錄頁(yè)面。這并不意味著你要把所有內(nèi)容都放在網(wǎng)頁(yè)的上半部分,只是你得好好對(duì)其加以利用。全部填塞進(jìn)去,只會(huì)降低這些內(nèi)容的可讀性-當(dāng)用戶看到太多信息,他們會(huì)不知道該從哪里開始。
-
藍(lán)色是最佳鏈接色
雖然讓自己的網(wǎng)站具有獨(dú)特的設(shè)計(jì)很不錯(cuò)的,但提到可用性,有時(shí)候和別人保持一致才是王道。遵循常規(guī),因?yàn)槿藗優(yōu)g覽一個(gè)新網(wǎng)站時(shí),常常會(huì)根據(jù)他們?cè)趧e的網(wǎng)站尋找信息的經(jīng)驗(yàn)來(lái)判斷信息在這個(gè)網(wǎng)站的位置,也就是用他們的經(jīng)驗(yàn)來(lái)理解這個(gè)新內(nèi)容一這就是所謂的使用習(xí)慣。人們希望有些東西能夠保持一致,比如鏈接的顏色、網(wǎng)站L ogo的位置以及選項(xiàng)卡式的導(dǎo)航欄等。
Google所有網(wǎng)頁(yè)上的鏈接都是藍(lán)色,這是有理可循的:藍(lán)色是多數(shù)用戶的熟悉鏈接色,找起來(lái)很容易。你的網(wǎng)站鏈接應(yīng)該是什么顏色呢?首先要注意的就是對(duì)比:鏈接顏色必須足夠深(或淺) 從而與背景色形成鮮明對(duì)比。其次,它們應(yīng)該從其他文本中突顯出來(lái)。因此,如果文字顏色是黑色,那鏈接就不能也是黑色。最后,研究顯示(Van Schaik和Ling),如果你覺(jué)得可用性是第一-位的,那么將鏈接設(shè)置成藍(lán)色便是不二之選。瀏覽器默認(rèn)的鏈接顏色是藍(lán)色,因此人們會(huì)比較期待是這樣。選用另-種顏色也沒(méi)有多大問(wèn)題,但它可能會(huì)拖慢用戶找到它的速度。
-
搜索框的理想寬度為27個(gè)字符
搜索框的理想寬度是多少?這個(gè)概念存在么? Jakob Nielsen就人們?cè)诰W(wǎng)頁(yè)搜索框中輸入的檢索詞條的長(zhǎng)度做了相關(guān)可用性調(diào)查研究,結(jié)果顯示,當(dāng)前大多數(shù)搜索框都太短了。搜索框太短的問(wèn)題在于,盡管你可以輸入一個(gè)很長(zhǎng)的詞條,但只有其中一部分是可見(jiàn)的,這就讓訪客復(fù)查或編輯所輸入的詞條變得很麻煩。研究發(fā)現(xiàn),搜索框的平均寬度是18個(gè)字符。研究數(shù)據(jù)表明,27%的檢索問(wèn)題都太長(zhǎng)了,無(wú)法完全容納進(jìn)去,如果把搜索框延長(zhǎng)至27個(gè)字符,90%的檢索問(wèn)題就都能納入其中了。記住,你可以用em單位設(shè)置搜索框的寬度,不限于px或pt。一個(gè)em單位剛好是“m”字符的寬度與高度(不管網(wǎng)站設(shè)置的字號(hào)是多少)。那么,就用這個(gè)單位將文字輸入框的寬度設(shè)置成27個(gè)字符寬吧。
-
空白可以增進(jìn)理解
大多數(shù)設(shè)計(jì)師都知道空白的重要性,也就是在網(wǎng)頁(yè)的斷落、圖片、按鈕以及其他元素之間流出空間。空白讓頁(yè)面上的各個(gè)元素有空間來(lái)“呼吸”,避免頁(yè)面擁擠凌亂。我們也可以通過(guò)縮小某些之間的空隙,同時(shí)增加它們與別的元素之間的關(guān)系(例如,為了顯示某個(gè)按鈕適用于某一組元素)和建立網(wǎng)頁(yè)元素等級(jí)直觀重要。
-
網(wǎng)頁(yè)產(chǎn)品信息充足有助于其脫穎而出
如果你的網(wǎng)站鏈接有產(chǎn)品頁(yè)面,網(wǎng)上購(gòu)物的人們絕對(duì)會(huì)跟蹤、瀏覽。雖然人們只是大致瀏覽看看,但很多產(chǎn)品也缺乏充足有效的信息。這個(gè)問(wèn)題很嚴(yán)重,因?yàn)楫a(chǎn)品信息能幫助人們做出購(gòu)買選擇。研究顯示,產(chǎn)品信息匱乏會(huì)造成8%左右的可用性問(wèn)題,甚至10%的用戶失?。ㄒ簿褪?,用戶放棄瀏覽行為,離開網(wǎng)站)。
-
多數(shù)用戶會(huì)無(wú)視廣告
Jakob Nielsen在他的AlertBox網(wǎng)絡(luò)文集中表示,多數(shù)用戶會(huì)自動(dòng)屏蔽廣告條幅。如果他們正盯著網(wǎng)頁(yè)上一小塊信息看,或者全神貫注在內(nèi)容盯著網(wǎng)頁(yè)上一小塊信息看,或者全神貫注在內(nèi)容這意味著用戶屏蔽的不僅僅是廣告自身,還有任何看起來(lái)像廣告的東西。有些導(dǎo)航條設(shè)計(jì)得有些過(guò)火,會(huì)有廣告條幅之嫌,因此這方面得注意一下。