來源:派臣科技|時間:2019-01-05|瀏覽:次
網(wǎng)站設(shè)計是一個棘手的話題。當(dāng)你創(chuàng)立網(wǎng)站時你需要思考許多事宜。為了簡化這個任務(wù),我這里籌備了一個列表,每個網(wǎng)站設(shè)計師在設(shè)計網(wǎng)頁時都應(yīng)當(dāng)思考這些留意事宜。好消息是,這都是有些簡易的設(shè)計原則。
應(yīng)當(dāng)做什么:
1.不管設(shè)備怎樣,都應(yīng)當(dāng)提供相同的客戶體驗
客戶會操作不同的設(shè)備來訪問你的網(wǎng)站:他們可通過臺式電腦或筆記本電腦,平板電腦,手機(jī),音樂播放器甚至手表上訪問您的網(wǎng)站。UX設(shè)計很關(guān)鍵的一部分是要確??蛻魬?yīng)當(dāng)具備類似的客戶體驗,不論他們是通過什么來訪問你的網(wǎng)站,不論他們是操作怎樣的設(shè)備。
如果客戶是通過手機(jī)訪問你的網(wǎng)站,他們應(yīng)當(dāng)能毫不費(fèi)勁的找到他們需要的所有東西,就像他們在家里通過桌面端查看你的網(wǎng)站一樣。
2.設(shè)計一個簡潔,易用的導(dǎo)航
導(dǎo)航是可用性的基石。請記住,這不關(guān)乎于一個網(wǎng)頁設(shè)計的有多好,但必須確??蛻艨赏ㄟ^自己的方式實行瀏覽。這就是為何你的網(wǎng)站上的導(dǎo)航應(yīng)當(dāng)設(shè)計成這樣。
?簡易(每個站點都應(yīng)當(dāng)有最簡易的構(gòu)架)
?簡潔(導(dǎo)航選項對訪客而言必須清楚易懂)
?統(tǒng)一(首頁的導(dǎo)航系統(tǒng)應(yīng)當(dāng)在每個頁面上都一樣)
設(shè)計導(dǎo)航方式,盡可能減輕點擊次數(shù)而幫助客戶到達(dá)他們想去的網(wǎng)頁。同時,應(yīng)易于瀏覽并能輕松找到他們想去的地方。
3.更改已訪問鏈接的顏色
鏈接是導(dǎo)航進(jìn)程中的關(guān)鍵原因。當(dāng)已訪問的鏈接沒有改變顏色時,客戶可能會無意中重復(fù)訪問相同的頁面。
理解客戶已訪問過哪些頁面能夠防止讓他無意中重復(fù)訪問相同的頁面。
4.輕易瀏覽你的頁面
當(dāng)客戶訪問你的網(wǎng)站時,他們更有可能火速掃描屏幕,而不是閱讀頁面的所有內(nèi)容。因此,如果訪問者想要查找內(nèi)容或完成某項任務(wù),他們將總是瀏覽直到找到他們需要的內(nèi)容。而作為設(shè)計師,你能夠通過設(shè)計好的視覺層次構(gòu)架來幫助他們。視覺層次構(gòu)架是指以暗示必要性的方式安排或體現(xiàn)元素(例如,他們的眼睛應(yīng)當(dāng)集中在哪了?第一、第二等)
將屏幕標(biāo)題,登錄表單,導(dǎo)航項目或其他緊要內(nèi)容等緊要內(nèi)容標(biāo)記難點,以便訪問者可立即查看。
5.仔細(xì)檢查所有鏈接
當(dāng)客戶點擊站點上的鏈接并收到提醒 404謬誤頁面時,客戶可能很容易變?yōu)榫趩?。?dāng)訪問者正在搜索內(nèi)容時,他們希望每個鏈接都能夠?qū)⑺鼈儙蛩傅牡胤?,而不是出現(xiàn) 404謬誤的提醒或者其他有些他們不想去的地方。
6.確保可點擊的元素對客戶顯而易見
一個物體的外觀可告知客戶怎樣操作它。視覺元素看起來像是鏈接或按鈕,但不可點擊(即,有下劃線的單詞沒有鏈接,具備文字動作的元素,但不是超鏈接)這樣很有可能會操作戶混淆。客戶需要知曉頁面的哪些區(qū)域是純靜態(tài)內(nèi)容,哪些區(qū)域是可點擊的。
應(yīng)讓客戶明白哪些是可點擊的元素
橙色的盒子是一個按鈕嗎?結(jié)論是:不。形狀和標(biāo)簽使其看起來像一個按鈕,但它不是。
不應(yīng)當(dāng)做什么:
1.讓你的訪客等待網(wǎng)頁加載
網(wǎng)頁客戶的留意力和耐心往往很差。按照NNGroup研討:
10秒是將客戶的留意力集中在此任務(wù)上的最低限度
當(dāng)訪問者必須等待你的網(wǎng)站加載時,如果你的網(wǎng)站加載速度不夠快,他們會變?yōu)榫趩剩⒖赡茈x開你的網(wǎng)站。如果加載時間過長,即使你有設(shè)計精美的加載指示器,也可能迫操作戶離開網(wǎng)站。
2.不要在新標(biāo)簽頁中打開鏈接
這種粗魯?shù)男袕綍肂ack按鈕,而這是客戶返回到之前的站點的慣例方式。
3.讓促銷掩蓋內(nèi)容
促銷和廣告能夠掩蓋他們旁邊的內(nèi)容,并操作戶更難完成任務(wù)。不要說任何看起來像廣告的東西通常會被客戶忽視(這種現(xiàn)象被稱為旗幟盲點)
4.劫持滾動
劫持滾動是設(shè)計師和開發(fā)者通過操縱滾動條來使網(wǎng)站表現(xiàn)的不同。包含動畫效益,固定滾動點,甚至滾動條本身的重新設(shè)計。被劫持滾動是眾多客戶最煩人的事宜之一,由于其不受客戶控制。當(dāng)你設(shè)計網(wǎng)站或客戶界面時,你希望讓客戶通過網(wǎng)站或應(yīng)用程序掌控其瀏覽速度和移動。
MacPro頁面操作有些令人煩惱的滾動效益。它操作單頁視差部署,其中的點表示頁面的每個部分。
5.用聲音自動播放視頻
在后臺自動播放視頻,音樂或聲音會刺激客戶。這些元素應(yīng)慎重操作,只有在適當(dāng)?shù)臅r候和可預(yù)期的情形下才能操作。
Facebook視頻設(shè)立為自動播放,但不會出現(xiàn)任何聲音,除非客戶有意圖以某種方式觀看視頻(例如通過視頻實行交流)。
6.為了美而忽略可用性
站點或客戶界面的設(shè)計不應(yīng)影響客戶在屏幕上閱讀內(nèi)容的能力。緊要的是要防止內(nèi)容繁瑣,色彩不均勻,其會妨礙網(wǎng)站的可讀性或造成顏色對照度瑕疵(例如下面的示例)。
生活就是我們的老師,它會告訴我們許多的東西。
靈感源于生活,生活也帶給我們更多的革新,全美設(shè)計做懂你的設(shè)計。