幫助中心

新手上路

代理登陸

投訴建議

加盟合作

常用文檔

網(wǎng)站可用性設(shè)計(jì)6個(gè)最普遍可用性設(shè)計(jì)錯(cuò)誤

發(fā)布時(shí)間: 2012/9/8 18:31:11

人們使用web來(lái)與其他人進(jìn)行交互，查找信息，在線購(gòu)物，以及下載軟件程序等。要容易的實(shí)現(xiàn)這些事情，當(dāng)他們?yōu)g覽一個(gè)新的網(wǎng)頁(yè)的時(shí)候，他們要么熟悉這些網(wǎng)站，要么是以直覺(jué)判斷來(lái)確定正確的行動(dòng)。一個(gè)良好的網(wǎng)站可用性設(shè)計(jì)，能夠有效的幫助你的新訪客找到他們真正需要的信息，作為一名訪客而言，每到一個(gè)新的網(wǎng)站總得上下翻轉(zhuǎn)整個(gè)頁(yè)面去尋找下載鏈接，那實(shí)在是一件讓人煩心的事情（對(duì)于國(guó)內(nèi)的部分下載站點(diǎn)，甚至以廣告鏈接來(lái)冒充下載資源，那更是讓人深?lèi)和唇^！）。

一。讓人困惑的網(wǎng)站結(jié)構(gòu)和內(nèi)容

對(duì)用戶而言，沒(méi)有什么東西比一個(gè)讓人困惑的站點(diǎn)更讓人氣憤了，它們沒(méi)有任何方位說(shuō)明，混亂的站點(diǎn)導(dǎo)航，甚至沒(méi)有站點(diǎn)導(dǎo)航，你根本沒(méi)有辦法在該站找到下一個(gè)對(duì)你有用的信息，除了當(dāng)前你正在瀏覽的頁(yè)面，你最想做的事情就是立刻離開(kāi)這個(gè)網(wǎng)站，并且永遠(yuǎn)不再回來(lái)！研究人員指出，網(wǎng)絡(luò)用戶應(yīng)該能夠在不超過(guò)3次點(diǎn)擊的情況下，在一個(gè)網(wǎng)站上的每一個(gè)頁(yè)面去到任何一個(gè)他們想去的精確頁(yè)面。

當(dāng)然，我們說(shuō)的3次點(diǎn)擊肯定應(yīng)該理解為同一個(gè)站點(diǎn)的任何兩個(gè)不同網(wǎng)頁(yè)之間。如果不能通過(guò)3次點(diǎn)擊到達(dá)他們所需要的目標(biāo)頁(yè)面，你很可能會(huì)失去他們。檢查你的web站點(diǎn)，如果超過(guò)3次點(diǎn)擊，web設(shè)計(jì)師會(huì)告訴你，如果你想重新設(shè)計(jì)或者定義網(wǎng)站結(jié)構(gòu)，那將是一個(gè)非常耗費(fèi)時(shí)間的活計(jì)！

在今天，我們?nèi)绾卧u(píng)價(jià)一個(gè)網(wǎng)站的結(jié)構(gòu)是好是壞呢，有什么主要的特征來(lái)判斷呢？答案很簡(jiǎn)單：簡(jiǎn)約。一個(gè)好的站點(diǎn)就是一個(gè)所有人都易于有效使用的簡(jiǎn)單站點(diǎn)。

同時(shí)，你還需要注意的是，一個(gè)站點(diǎn)有大量的信息，但是它們并不是每個(gè)普通用戶都需要的�？紤]到這一點(diǎn)，你可能需要使用Google Analytics網(wǎng)站分析工具來(lái)精確檢測(cè)用戶從哪些網(wǎng)頁(yè)離開(kāi)你的網(wǎng)站。通過(guò)該工具的幫助，你可以從你的網(wǎng)站流量得到一些提示，哪些頁(yè)面你需要替換或者重新考慮它。

不要忘記為你的網(wǎng)站使用一個(gè)站點(diǎn)地圖［Sitemap］：有的時(shí)候，這個(gè)細(xì)節(jié)被我們跳過(guò)了。站點(diǎn)地圖本來(lái)是為站點(diǎn)可用性而設(shè)計(jì)，然而在今天，隨著站點(diǎn)地圖對(duì)SEO的作用減弱，很多網(wǎng)站和博客都對(duì)sitemap不再那么重視，而它對(duì)站點(diǎn)可用性的作用也逐漸被人們以往。實(shí)際上，如果以SEO2.0的標(biāo)準(zhǔn)來(lái)衡量，網(wǎng)站的可用性設(shè)計(jì)占據(jù)著非常重要的地位，因此為你的站點(diǎn)設(shè)計(jì)一個(gè)HTML格式的sitemap就更顯得重要了，不是為了SEO，而是為了Web Usability。站點(diǎn)地圖的創(chuàng)建應(yīng)該是以最終用戶的可用性設(shè)計(jì)為理念，就像它的名字一樣，它讓你的用戶不至于在你的網(wǎng)站上迷失。

二。缺少搜索功能

盡管不是所有的網(wǎng)站都需要搜索功能，但是在頁(yè)面右上方的一個(gè)搜索框卻是讓客戶發(fā)現(xiàn)最需要的信息最快和最直接的方式。我認(rèn)為盡管主菜單已經(jīng)有了一定數(shù)量的鏈接，然而搜索功能的重要性還是不容忽視的，尤其對(duì)于資源豐富的網(wǎng)站。

搜索功能是必要的，但是并非放置一個(gè)搜索框到你的網(wǎng)站這樣簡(jiǎn)單而已。很多時(shí)候，如果你的搜索功能沒(méi)有正確建立，它所提供的結(jié)果并不能讓你的防客滿意。搜索結(jié)果的精確匹配非常重要，如果你的搜索不能為用戶返回最相關(guān)的搜索結(jié)果，那必定會(huì)給用戶帶來(lái)不好的印象，他們會(huì)認(rèn)為你的網(wǎng)站沒(méi)有他們所需要的內(nèi)容，但事實(shí)上卻并不是他們想的那樣。

下面是關(guān)于添加搜索功能應(yīng)當(dāng)注意的一些技巧：

1搜索框的位置，通常放在頁(yè)面的右上角是個(gè)不錯(cuò)的選擇；

2搜索選項(xiàng)應(yīng)該有能力檢測(cè)錯(cuò)誤的拼寫(xiě)，并為用戶提供正確的搜索建議；

3搜索框應(yīng)該盡量的簡(jiǎn)單，在大多數(shù)網(wǎng)站都沒(méi)有必要添加高級(jí)搜索選項(xiàng)；

4簡(jiǎn)單的搜索不應(yīng)該對(duì)大小寫(xiě)敏感；

5在搜索框旁邊放置一個(gè)帶“搜索”標(biāo)簽的按鈕；

6精確匹配的結(jié)果應(yīng)該放置在近似匹配結(jié)果的前面；

7使用醒目的顏色來(lái)標(biāo)志搜索關(guān)鍵詞及詞組片段；

三。隱秘的鏈接

還有一個(gè)打擊可用性的問(wèn)題就是，對(duì)于普通文本和鏈接使用同樣的顏色。這樣做的結(jié)果是讓一部分訪客感覺(jué)到混亂，他們嘗試去點(diǎn)擊一些不是鏈接的文本，然而真正的鏈接他們卻難以發(fā)現(xiàn)。

另外，鏈接的長(zhǎng)度也不宜過(guò)長(zhǎng)，通常在5到7個(gè)單詞比較合適。

四。沒(méi)有優(yōu)化的404頁(yè)面

404頁(yè)面錯(cuò)誤或者 “Page Not Found” 消息是服務(wù)器的一個(gè)HTTP響應(yīng)，錯(cuò)誤表示web瀏覽器能夠與服務(wù)器通訊，但是服務(wù)器無(wú)法正確的處理或識(shí)別相關(guān)的請(qǐng)求，或者是服務(wù)器沒(méi)有一個(gè)適當(dāng)?shù)呐渲脕?lái)滿足用戶的請(qǐng)求

下面是幾個(gè)優(yōu)化你網(wǎng)站404錯(cuò)誤頁(yè)面的幾個(gè)方法：

1放置一個(gè)FAQ/支持頁(yè)面鏈接

2放置一個(gè)sitemap鏈接

3放置一個(gè)最重要的分類(lèi)鏈接

4放置一個(gè)搜索框在頁(yè)面上方顯著位置

5添加與其他頁(yè)面相同的404頁(yè)面樣式

與隱秘鏈接類(lèi)似，404頁(yè)面的自定義也是一個(gè)容易被忽視的問(wèn)題。

五。可用性表單

一篇可用性表格清單文章給大家可以參考，其中提到了許多最重要和最相關(guān)的關(guān)于表單可用性的技巧，最關(guān)鍵的一點(diǎn)還是：簡(jiǎn)潔。

這里我們只列出一些最應(yīng)該考慮的重要規(guī)則：

不管是新用戶還是老用戶，都應(yīng)當(dāng)讓他們了解完成表單的填寫(xiě)對(duì)他們有什么好處

應(yīng)當(dāng)盡量避免在表單中提供了過(guò)多的填寫(xiě)項(xiàng)目

不要有任何重復(fù)的填寫(xiě)項(xiàng)目

如果有必要的話，將一個(gè)表單撕裂為幾個(gè)頁(yè)面

保證表單外觀的整潔

以不同的方式標(biāo)記必須要完成的重要表單項(xiàng)目

相應(yīng)的錯(cuò)誤消息應(yīng)該被返回

考慮用戶的時(shí)間，避免使用復(fù)雜的表單。對(duì)于注冊(cè)信息表單，創(chuàng)建關(guān)鍵表單項(xiàng)，對(duì)于用戶問(wèn)卷調(diào)查表單，則盡量使用簡(jiǎn)潔的回答方式，能設(shè)置預(yù)設(shè)答案的項(xiàng)目盡量設(shè)置好，提高用戶完成表單的效率。

通常使用免費(fèi)下載，免費(fèi)資源來(lái)刺激用戶完成表單是一個(gè)不錯(cuò)的選擇。

8不要有零條記錄被發(fā)現(xiàn)的消息，對(duì)于類(lèi)似的情況，提供相關(guān)的搜索建議給用戶選擇。

六。醒目網(wǎng)頁(yè) ［Splash pages］

Splash pages 被定義為一個(gè)網(wǎng)站的介紹頁(yè)面或者引導(dǎo)頁(yè)面。在很多時(shí)候，它們都由下面這些元素構(gòu)成：圖形或logo，動(dòng)畫(huà)或者flash影象。醒目網(wǎng)頁(yè)現(xiàn)在還像以前一樣非常流行，或許現(xiàn)在稍微冷卻了一些吧，但是這也是一個(gè)讓最終用戶討厭的東西。

但是，讓我們用一個(gè)開(kāi)發(fā)人員的角度來(lái)看看醒目網(wǎng)頁(yè)有什么優(yōu)點(diǎn)和缺點(diǎn)：

優(yōu)點(diǎn)：

1Splash頁(yè)面讀取時(shí)間快并且把所有的信息都放在一個(gè)獨(dú)立的頁(yè)面

2Splash pages 允許訪問(wèn)者選擇適合于他們的站點(diǎn)技術(shù)

3站長(zhǎng)可以通過(guò)廣告獲得潛在的收入

缺點(diǎn)

1對(duì)于用戶來(lái)說(shuō)沒(méi)有任何可用性可言

2用戶可能會(huì)嘗試離開(kāi)網(wǎng)站：根據(jù)相關(guān)研究表明，有25%的用戶在看到splash page后選擇離開(kāi)

3大多數(shù)的搜索引擎不能索引到splash page

4在splash page上的重復(fù)動(dòng)畫(huà)可能導(dǎo)致用戶的厭煩

通過(guò)上面的優(yōu)點(diǎn)和缺點(diǎn)的比較，你可以選擇使用或者不用splash頁(yè)面，要注意的是多數(shù)時(shí)候這個(gè)東西會(huì)造成用戶的反感。

結(jié)論

可用性是個(gè)主觀的東西。在web設(shè)計(jì)師或者開(kāi)發(fā)人員的眼里看似好用網(wǎng)頁(yè)設(shè)計(jì)對(duì)于最終客戶來(lái)說(shuō)卻有可能完全不一樣。Web完全是一個(gè)相互作用的環(huán)境，我們必須注意網(wǎng)站與訪問(wèn)者交互的方式，以及了解訪問(wèn)者是否能理解你的網(wǎng)站為他們提供的方便。

你很難找到一個(gè)手冊(cè)來(lái)告訴你正確的步驟。不要忘記，當(dāng)你創(chuàng)建一個(gè)網(wǎng)站的時(shí)候，你應(yīng)該把你自己當(dāng)作一個(gè)普通訪問(wèn)者來(lái)看待；在成為一名網(wǎng)站藝術(shù)家之前，你需要理解訪客的需求。為了獲得最好的效果，你必須經(jīng)常測(cè)試：讓一些從來(lái)沒(méi)有來(lái)過(guò)你網(wǎng)站的人到你的網(wǎng)站做一些你想讓他們做的事情網(wǎng)站可用性設(shè)計(jì)參考資料：

網(wǎng)頁(yè)設(shè)計(jì)的5個(gè)小經(jīng)驗(yàn)

基于 the F-Pattern Eye-Tracking 原理來(lái)格式化你的landing page：互聯(lián)網(wǎng)讀者都傾向于一種粗略的F-shared模型來(lái)瀏覽web內(nèi)容，因此把你的重要圖片放到文字左面去。（什么是F-shaped模型，實(shí)際上就是普通人瀏覽web內(nèi)容的眼球軌跡，也叫做尼爾森的F視覺(jué)模型。

網(wǎng)站優(yōu)化-通過(guò)提高Wed可用性構(gòu)建用戶滿意的網(wǎng)站

關(guān)于可用性測(cè)試，大家還可以拜訪 Steve Krug 的網(wǎng)站，下載這個(gè)優(yōu)秀的腳本。Steve Krug 是偉大著作 Don’t Make Me Think—A Common Sense Approach to Web Usability ［中文譯名：點(diǎn)石成金－訪客至上的網(wǎng)頁(yè)設(shè)計(jì)秘笈］的作者。我們向大家高度推薦這本書(shū)。 Steve 的腳本是為“實(shí)驗(yàn)室可用性測(cè)試”而設(shè)計(jì)的，因此你可以忽略麥克風(fēng)和屏幕記錄。

網(wǎng)站可用性設(shè)計(jì)是一門(mén)非常有趣的課程，在SEO 2.0的概念下可用性設(shè)計(jì)是個(gè)非常重要的組成部分。

本文出自：億恩科技【www.allwellnessguide.com】

服務(wù)器租用/服務(wù)器托管中國(guó)五強(qiáng)！虛擬主機(jī)域名注冊(cè)頂級(jí)提供商！15年品質(zhì)保障！--億恩科技[ENKJ.COM]