現(xiàn)在網(wǎng)頁(yè)設(shè)計(jì)師除了把頁(yè)面做的漂亮以外，越來(lái)越注重“用戶體驗(yàn)”，就是要做“別讓用戶思考”的網(wǎng)頁(yè)，使網(wǎng)站真正做到“可用性”。合肥網(wǎng)站制作公司結(jié)合幾年的工作經(jīng)驗(yàn)，粗談這方面的一些問題，和大家共勉！

　　一、人們?nèi)绾螢g覽網(wǎng)頁(yè)

　　上網(wǎng)的人是如何瀏覽網(wǎng)頁(yè)？現(xiàn)實(shí)和我們的想象可能會(huì)有很大的差距，因?yàn)槲覀冇X得“用戶會(huì)盯著每個(gè)網(wǎng)頁(yè)，仔細(xì)閱讀我們精心制作的文字，領(lǐng)會(huì)我們頁(yè)面的組織方式”，事實(shí)上大部分時(shí)間用戶看網(wǎng)頁(yè)就象“高速公路看廣告牌一樣”，沒時(shí)間仔細(xì)閱讀，當(dāng)然也不會(huì)用心思考。因而，我們必須為“掃描”而設(shè)計(jì)。

　　要盡可能留住用戶、吸引用戶訪問網(wǎng)頁(yè)，我們須注意以下幾點(diǎn)：

　　1、盡量符合用戶習(xí)慣的設(shè)計(jì)，讓人接受陌生的東西需要代價(jià)，除非我們覺得這個(gè)代價(jià)是必須的。

　　2、在頁(yè)面把越重要的東西越突出，建立清楚的視覺層次。

　　3、可以點(diǎn)擊的地方必須突出，讓人明顯知道可以點(diǎn)擊。

　　4、把頁(yè)面劃分成明確定義的區(qū)域

　　5、省略多余的文字

　　二、關(guān)于導(dǎo)航的設(shè)計(jì)

　　導(dǎo)航顯然是網(wǎng)站重要的部分，“如果在網(wǎng)站上找不到方向，人們就不會(huì)使用你的網(wǎng)站”。現(xiàn)在WEB導(dǎo)航的習(xí)慣用法基本形成了，雖然還會(huì)繼續(xù)演化下去，但基本元素以產(chǎn)生：網(wǎng)站LOGO、網(wǎng)站欄目、返回主頁(yè)、搜索、實(shí)用工具或幫助。

　　網(wǎng)站LOGO，通常是頁(yè)面左上角，出現(xiàn)在頁(yè)面可視層級(jí)的首要位置，可以采取兩種方式：讓它成為本頁(yè)顯眼的內(nèi)容，或者讓它涵蓋頁(yè)面所有其他元素，當(dāng)然網(wǎng)站LOGO設(shè)計(jì)的好壞對(duì)人產(chǎn)生心理影響就不用說了。

　　網(wǎng)站欄目，也稱導(dǎo)航條，站點(diǎn)層級(jí)結(jié)構(gòu)的頂層。導(dǎo)航條很多時(shí)候可以包容二級(jí)導(dǎo)航（下拉菜單的方式）。很多時(shí)候標(biāo)簽的設(shè)計(jì)是導(dǎo)航采用的很好表現(xiàn)方式，Amazon.com幾乎把它發(fā)展到完美的狀態(tài)。

　　1、進(jìn)入網(wǎng)站時(shí)，有一個(gè)標(biāo)簽已經(jīng)選中；

　　2、正確繪制，激活的標(biāo)簽頁(yè)要位于其他標(biāo)簽頁(yè)之前；

　　3、顏色區(qū)分，可以讓每個(gè)欄目使用一種不用的標(biāo)簽顏色，并把這種顏色用在頁(yè)面其他導(dǎo)航元素上，讓它們渾然一體；

　　搜索功能，如果有提供搜索功能的網(wǎng)站，要記住一個(gè)簡(jiǎn)單的公式：一個(gè)輸入框、一個(gè)按鈕、還有“Search”（搜索）兩個(gè)字，不要弄的太復(fù)雜。比如把 “搜索”換成“查找”、“快速查找”、“快速搜索”、“關(guān)鍵字搜索”都會(huì)讓用戶產(chǎn)生思考。如果必須為搜索框提供選項(xiàng)（縮小搜索范圍）一定要三思，謹(jǐn)慎提供選項(xiàng)，以便以何種方式提供為合理，還有就是要保證這些選項(xiàng)的確有用，否則會(huì)挫傷用戶心理。

　　值得注意的是，很多網(wǎng)站到了二級(jí)頁(yè)面以下，導(dǎo)航便會(huì)變了支離破碎，隨意發(fā)揮。這個(gè)問題非常普遍，以至于很難找到良好的三級(jí)導(dǎo)航的例子。事實(shí)上，用戶在底層頁(yè)面上花的時(shí)間通常和花在頂層頁(yè)面上的時(shí)間相同。除非我們一開始就自頂向下進(jìn)行導(dǎo)航設(shè)計(jì)，否則以后很難添加，也很難保持一致性。這就意味著我們?cè)谟懻撝黜?yè)的顏色方案之前，擁有顯示網(wǎng)站所有潛在級(jí)別的導(dǎo)航的DEMO設(shè)計(jì)非常重要。要做到這點(diǎn)，必須設(shè)計(jì)師和相關(guān)策劃人員緊密結(jié)合，設(shè)計(jì)師必須提前知道整個(gè)站的概貌和細(xì)節(jié)內(nèi)容。

　　有一點(diǎn)，設(shè)計(jì)師常常忽略，就是記得為每個(gè)頁(yè)面加個(gè)名稱。好像每個(gè)拐角處有一個(gè)路牌一樣，隨時(shí)讓駕駛者知道在哪里，無(wú)需思考。頁(yè)面的名稱應(yīng)該出現(xiàn)在涵蓋該頁(yè)內(nèi)容的位置，要引人注目，在大多數(shù)情況下，它應(yīng)該是該頁(yè)面大的文字。

　　總之，一個(gè)擁有良好導(dǎo)航系統(tǒng)的網(wǎng)站，一眼就能告訴用戶這些信息：

　　這是什么網(wǎng)站？（網(wǎng)站LOGO）

　　我在哪個(gè)網(wǎng)頁(yè)上？（網(wǎng)頁(yè)名稱）

　　這個(gè)站主要欄目有哪些？（導(dǎo)航欄目清單）

　　在這個(gè)層次上我有哪些選擇？（頁(yè)面導(dǎo)航）

　　我在導(dǎo)航系統(tǒng)的什么位置？（頁(yè)面里的“你在這里”的指示符號(hào)）

　　我怎么搜索？

　　三、關(guān)于主頁(yè)設(shè)計(jì)

　　首先要承認(rèn)，主頁(yè)不由我們控制。因?yàn)槊總€(gè)人都有個(gè)一個(gè)看法，如果要使每個(gè)人都滿意，那么就算優(yōu)秀的主頁(yè)設(shè)計(jì)也無(wú)法達(dá)到。因此設(shè)計(jì)主頁(yè)時(shí)不可避免地要做一些折衷。但有一件事情不要忘記——傳達(dá)整體形象，即一眼可以讓人感受到這個(gè)站是干什么的。越快越好，越清楚越好。所以當(dāng)瀏覽者進(jìn)入主頁(yè)時(shí)，我們好不費(fèi)力（幾秒鐘讓人了解）地告訴他四個(gè)問題：

　　這是什么網(wǎng)站？

　　網(wǎng)站上有些什么？

　　你能在這里做什么？

　　為什么你在這里，而不是在其別地方？

　　那么如何傳達(dá)這些信息呢：

　　1、口號(hào)，即靠近網(wǎng)站LOGO的地方。一條精煉、個(gè)性、生動(dòng)的口號(hào)可以讓人立即聯(lián)想網(wǎng)站的內(nèi)容。但也有例外，如果某個(gè)公司的品牌已達(dá)到家喻戶曉的地步，可以省略口號(hào)。

　　2、歡迎廣告，即對(duì)網(wǎng)站的簡(jiǎn)要描述，在主頁(yè)首要的位置顯示，不需要滾動(dòng)屏幕就能看到。

　　3、應(yīng)從哪里開始？當(dāng)進(jìn)入一個(gè)新站后，瀏覽者快速掃描主頁(yè)之后，應(yīng)該明白無(wú)誤地知道：

　　如果想搜索，可以從這里開始。

　　如果想掃描，可以從這里開始。

　　如果想掃描本站精彩的內(nèi)容，可以從這里開始。

　　在設(shè)計(jì)主頁(yè)時(shí)，注意幾個(gè)問題：

　　主頁(yè)的導(dǎo)航可以與下級(jí)的導(dǎo)航有點(diǎn)不同，但必須要有內(nèi)容和視覺上的一致。

　　可以不用下拉框就不用，因?yàn)槟鞘请[藏的信息。

　　四、如何解決對(duì)設(shè)計(jì)爭(zhēng)論不休——可用性測(cè)試——絕大部分公司沒做的

　　對(duì)設(shè)計(jì)爭(zhēng)論不休，似乎是個(gè)永久而又十分令人痛苦的事情。解決這個(gè)問題，很多時(shí)候，是上司或者老板說了算，“老板說咋樣就咋樣”。

　　其實(shí)可以對(duì)網(wǎng)站進(jìn)行“可用性測(cè)試”，除此之外，沒有更好的辦法。爭(zhēng)辯只會(huì)浪費(fèi)時(shí)間和團(tuán)隊(duì)的精力，而通過測(cè)試將討論對(duì)錯(cuò)轉(zhuǎn)移到什么有效、什么無(wú)效上，更容易緩和爭(zhēng)論，打破僵局。而且測(cè)試會(huì)讓我們看到用戶的動(dòng)力、理解、反映的不同，從而讓我們不會(huì)再堅(jiān)持認(rèn)為用戶的想法和我們的想法一樣。

　　如果想建立一個(gè)優(yōu)秀的網(wǎng)站，一定要測(cè)試，測(cè)試一個(gè)用戶比不做測(cè)試好一倍，早點(diǎn)測(cè)試一位用戶好過后測(cè)試50位用戶！這點(diǎn)我們做的不多，國(guó)內(nèi)也似乎不重視這點(diǎn)。網(wǎng)絡(luò)公司一般對(duì)程序流程的測(cè)試要比對(duì)界面體驗(yàn)的測(cè)試看的重要的多。

　　如何測(cè)試網(wǎng)頁(yè)可用性？

　　1、在項(xiàng)目的每個(gè)進(jìn)程中都可以測(cè)試，不必要等項(xiàng)目結(jié)束。項(xiàng)目初的時(shí)候，必須有人（項(xiàng)目負(fù)責(zé)人或設(shè)計(jì)師，或多人討論，設(shè)計(jì)師表現(xiàn)出來(lái)）使用團(tuán)隊(duì)的集體技巧、經(jīng)驗(yàn)、創(chuàng)造力和判斷力來(lái)創(chuàng)建一些版本（哪怕是一個(gè)很粗糙的版本），然后仔細(xì)觀察人門對(duì)它的看法和使用方法。

　　2、每輪測(cè)試的理想用戶數(shù)量是三個(gè)，多四個(gè)。前三個(gè)用戶可能會(huì)遇到幾乎所有明顯的問題，而且更重要的是要多做幾輪測(cè)試，及時(shí)修正問題。這里說明的是，測(cè)試用戶幾乎是任何懂得上網(wǎng)的人都可以，并不一定要與網(wǎng)站的目標(biāo)人群想符合。

　　3、測(cè)試設(shè)備，只需要一間辦公室會(huì)會(huì)議室、兩把椅子、一臺(tái)電腦、一臺(tái)攝像機(jī)（可以屏幕錄制軟件代替）就可以了。我們可以把攝像機(jī)的信號(hào)傳到附近的一個(gè)辦公室（甚至一個(gè)小地方）里，以便開發(fā)團(tuán)對(duì)的每個(gè)人都能進(jìn)行觀察而不會(huì)干擾測(cè)試用戶。

　　4、任何人都可以發(fā)起測(cè)試。任何人都可以觀察測(cè)試。

　　5、測(cè)試的項(xiàng)目：

　　“理解”測(cè)試。就是讓測(cè)試用戶看到網(wǎng)站，然后看他們是否理解這個(gè)網(wǎng)站，理解網(wǎng)站的目標(biāo)、價(jià)值主張、組織方式、運(yùn)行方式等。

　　關(guān)鍵任務(wù)測(cè)試。讓用戶完成一些任務(wù)，然后觀察他們是怎么做的。

　　還有種為簡(jiǎn)潔的“測(cè)試”方式，就是做好了一個(gè)頁(yè)面，就立即給別人看，看他們是否理解，當(dāng)然這種我們都做到了，呵呵！

　　如何處理測(cè)試出現(xiàn)的問題？

　　1、給問題分類?；仡櫞蠹铱吹降膯栴}，決定那些需要修正。

　　測(cè)試中可能出現(xiàn)的幾個(gè)問題：

　　用戶不清楚概念。他們看著網(wǎng)站和頁(yè)面，要么不知道網(wǎng)站說什么，要么理解有誤。

　　他們找不到自己要的字眼。這就意味我們組織的內(nèi)容和分類不符合用戶的習(xí)慣，或者沒有他們期望的名字出現(xiàn)。

　　內(nèi)容太多了。有時(shí)候，他們要找的內(nèi)容就在上面，但是他們找不到。這就需要減少頁(yè)面干擾，把他們需要看到的內(nèi)容設(shè)置醒目，讓它們從可視層級(jí)中突出。

　　2、解決問題。通過測(cè)試，站在用戶角度看自己的作品，這樣的體驗(yàn)常常能為問題提供全新解決方案，或者可以讓我們有一種新的眼光看原來(lái)的問題。團(tuán)隊(duì)不必對(duì)完美的解決方案達(dá)成一致，只要確認(rèn)下一步做什么就可以了。

　　值得申明的是，成功的網(wǎng)頁(yè)需要巧妙的平衡，一個(gè)微小的變化都可能帶來(lái)不小的影響。有時(shí)候，真正的挑戰(zhàn)不是我們?nèi)绾涡薷奈覀儼l(fā)現(xiàn)的問題，而是修改這些問題后，同時(shí)不破壞已經(jīng)正常運(yùn)行的部分。特別是，當(dāng)把某部分調(diào)整得突出的時(shí)候，是不是把其他內(nèi)容重要性降低了。

　　總之，我們要做一個(gè)“好”網(wǎng)頁(yè)：

　　——讓用戶在我們網(wǎng)站是做什么的，大限度明白簡(jiǎn)易

　　——告訴用戶想要知道的

　　——盡量減少步驟

　　——花些心思

　　——知道用戶有哪些問題，并給予解答

　　——為用戶提供協(xié)助

　　——容易從錯(cuò)誤中恢復(fù)

　　——如有不確定，要記得向用戶道歉