POST TIME:2018-12-03 21:16
以下內(nèi)容由Mockplus團隊翻譯整理,僅供學(xué)習(xí)交流,Mockplus是更快更簡單的原型設(shè)計工具。
網(wǎng)頁設(shè)計是一個棘手的話題。當你創(chuàng)建網(wǎng)站時你需要考慮很多事情。為了簡化這個任務(wù),我這里準備了一個列表,每個網(wǎng)頁設(shè)計師在設(shè)計網(wǎng)頁時都應(yīng)該考慮這些注意事項。好消息是,這都是一些簡單的設(shè)計原則。
讓我們開始吧!
應(yīng)該做什么:
1.不管設(shè)備如何,都應(yīng)該提供相同的用戶體驗
用戶會使用差別的設(shè)備來拜候你的網(wǎng)站:他們可通過臺式電腦或條記本電腦,平板電腦,手機,音樂播放器甚至手表上拜候您的網(wǎng)站。UX設(shè)計很關(guān)鍵的一部分是要確保用戶應(yīng)該具有類似的用戶體驗,豈論他們是通過什么來拜候你的網(wǎng)站,豈論他們是使用什么樣的設(shè)備。
如果用戶是通過手機拜候你的網(wǎng)站,他們應(yīng)該能毫不費勁的找到他們需要的所有東西,就像他們在家里通過桌面端查看你的網(wǎng)站一樣。
2.設(shè)計一個簡潔,易用的導(dǎo)航
導(dǎo)航是可用性的基石。請記住,這不關(guān)乎于一個網(wǎng)站設(shè)計的有多好,但必需確保用戶可通過本身的方式進行瀏覽。這就是為什么你的網(wǎng)站上的導(dǎo)航應(yīng)該設(shè)計成這樣。
?簡單(每個站點都應(yīng)該有最簡單的結(jié)構(gòu))
?簡潔(導(dǎo)航選項對訪客而言必需清楚易懂)
?一致(主頁的導(dǎo)航系統(tǒng)應(yīng)該在每個頁面上都一樣)
設(shè)計導(dǎo)航方式,盡可能減少點擊次數(shù)而幫手用戶到達他們想去的網(wǎng)頁。同時,應(yīng)易于瀏覽并能輕易找到他們想去的地方。
3.更改已拜候鏈接的顏色
鏈接是導(dǎo)航過程中的關(guān)鍵因素。當已拜候的鏈接沒有改變顏色時,用戶可能會無意中重復(fù)拜候相同的頁面。
了解用戶已拜候過哪些頁面可以制止讓他無意中重復(fù)拜候相同的頁面。
4.輕松瀏覽你的頁面
當用戶拜候你的網(wǎng)站時,他們更有可能快速掃描屏幕,而不是閱讀頁面的所有內(nèi)容。因此,如果拜候者想要查找內(nèi)容或完成某項任務(wù),他們將一直瀏覽直到找到他們需要的內(nèi)容。而作為設(shè)計師,你可以通過設(shè)計好的視覺層次結(jié)構(gòu)來幫手他們。視覺層次結(jié)構(gòu)是指以暗示重要性的方式擺設(shè)或呈現(xiàn)元素(例如,他們的眼睛應(yīng)該集中在哪了? 第一、第二等)
將屏幕標題,登錄表單,導(dǎo)航項目或其他重要內(nèi)容等重要內(nèi)容標記重點,以便拜候者可立即查看。
Basecamp使用的Z掃描模式
5.仔細檢查所有鏈接
當用戶點擊站點上的鏈接并收到提示 404 錯誤頁面時,用戶可能很容易變得沮喪。當拜候者正在搜索內(nèi)容時,他們希望每個鏈接都可以將它們帶向所指的地方,而不是出現(xiàn) 404 錯誤的提示或者其他一些他們不想去的地方。
6.確保可點擊的元素對用戶顯而易見
一個物體的外不雅觀可告知用戶如何使用它。視覺元素看起來像是鏈接或按鈕,但不成點擊(即,有下劃線的單詞沒有鏈接,具有文字動作的元素,但不是超鏈接)這樣很有可能會使用戶混淆。用戶需要知道頁面的哪些區(qū)域是純靜態(tài)內(nèi)容,哪些區(qū)域是可點擊的。
應(yīng)讓用戶明白哪些是可點擊的元素
橙色的盒子是一個按鈕嗎?答案是:不。形狀和標簽使其看起來像一個按鈕,但它不是。
不該該做什么:
1.讓你的訪客等待網(wǎng)頁加載
網(wǎng)頁用戶的注意力和耐心往往很差。按照NNGroup研究:
10 秒是將用戶的注意力集中在此任務(wù)上的最低限度
當拜候者必需等待你的網(wǎng)站加載時,如果你的網(wǎng)站加載速度不夠快,他們會變得沮喪,并可能離開你的網(wǎng)站。如果加載時間過長,即使你有設(shè)計精美的加載指示器,也可能迫使用戶離開網(wǎng)站。
2.不要在新標簽頁中打開鏈接
這種粗魯?shù)男袨闀肂ack按鈕,而這是用戶返回到以前的站點的常規(guī)方式。
3.讓促銷掩蓋內(nèi)容
促銷和廣告可以掩蓋他們旁邊的內(nèi)容,并使用戶更難完成任務(wù)。不要說任何看起來像廣告的東西通常會被用戶忽略(這種現(xiàn)象被稱為旗幟盲點)
4.劫持滾動