Web可用性設(shè)計(jì)的247條指導(dǎo)方針
當(dāng)前位置:點(diǎn)晴教程→知識(shí)管理交流
→『 技術(shù)文檔交流 』
[p][b]譯序:[/b][url=http://userfocus.co.uk/]userfocus[/url]是英國(guó)一家專門從事網(wǎng)站可用性設(shè)計(jì)的咨詢培訓(xùn)公司。它為我們分享了247條web可用性設(shè)計(jì)的指導(dǎo)方針,并把它們清晰的分為六個(gè)大類:首頁(yè)可用性設(shè)計(jì)、任務(wù)導(dǎo)向、導(dǎo)航和信息架構(gòu)、表單和數(shù)據(jù)輸入、可信度、寫作和內(nèi)容質(zhì)量、頁(yè)面布局和視覺設(shè)計(jì)、搜索可用性、幫助反饋和容錯(cuò)。如userfocus所說(shuō),“雖然易用性系統(tǒng)的設(shè)計(jì)遠(yuǎn)不止應(yīng)用一些簡(jiǎn)單的指導(dǎo)方針,但是它們卻可以為獲取穩(wěn)定性和好的實(shí)踐提供有意義的幫助。”[/p]
[p][b]譯者:[/b][url=http://css9.net/]iiduce[/url],轉(zhuǎn)載請(qǐng)務(wù)必以鏈接形式注明來(lái)源。[/p] [p][b]原文地址:[/b][url=http://userfocus.co.uk/resources/guidelines.html]http://userfocus.co.uk/resources/guidelines.html[/url][/p] [p][b]目錄:[/b][/p] 首頁(yè)可用性設(shè)計(jì)(20條評(píng)估首頁(yè)可用性的方針) 任務(wù)導(dǎo)向(44條評(píng)估網(wǎng)站對(duì)用戶任務(wù)支持程度的方針) 導(dǎo)航和信息架構(gòu)(29條評(píng)估導(dǎo)航和信息架構(gòu)的方針) 表單和數(shù)據(jù)輸入(23條評(píng)估表單和數(shù)據(jù)輸入的方針) 可信度(13條評(píng)估可信度的方針) 寫作和內(nèi)容質(zhì)量(23條評(píng)估寫作和內(nèi)容質(zhì)量的方針) 頁(yè)面布局和可視設(shè)計(jì)(38條評(píng)估頁(yè)面布局和可視設(shè)計(jì)的方針) 搜索可用性(20條評(píng)估搜索可用性設(shè)計(jì)的方針) 幫助、反饋和容錯(cuò)(37條評(píng)估幫助、反饋和容錯(cuò)的方針) [p][b]首頁(yè)可用性設(shè)計(jì)[/b][/p] 首頁(yè)元素要清晰的關(guān)注用戶的關(guān)鍵任務(wù)(避免“增加功能傾向(featuritis)”) 如果網(wǎng)站比較大,那么首頁(yè)應(yīng)包含搜索輸入框 首頁(yè)要十分清楚的提供產(chǎn)品(內(nèi)容)分類 在首頁(yè)或首頁(yè)內(nèi)一次點(diǎn)擊展示有用的內(nèi)容 信息展示時(shí)應(yīng)當(dāng)是簡(jiǎn)單的、自然的、符合邏輯順序的 在首頁(yè)展示真實(shí)網(wǎng)站內(nèi)容的優(yōu)秀示例 首頁(yè)上的鏈接以最重要的關(guān)鍵詞作為起始(例如:“sun holidays”而不是“holidays in the sun”) 在首頁(yè)提供一個(gè)最近的特色項(xiàng)列表,并提供存檔內(nèi)容的鏈接 首頁(yè)導(dǎo)航不要過(guò)度格式化(修飾),確保用戶不會(huì)把它誤認(rèn)為廣告 在首頁(yè)清晰的聲明價(jià)值取向(例如一個(gè)標(biāo)志性的口號(hào)或歡迎語(yǔ)) 在首頁(yè)包含有意義的圖案設(shè)計(jì),而非無(wú)關(guān)的剪貼畫或繪畫作品 導(dǎo)航選項(xiàng)按邏輯性或用戶導(dǎo)向方式排序(把次要的公司信息放在底部) 首頁(yè)標(biāo)題(title)可以為諸如google等搜索引擎提供良好可見度 所有公司相關(guān)信息安排在一個(gè)顯著區(qū)域(例如:“關(guān)于我們(about us)”) 用戶可以了解到價(jià)值取向 一看到首頁(yè),第一次訪問(wèn)的人就知道從何處開始 在首頁(yè)展示出所有主要的操作選項(xiàng) 首頁(yè)擁有一個(gè)易記的url 首頁(yè)需經(jīng)過(guò)專業(yè)設(shè)計(jì),以給用戶良好的第一印象 首頁(yè)的設(shè)計(jì)要能激發(fā)用戶探索站點(diǎn)的興趣 [li]首頁(yè)就要像一個(gè)首頁(yè),不能讓用戶把它與二級(jí)頁(yè)面混淆 [/li] [p][b]任務(wù)導(dǎo)向[/b][/p] 網(wǎng)站應(yīng)避免出現(xiàn)不相干的、多余的或讓用戶分心的信息 避免過(guò)多的使用腳本、小應(yīng)用程序(applets)、視頻音頻文件、圖案和圖片 網(wǎng)站應(yīng)避免不必要的登記 關(guān)鍵人物路徑必須是清晰的,無(wú)干擾的(例如:購(gòu)買、捐獻(xiàn)) 信息以簡(jiǎn)單的、自然的(natural)、符合邏輯順序的方式展示 應(yīng)盡量縮減每個(gè)任務(wù)需要的屏幕數(shù)量 應(yīng)減量減少頁(yè)面滾動(dòng)(scrolling)和點(diǎn)擊 網(wǎng)站應(yīng)正確的預(yù)期和提示用戶下一步可能的動(dòng)作 展示圖表時(shí),確保用戶可以看到真實(shí)數(shù)據(jù)(例如在柱狀圖上標(biāo)明數(shù)字注解) 當(dāng)分配給用戶任務(wù)時(shí),應(yīng)充分利用計(jì)算機(jī)的優(yōu)勢(shì)(例如搜索輸入的自動(dòng)完成功能) 用戶可以快速完成普通任務(wù) 當(dāng)必要時(shí),應(yīng)為當(dāng)前任務(wù)提供數(shù)據(jù)對(duì)比功能(例如:商品比較) 任務(wù)順序應(yīng)當(dāng)與用戶日常工作順序一致 網(wǎng)站可以保證用戶的工作比不使用它時(shí)更輕松快捷 最重要的或經(jīng)常使用的主題、特征或功能應(yīng)放在頁(yè)面中央附近的位置,而不是特別靠左邊或右邊 確保用戶不會(huì)重復(fù)輸入相同的信息 重要的、頻繁使用的主題或任務(wù)應(yīng)接近網(wǎng)站的“表面” 保持最少的錄入(例如購(gòu)買過(guò)程中),并為用戶提供加速器 任何給定任務(wù)路徑應(yīng)當(dāng)有一個(gè)合理的步驟長(zhǎng)度(2-5次點(diǎn)擊) 當(dāng)一個(gè)任務(wù)有多步時(shí),網(wǎng)站要告訴用戶完成任務(wù)需要的所有步驟,并為用戶當(dāng)前步驟所在的位置提供反饋 在每個(gè)產(chǎn)品后面緊跟它的價(jià)格 可以非常容易的找到網(wǎng)站的隱私策略,尤其是在那些要求填寫個(gè)人信息的頁(yè)面。隱私策略應(yīng)當(dāng)是簡(jiǎn)單的、清晰的 網(wǎng)站用戶不需要記住從一個(gè)地方到另一個(gè)地方的信息 隱喻的使用可以被典型用戶輕松理解 數(shù)據(jù)格式應(yīng)當(dāng)遵循文化常規(guī) 軟件的內(nèi)部工作細(xì)節(jié)不要暴露給用戶 應(yīng)當(dāng)迎合用戶那些之前已經(jīng)養(yǎng)成的那些小的互聯(lián)網(wǎng)習(xí)慣 網(wǎng)站應(yīng)當(dāng)易于用戶瀏覽,在執(zhí)行前可以自己嘗試其它的功能操作 第一次到訪的典型用戶應(yīng)當(dāng)可以在不需幫助的情況下完成最常用的功能 當(dāng)用戶回到網(wǎng)站時(shí),用戶可以記得如何執(zhí)行主要任務(wù) 那些新穎設(shè)備(novel device controls)的功能應(yīng)當(dāng)是顯而易見的 在購(gòu)物車頁(yè)面,在頁(yè)面的頂部或底部應(yīng)當(dāng)清晰的展示”處理結(jié)賬”按鈕 重要的操作入口(例如“添加到購(gòu)物車”)應(yīng)當(dāng)非常清晰可見 操作按鈕(例如“提交”)應(yīng)當(dāng)由用戶觸發(fā),而非在完成所有選項(xiàng)時(shí)系統(tǒng)自動(dòng)觸發(fā) 命令或操作項(xiàng)英以按鈕的形式的展示(而非例如鏈接) 如果用戶在事務(wù)處理中中途退出,用戶在稍后返回站點(diǎn)時(shí)可以繼續(xù)他退出之前的工作 當(dāng)頁(yè)面展示大量信息時(shí),用戶可以排序和過(guò)濾信息 按鈕或圖標(biāo)上的圖像應(yīng)當(dāng)與內(nèi)容相關(guān) 當(dāng)用戶被系統(tǒng)自動(dòng)注銷時(shí)應(yīng)當(dāng)提示用戶,并且自動(dòng)注銷的時(shí)間間隔要恰當(dāng) 不必要的功能(例如flash動(dòng)畫)可以被關(guān)閉或跳過(guò)(skip) 網(wǎng)站應(yīng)當(dāng)是健壯的,并且所有關(guān)鍵功能可正常工作(例如不應(yīng)有javascript頁(yè)面異常、cgi報(bào)錯(cuò)或死鏈接) 網(wǎng)站通過(guò)不同程度的說(shuō)明來(lái)支持新手用戶和專家用戶(例如幫助信息、錯(cuò)誤信息) 網(wǎng)站允許用戶重新填寫一些信息項(xiàng)(例如更改發(fā)貨地址、更改賬戶信息) [li]網(wǎng)站允許用戶自定義操作時(shí)間參數(shù)(例如自動(dòng)退出的時(shí)間) [/li][b]導(dǎo)航和信息架構(gòu)[/b] 關(guān)聯(lián)頁(yè)面或區(qū)域間的跳轉(zhuǎn)移動(dòng)應(yīng)當(dāng)是方便的、顯而易見的,并且可以容易的回到首頁(yè) 在絕大部分頁(yè)面都可以輕松的導(dǎo)航至用戶最可能需要的信息 導(dǎo)航選項(xiàng)按照最常用邏輯或任務(wù)導(dǎo)向方式排序 導(dǎo)航系統(tǒng)應(yīng)當(dāng)是內(nèi)容寬泛并層級(jí)較淺的,而非有比較深的層級(jí) 站點(diǎn)結(jié)構(gòu)是簡(jiǎn)單的,有一個(gè)清晰的概念模型,沒(méi)有不必要的層次 在所有頁(yè)面都可以到達(dá)網(wǎng)站主要部分(持久導(dǎo)航persistent navigation),導(dǎo)航過(guò)程不會(huì)中斷 導(dǎo)航標(biāo)簽放在頁(yè)面頂端,而且要設(shè)計(jì)成看上去可以點(diǎn)擊的樣子 要有一個(gè)站點(diǎn)地圖用來(lái)提供整個(gè)站點(diǎn)內(nèi)容的概況 在任何頁(yè)面都可以鏈接到站點(diǎn)地圖 站點(diǎn)地圖提供一個(gè)簡(jiǎn)潔的網(wǎng)站概貌,而非主要導(dǎo)航的重復(fù)或各主題的簡(jiǎn)單羅列 提供良好的導(dǎo)航反饋(例如顯示當(dāng)前位置) 分類標(biāo)簽應(yīng)當(dāng)能準(zhǔn)確描述該分類的信息 鏈接或?qū)Ш綐?biāo)簽包含用戶要達(dá)到目標(biāo)所尋找的“觸發(fā)字眼(trigger words)” 術(shù)語(yǔ)和常規(guī)(例如鏈接顏色)應(yīng)當(dāng)(近似地)與互聯(lián)網(wǎng)習(xí)慣用法保持一致 在網(wǎng)站各個(gè)組成部分中的鏈接樣子應(yīng)當(dāng)一致 產(chǎn)品頁(yè)面應(yīng)當(dāng)包含與當(dāng)前產(chǎn)品相似或互補(bǔ)產(chǎn)品的鏈接,以實(shí)現(xiàn)交叉營(yíng)銷 導(dǎo)航項(xiàng)和鏈接中的用詞應(yīng)當(dāng)是無(wú)歧義的,并且使用術(shù)語(yǔ) 用戶可以排序和過(guò)濾目錄頁(yè)面(例如按價(jià)格排序或最熱門排序) 當(dāng)鼠標(biāo)放在某個(gè)可點(diǎn)擊的元素上時(shí),元素應(yīng)當(dāng)有明顯變化(包括光標(biāo)的變化) 重要內(nèi)容可以通過(guò)不止一個(gè)鏈接訪問(wèn)到(不同的用戶有可能需要不同的鏈接標(biāo)簽) 僅用于導(dǎo)航的頁(yè)面(例如首頁(yè))可以再不滾動(dòng)的情況下瀏覽 觸發(fā)事件的超鏈接應(yīng)當(dāng)與鏈接到其它頁(yè)面的超鏈接(例如:下載)在外觀上有明顯區(qū)分 網(wǎng)站允許用戶控制交互速度和順序 在網(wǎng)站每個(gè)頁(yè)面清晰標(biāo)注退出入口,允許用戶從當(dāng)前任務(wù)中推出,而不必通過(guò)一個(gè)額外的對(duì)話框 網(wǎng)站不可禁用瀏覽器的“后退”按鈕,“后退”按鈕應(yīng)當(dāng)在每個(gè)頁(yè)面的瀏覽器工具欄上都有顯示 用戶點(diǎn)擊瀏覽器后退按鈕時(shí),總能回到他之前所在頁(yè)面 購(gòu)物車(basket)和結(jié)賬(checkout)鏈接應(yīng)當(dāng)在每個(gè)頁(yè)面中都可以看的十分清楚 如果網(wǎng)站有打開新窗口,那么這個(gè)動(dòng)作不應(yīng)使用戶困惑(例如:新窗口應(yīng)該是一個(gè)設(shè)定大小的對(duì)話框或并可以輕松關(guān)閉) [li]菜單的使用說(shuō)明、提示、相關(guān)信息應(yīng)當(dāng)在每個(gè)屏幕的同一位置顯示 [/li] [p][b]表單和數(shù)據(jù)輸入[/b][/p] 數(shù)據(jù)輸入框在適當(dāng)?shù)臅r(shí)候應(yīng)當(dāng)包含默認(rèn)值,顯示要填的數(shù)據(jù)格式和輸入框允許輸入的長(zhǎng)度 如果任務(wù)設(shè)計(jì)源文件(例如紙張形式),那么界面應(yīng)當(dāng)與源文件的規(guī)格一致 網(wǎng)站能自動(dòng)完成格式化數(shù)據(jù)的輸入(例如貨幣符號(hào)等),用戶不需要輸入類似£ 或 %的符號(hào) 表單域的標(biāo)簽應(yīng)當(dāng)清楚的說(shuō)明該輸入框希望輸入什么 表單中的文本框應(yīng)該為預(yù)期答案設(shè)定合理長(zhǎng)度 表單中的必填項(xiàng)和選填項(xiàng)應(yīng)當(dāng)有明顯的區(qū)分 登陸和注冊(cè)應(yīng)當(dāng)用相同的表單(就像amazon一樣) 如果完成表單需要外部信息的話應(yīng)當(dāng)提前告知用戶,例如護(hù)照編號(hào) 表單中的問(wèn)題項(xiàng)(輸入框)應(yīng)當(dāng)按邏輯分組,并且每組都有一個(gè)標(biāo)題 表單域應(yīng)包含提示、示例或樣例答案,告知用戶輸入框期望輸入什么 如果輸入框的標(biāo)簽以表單問(wèn)題的方式提出,那么這些問(wèn)題應(yīng)當(dāng)是陳述清晰、簡(jiǎn)單的 在表單中,相對(duì)于文本輸入框,應(yīng)當(dāng)優(yōu)先使用下拉菜單、單選按鈕、復(fù)選框(文本輸入框不應(yīng)當(dāng)使用過(guò)度) 在數(shù)據(jù)輸入頁(yè)面,光標(biāo)應(yīng)當(dāng)被放置在需要輸入的地方 數(shù)據(jù)輸入(例如日期)和輸出(例如數(shù)值單位)的格式應(yīng)當(dāng)被清晰標(biāo)明 用戶可以在進(jìn)輸入一些基本必要信息就可以完成簡(jiǎn)單的任務(wù)(系統(tǒng)可以默認(rèn)補(bǔ)充一些不重要的信息) 表單允許用戶盡可能久的保持一種簡(jiǎn)單的交互方式(例如,用戶不必在鍵盤鼠標(biāo)間不停的切換) 用戶可以更改表單域的默認(rèn)值 文本輸入框需指出要輸入數(shù)據(jù)的數(shù)量和格式 表單在提交前執(zhí)行數(shù)據(jù)驗(yàn)證 在數(shù)據(jù)輸入界面,在適當(dāng)?shù)臅r(shí)間執(zhí)行表單域級(jí)別驗(yàn)證和表單級(jí)別驗(yàn)證 網(wǎng)站應(yīng)可以輕松地更正輸入錯(cuò)誤(例如,當(dāng)驗(yàn)證表單未完成,應(yīng)當(dāng)將光標(biāo)放置在需要輸入的位置) 數(shù)據(jù)輸入和數(shù)據(jù)顯示應(yīng)當(dāng)保持一致性 [li]表單域標(biāo)簽應(yīng)當(dāng)靠近輸入域(例如:標(biāo)簽右對(duì)齊) [/li] [p][b]可信度[/b][/p] 內(nèi)容應(yīng)當(dāng)是最新的、權(quán)威的、可信賴的 網(wǎng)站有第三方(例如引用、第三方使用見證)來(lái)說(shuō)明信息的準(zhǔn)確性 應(yīng)當(dāng)清晰標(biāo)明網(wǎng)站的幕后有真實(shí)的組織(例如:提供一個(gè)真實(shí)地址或辦公室照片) 公司有一些認(rèn)證專家(可以使用一些憑證) 網(wǎng)站應(yīng)避免廣告,尤其是彈出式廣告 在結(jié)賬的最一開始就突出提示運(yùn)送費(fèi)用 網(wǎng)站應(yīng)當(dāng)避免空洞的營(yíng)銷辭令(marketing waffle) 每個(gè)頁(yè)面都應(yīng)當(dāng)清晰顯示站點(diǎn)標(biāo)識(shí),保證用戶確認(rèn)他仍然在同一個(gè)網(wǎng)站上 通過(guò)網(wǎng)站可以輕松聯(lián)系到某人以獲取幫助,并可盡快得到回復(fù) 內(nèi)容是新鮮的,網(wǎng)站應(yīng)經(jīng)常更新,總包含最近的內(nèi)容 網(wǎng)站應(yīng)當(dāng)避免版式錯(cuò)誤和拼寫錯(cuò)誤 用可視化設(shè)計(jì)來(lái)補(bǔ)充商品和線下營(yíng)銷信息 [li]網(wǎng)站組織應(yīng)當(dāng)有一些真實(shí)的人,他們是誠(chéng)實(shí)的、可信賴的 [/li] [p][b]寫作和內(nèi)容質(zhì)量[/b][/p] [p][/p] 網(wǎng)站有能引起別人興趣的、獨(dú)一無(wú)二的內(nèi)容 正文是簡(jiǎn)明的,沒(méi)有不必要的說(shuō)明和歡迎辭令 每個(gè)內(nèi)容頁(yè)應(yīng)以內(nèi)容結(jié)論或內(nèi)容意義啟示作為開端,正文以倒金字塔方式書寫 相對(duì)于敘述式的文本,網(wǎng)頁(yè)應(yīng)當(dāng)優(yōu)先使用無(wú)序列表和有序列表 列表應(yīng)當(dāng)以簡(jiǎn)短的說(shuō)明作為開始,幫助用戶意識(shí)到該列表是如何與其它關(guān)聯(lián)起來(lái)的 那些最重要的列表項(xiàng)應(yīng)當(dāng)放在列表的前面 信息應(yīng)當(dāng)分層次組織,從一般的到具體的,組織結(jié)構(gòu)應(yīng)當(dāng)是清晰的、符合邏輯的 內(nèi)容應(yīng)當(dāng)專門為互聯(lián)網(wǎng)(web)創(chuàng)建(web pages do not comprise repurposed material from print publications such as brochures) 產(chǎn)品展示頁(yè)面應(yīng)當(dāng)包含購(gòu)買須了解的信息,用戶可縮放產(chǎn)品圖片 使用超文本適當(dāng)?shù)亟M織內(nèi)容 以主動(dòng)語(yǔ)態(tài)書寫語(yǔ)句 網(wǎng)頁(yè)應(yīng)當(dāng)易于快速瀏覽,充分使用標(biāo)題、副標(biāo)題和較短的段落 相對(duì)于文本式的語(yǔ)言,優(yōu)先使用地圖、圖表、圖形、流程圖和其它視覺元素 每個(gè)網(wǎng)頁(yè)都應(yīng)有描述信息,以及有用的標(biāo)題,用以支持書簽 鏈接及鏈接描述(title)應(yīng)當(dāng)具有描述性或推測(cè)性,不應(yīng)當(dāng)出現(xiàn)“點(diǎn)擊我(click here)”這樣的鏈接 標(biāo)題不應(yīng)當(dāng)故作風(fēng)雅、故作聰明或含義隱晦 鏈接文本應(yīng)當(dāng)與目標(biāo)頁(yè)面的標(biāo)題(title)相符,這樣用戶就可以在到達(dá)目標(biāo)頁(yè)面時(shí)心里有數(shù) 按鈕文本及鏈接文本以動(dòng)詞開頭 標(biāo)題和副標(biāo)題應(yīng)當(dāng)是簡(jiǎn)短的、直截了當(dāng)?shù)摹⒕哂忻枋鲂缘? 遣詞造句及用到的概念應(yīng)當(dāng)為典型用戶所熟悉 有序列表從1開始,而不是0 第一次使用的縮寫詞匯應(yīng)當(dāng)加以說(shuō)明 [li]文本鏈接應(yīng)當(dāng)足夠長(zhǎng)以便于理解、又應(yīng)當(dāng)足夠短以保證最少換行(尤其被用作導(dǎo)航列表時(shí)) [/li] [p][b]頁(yè)面布局和可視設(shè)計(jì)[/b][/p] 網(wǎng)線數(shù)應(yīng)當(dāng)適于目標(biāo)用戶和他們的任務(wù) 布局可以幫助用戶把注意力集中在下一步要做的東西上 在所有頁(yè)面,最重要的信息(例如經(jīng)常用的主題、特色和功能)放在屏幕的第一個(gè)滿屏 網(wǎng)站在不水平滾動(dòng)的情況下就可以使用 可點(diǎn)擊的元素(例如按鈕),應(yīng)當(dāng)設(shè)計(jì)成明顯可點(diǎn)擊的樣子 不能點(diǎn)擊的元素 按鈕或控件的功能從他們的標(biāo)簽或設(shè)計(jì)上就可以明顯看出來(lái) 可點(diǎn)擊圖片包含多余文本標(biāo)簽(clickable images include redundant text labels (i.e. there is no ‘mystery meat’ navigation)) 超文本鏈接可以輕松被辨認(rèn)(例如下劃線),而不需要大面積掃視。 網(wǎng)站字體使用應(yīng)當(dāng)具有一致性 控件和它所具備的操作之間的關(guān)系是顯而易見的 圖標(biāo)和圖形是標(biāo)準(zhǔn)的和(或)直觀的(具體的和為人熟悉的) 在每一個(gè)頁(yè)面上都應(yīng)有一個(gè)清晰的視覺“起點(diǎn)” 網(wǎng)站的每個(gè)頁(yè)面共享一致的布局 網(wǎng)頁(yè)為打印格式化,或者有一個(gè)為打印準(zhǔn)備的版本 按鈕或鏈接能顯示出他們被點(diǎn)擊過(guò)了 圖形用戶界面(gui)組件(例如單選按鈕和復(fù)選框)應(yīng)當(dāng)被適當(dāng)?shù)厥褂? 所用字體應(yīng)當(dāng)是可閱讀的 網(wǎng)站應(yīng)當(dāng)避免使用斜體字,并只為超文本添加下劃線 信息密度和留白應(yīng)當(dāng)有一個(gè)良好的平衡 網(wǎng)站看上去應(yīng)是讓人愉悅的 網(wǎng)頁(yè)應(yīng)避免出現(xiàn)“滾動(dòng)障礙物(scroll stoppers)”(標(biāo)題或其它頁(yè)面元素給用戶造成在頁(yè)面頂部或底部的錯(cuò)覺) 網(wǎng)站應(yīng)當(dāng)避免大量使用大寫文本 網(wǎng)站應(yīng)當(dāng)有一致性的、清晰可識(shí)別的外觀和感覺,以吸引用戶 深藍(lán)色避免使用在細(xì)節(jié)地方(saturated blue is avoided for fine detail)(例如文本、細(xì)線和符號(hào)) 借助顏色組織和分組頁(yè)面元素 網(wǎng)站圖形不應(yīng)當(dāng)與banner廣告混雜不清 對(duì)于重要的主題分類加重顯示(em) 在標(biāo)準(zhǔn)寬度的瀏覽器窗口中,內(nèi)容頁(yè)面一行不要太短(小于50字)也不要太長(zhǎng)(大于100字) 頁(yè)面依據(jù)柵格設(shè)計(jì),所有頁(yè)面元素和部件水平對(duì)齊、垂直對(duì)齊 有意義的文本標(biāo)簽,令人印象深刻的背景配色,邊框和留白的恰當(dāng)使用,這些一起來(lái)幫助用戶把網(wǎng)頁(yè)元素分別出不相關(guān)聯(lián)的功能區(qū)域 網(wǎng)頁(yè)配色合理搭配,避免過(guò)于復(fù)雜的背景設(shè)計(jì)/li> 較為獨(dú)立的網(wǎng)頁(yè)應(yīng)當(dāng)避免雜亂不相干的信息 標(biāo)準(zhǔn)頁(yè)面元素(例如頁(yè)面標(biāo)題、站點(diǎn)導(dǎo)航、頁(yè)面導(dǎo)航、隱私策略等)可輕松找到 組織logo放置在每個(gè)頁(yè)面的相同位置,點(diǎn)擊logo后返回最合情理的頁(yè)面(比如首頁(yè)) 吸引人注意力的特色元素(例如動(dòng)畫、醒目的色調(diào)、明顯的字體大小差異)應(yīng)當(dāng)保守的使用,并只在恰當(dāng)?shù)牡胤绞褂? 圖標(biāo)(icons)要在視覺上和概念上有所區(qū)分,但又要與頁(yè)面和諧。 [li]相關(guān)信息和功能集中放置,每一組可以在一個(gè)視野瀏覽到(大約直徑為4.4厘米的屏幕區(qū)域) [/li][b]搜索可用性[/b] 默認(rèn)搜索應(yīng)當(dāng)是可以直觀地配置(沒(méi)有布爾操作符no boolean operators) 在搜索結(jié)果頁(yè)面向用戶展示搜索到的內(nèi)容,并且在該頁(yè)可以編輯檢索詞并重新提交搜索 檢索結(jié)果應(yīng)是清晰地、有用的、并依據(jù)相關(guān)度分級(jí) 檢索結(jié)果頁(yè)面應(yīng)清晰告訴用戶檢索到多少條記錄,每一頁(yè)顯示的記錄數(shù)可以由用戶配置 如果沒(méi)有返回結(jié)果,系統(tǒng)依據(jù)用戶輸入的檢索詞存在的可辨認(rèn)問(wèn)題提供建議和可選輸入項(xiàng) 搜索引擎可以優(yōu)雅地處理空檢索串的情況 最常用的檢索串可以獲得有用的結(jié)果 搜索引擎應(yīng)當(dāng)提供模板、示例或提示來(lái)幫助用戶高效使用它 網(wǎng)站應(yīng)當(dāng)包含一個(gè)功能更強(qiáng)大的搜索頁(yè)面,幫助用戶更加完善他們的檢索(可以把它叫做“修改檢索 revise search”或“精確檢索 refine search”,而非“高級(jí)檢索 advanced search”) 檢索結(jié)果頁(yè)面不顯示重復(fù)結(jié)果(無(wú)論是能感知到的重復(fù)還是實(shí)際的重復(fù)) 檢索輸入框應(yīng)當(dāng)足夠長(zhǎng),可以應(yīng)對(duì)常用檢索詞的長(zhǎng)度 檢索應(yīng)當(dāng)覆蓋整個(gè)站點(diǎn),而不是站點(diǎn)的一部分 如果網(wǎng)站允許用戶創(chuàng)建復(fù)合檢索,那么這些檢索應(yīng)當(dāng)是可保存,定期被執(zhí)行的(這樣用戶就可以跟蹤動(dòng)態(tài)信息的最新動(dòng)態(tài)) 檢索界面應(yīng)當(dāng)放置在用戶期望的地方(一般是頁(yè)面的右上區(qū)域) 檢索框及他的控件應(yīng)清晰列出(多檢索框可能會(huì)難以理解) 站點(diǎn)既可以滿足那些想隨便瀏覽的用戶,也可滿足想搜索的用戶 在檢索結(jié)果頁(yè)面應(yīng)當(dāng)明確當(dāng)前檢索的范圍,并且用戶可以約束這個(gè)范圍(如果該任務(wù)需要的話) 結(jié)果頁(yè)面顯示有用的元信息(meta-information),例如文檔的大小、創(chuàng)建的日期、文件類型(word、pdf等) 搜索引擎提供自動(dòng)的拼寫檢查,并提供復(fù)數(shù)詞和同義詞查找 [li]索索引擎提供相似檢索選項(xiàng)(例如 “更多相似” 鏈接) [/li] [p][b]幫助、反饋和容錯(cuò)[/b][/p] 常見問(wèn)題解答或在線幫助提供循序漸進(jìn)地指導(dǎo),幫助用戶完成最重要的任務(wù) 在恰當(dāng)?shù)牡胤胶颓‘?dāng)?shù)臅r(shí)間可以輕松獲取幫助 提示應(yīng)當(dāng)是簡(jiǎn)潔的、表達(dá)清楚的 用戶不需要求助于用戶手冊(cè)或其它外部信息來(lái)使用站點(diǎn) 網(wǎng)站有一個(gè)定制的404頁(yè)面,該頁(yè)面包含如何找到要找頁(yè)面的提示,并包含主頁(yè)和和檢索頁(yè)面的鏈接 網(wǎng)站在必要時(shí)(例如校驗(yàn)時(shí))提供良好的反饋信息(例如進(jìn)度提示或一些信息) 用戶在選擇商品時(shí)可獲取到幫助 用戶在執(zhí)行由潛在“危險(xiǎn)”操作(例如刪除什么)之前提供用戶確認(rèn) 用戶確認(rèn)頁(yè)面是清晰地 錯(cuò)誤信息包含先一步該做什么的清晰指示 在提交購(gòu)買的前一個(gè)時(shí)刻,網(wǎng)站向用戶清晰地展示概覽頁(yè)面,這個(gè)頁(yè)面應(yīng)當(dāng)與購(gòu)買確認(rèn)頁(yè)面區(qū)分開來(lái) 當(dāng)用戶需要在不同的選項(xiàng)(例如在一個(gè)對(duì)話框)前抉擇時(shí),這些選項(xiàng)應(yīng)當(dāng)是明確的 在網(wǎng)站響應(yīng)時(shí)間時(shí)產(chǎn)生的不可避免的延遲應(yīng)當(dāng)告知用戶(例如授權(quán)信用卡交易時(shí)) 錯(cuò)誤信息以非嘲弄的語(yǔ)氣書寫,并且不要責(zé)怪用戶的錯(cuò)誤 頁(yè)面可以快速加載(5秒或更短) 網(wǎng)站提供對(duì)用戶輸入或其他操作的及時(shí)反饋 在加載比較慢的大頁(yè)面應(yīng)當(dāng)提示用戶(例如:“正在加載……”),最重要的信息應(yīng)當(dāng)首先顯示 當(dāng)使用工具提示條(tool tips)時(shí),應(yīng)當(dāng)提示對(duì)用戶有用的額外幫助,而不是簡(jiǎn)單的重復(fù)圖標(biāo)、鏈接或字段域標(biāo)簽中的文本 當(dāng)給用戶一些幫助提示時(shí),告訴他們要做什么,而不是避免做什么 網(wǎng)站在適當(dāng)?shù)牡胤较蛴脩粽故救绾巫龀R娙蝿?wù)(例如:提供網(wǎng)站的功能示例) 網(wǎng)站通過(guò)提供反饋信息(例如“您知道嗎?”),幫助用戶了解怎樣使用網(wǎng)站 網(wǎng)站提供上下文敏感幫助 幫助應(yīng)當(dāng)是直截了當(dāng)?shù)模弥卑缀?jiǎn)單的方式表達(dá),避免使用行話和流行語(yǔ) 當(dāng)一個(gè)任務(wù)成功完成后,網(wǎng)站提供清晰地反饋信息 必要時(shí)重要提示信息應(yīng)當(dāng)在屏幕上保留,使用戶有足夠時(shí)間記錄下這些信息 遵循“菲茨法則”(控件之間的距離和控件的大小應(yīng)當(dāng)是適宜的,大小與距離成比例) 目標(biāo)對(duì)象間有足夠空間,防止用戶點(diǎn)擊了多個(gè)目標(biāo)或錯(cuò)誤的目標(biāo) 可點(diǎn)擊元素之間至少有兩個(gè)像素的距離 當(dāng)網(wǎng)站發(fā)生錯(cuò)誤時(shí),應(yīng)當(dāng)是顯而易見的(例如,當(dāng)表單未完成,高亮未完成的表單域) 網(wǎng)站提供適當(dāng)?shù)倪x擇方式(例如下拉列表)來(lái)代替用戶輸入 網(wǎng)站應(yīng)努力把防止用戶出錯(cuò)的工作做好 網(wǎng)站在糾正用戶錯(cuò)誤輸入前提示用戶(例如,google的“您是不是要查找…”) 網(wǎng)站應(yīng)當(dāng)確保任務(wù)不是令人困惑的 錯(cuò)誤信息應(yīng)當(dāng)用直白的語(yǔ)言描述,并給與問(wèn)題足夠的解釋 用戶在一個(gè)任務(wù)中可以推遲解決錯(cuò)誤至一個(gè)較晚的時(shí)間 如果有必要的話,網(wǎng)站提供錯(cuò)誤信息更多的細(xì)節(jié) [li]可以非常容易撤銷(或取消)、重做(redo)操作 [/li] [p]延伸閱讀:[/p] [url=http://blueidea.com/tech/web/2009/6836.asp]使用jquery及bing api實(shí)現(xiàn)簡(jiǎn)易搜索引擎[/url] [url=http://css9.net/web-develop-chmhandbook/]從w3c school整理的最全的web開發(fā)chm手冊(cè)[/url] [url=http://css9.net/chinese-css-cheat-sheet/]css中文速查表(css cheat sheet)[/url] [url=http://css9.net/google-api-all-in-one-book/]好書推薦:《google api大全:編程·開發(fā)·實(shí)例》,即將上市[/url] [li][url=http://css9.net/highlight-%20-and-jquery-solution/]實(shí)現(xiàn)文字高亮功能的兩種解決方案(javascript/jquery)[/url][/li] 該文章在 2010/7/3 16:14:20 編輯過(guò) |
關(guān)鍵字查詢
相關(guān)文章
正在查詢... |