以下內容由寶雞網(wǎng)絡(luò )公司，寶雞世紀網(wǎng)絡(luò )為您搜集整理。

在接下來(lái)的案例中，我們將展示那些設計得漂亮但可用性差的網(wǎng)站?？捎眯圆畹脑虬ǎ翰季只靵y不堪，載入速度過(guò)慢，導航識別性差。盡管這些網(wǎng)站在視覺(jué)設計上很有特色，但功虧一簣,他們可用性的確很差。讓我們研究下這些失敗的案例避免出現在自己的設計中出現這種典型錯誤。

雜亂無(wú)序的設計

我看到的是什么網(wǎng)站？我要在那里點(diǎn)擊？接下來(lái)我該怎么做？設計的雜亂無(wú)序是給訪(fǎng)客最糟糕的印象。訪(fǎng)客不知道設計師所要表達的意圖(因為都被隱藏在了雜亂無(wú)序的設計中)，從而導致訪(fǎng)客在未做任何動(dòng)作之前就要關(guān)閉該網(wǎng)頁(yè)。

導航信息超載

不僅我們不知道要看什么，甚至都不知道應該點(diǎn)擊那里。通過(guò)鼠標掃描方式查找可點(diǎn)擊區域無(wú)助于提升網(wǎng)站的易用性。并且，整個(gè)網(wǎng)站的載入過(guò)程連個(gè)進(jìn)度條都沒(méi)有。而且更令哥震驚的是，還要花時(shí)間搞清楚必須關(guān)閉歡迎的窗口才可以點(diǎn)擊頁(yè)面其他地方。欄目里缺少滾動(dòng)條的內容讓哥對藏在里面的內容頓時(shí)失去了興趣。

即便是已經(jīng)閱讀”關(guān)于我們”頁(yè)面并文字里有許多的隨機鏈接，哥還是很疑惑這個(gè)頁(yè)面到底是不是打醬油用的。最合適的猜測可能這是個(gè)人介紹頁(yè)面，而亂七八糟的鏈接和找不到導航欄，哥只能帶著(zhù)困惑和不解離開(kāi)這個(gè)網(wǎng)站。

有一半的圈圈看上去是可以點(diǎn)的，實(shí)際上卻不能。如果拖拽一個(gè)圈圈，它會(huì )跳到其他圓圈中去。當然，這些坑爹的圈圈動(dòng)畫(huà)效果充分的體現出公司比較xxx的理念，這明顯有些過(guò)度了嘛！用58秒等待一個(gè)動(dòng)畫(huà)的確太漫長(cháng)了。并且，如果你想需要更多的圈圈，點(diǎn)擊或拖拉空白區域就會(huì )出來(lái)，同時(shí)也帶給訪(fǎng)問(wèn)者更多迷惑。

加載問(wèn)題

隨著(zhù)跳出率上升，頁(yè)面停留時(shí)間變得越來(lái)越短。能立即抓住訪(fǎng)問(wèn)者眼球就變得尤為重要。網(wǎng)站加載時(shí)間越長(cháng)，訪(fǎng)問(wèn)者返回google或facebook尋找下一個(gè)合適網(wǎng)站可能性也就越大。加載時(shí)間、跳過(guò)按鈕、無(wú)固定導航欄與其他部分都是我們需要思考的點(diǎn)。

這是另一個(gè)很糟糕的情況，flash設計師強迫用戶(hù)看介紹動(dòng)畫(huà)。沒(méi)有跳過(guò)按鈕的介紹動(dòng)畫(huà)會(huì )讓訪(fǎng)問(wèn)者在進(jìn)入網(wǎng)站前就放棄訪(fǎng)問(wèn)。點(diǎn)擊又沒(méi)立即響應的按鈕或是視覺(jué)上不像是導航欄的設計將導致訪(fǎng)問(wèn)者失去興致繼續訪(fǎng)問(wèn)即便是足夠漂亮的網(wǎng)站。該網(wǎng)站花費許多周折浪費訪(fǎng)客的時(shí)間才能回到首頁(yè)將給人感覺(jué)進(jìn)行次”世界之旅”。在網(wǎng)站地圖里需要查找隱藏在里面的許多泡泡。

哥從未見(jiàn)到過(guò)加載問(wèn)題如此之杯具的網(wǎng)站。多重加載元素，即使你看到了網(wǎng)頁(yè)內容實(shí)際上還有東西要再次加載。也沒(méi)有跡象可以表示加載結束了，這樣做也讓哥非常的困惑不解并且該網(wǎng)站還不易使用。事實(shí)上，找到閱讀的內容也需要花些功夫，而網(wǎng)站在牛奶卡通包裝盒所做的效果與內容根本沒(méi)有毛關(guān)系嘛。

進(jìn)入網(wǎng)站要花很長(cháng)時(shí)間痛苦的等待，如果接下來(lái)打開(kāi)的網(wǎng)站足夠漂亮，易用性再好些也算是能接受的?？上?，打開(kāi)頁(yè)面后哥徹底傻眼了，里面每張圖片還要繼續下載，我去！并且還要強迫看模糊圖片。更好的改進(jìn)是，加載圖片時(shí)有加載進(jìn)度條示意正在加載中。如果訪(fǎng)客的帶寬足夠也許問(wèn)題還不算嚴重。但如果不是，那么訪(fǎng)客很快就會(huì )變得抓狂起來(lái)。還有那個(gè)返回按鈕不夠明顯，這也讓哥覺(jué)得這個(gè)網(wǎng)站很杯具。

導航欄

對于那些信息量大或是欄目結構復雜的網(wǎng)站來(lái)說(shuō)，良好的導航顯得尤為重要。你可以想象沒(méi)有地圖的情況下開(kāi)車(chē)或在沒(méi)有標簽的雜貨鋪里購物有多么困難。導航欄會(huì )告訴我們應該去那里，而在下面的案例中的網(wǎng)站導航幾乎沒(méi)有提供任何有用的信息。你甚至可以考慮帶個(gè)指南針了，因為這些案例實(shí)在是太容易讓人迷失方向了。

經(jīng)過(guò)漫長(cháng)的加載后，網(wǎng)站需要訪(fǎng)客點(diǎn)擊”進(jìn)入”按鈕。好吧，我們點(diǎn)它下。盡管網(wǎng)站上有坨快捷菜單，但很不幸的是這坨菜單并沒(méi)有引起訪(fǎng)客的注意。并且，訪(fǎng)客需要將鼠標挪到圖片上才能查看子類(lèi)目。而這些導航按鈕需要訪(fǎng)客非常仔細的查找才行。

易用性差的網(wǎng)站通常都有同樣的通病。當哥在這么漂亮的網(wǎng)站上看不到導航時(shí)，就不得不用鼠標亂戳的方式查找鏈接。這個(gè)網(wǎng)站很漂亮但也非常復雜，復雜到我們需要花費一個(gè)小時(shí)來(lái)找鏈接，但你可能都猜不到點(diǎn)擊跟隨鼠標的圖標方式進(jìn)入網(wǎng)站。并且，這個(gè)網(wǎng)站除了令人印象深刻的設計之外就沒(méi)提供個(gè)毛內容出來(lái)！

緩慢的加載導致訪(fǎng)客不明白接下來(lái)要做點(diǎn)啥：導航欄的視覺(jué)不清晰與難以發(fā)現的返回按鈕問(wèn)題一樣嚴重。哥很疑惑：當訪(fǎng)問(wèn)該豐田網(wǎng)站時(shí)到底要傳遞給訪(fǎng)客什么樣的概念呢？

無(wú)跳過(guò)介紹的按鈕。無(wú)視覺(jué)清晰的導航欄。加載很慢。而牛x的是頁(yè)面與播放的背景音樂(lè )竟然是分開(kāi)的。當網(wǎng)速快的訪(fǎng)客訪(fǎng)問(wèn)網(wǎng)站時(shí)，網(wǎng)站的動(dòng)畫(huà)都可能引起訪(fǎng)客的反感。

構架與目錄問(wèn)題

你的網(wǎng)站加載情況良好，你知道訪(fǎng)客來(lái)你網(wǎng)站想做什么，你的網(wǎng)站有固定的導航。但訪(fǎng)客一旦進(jìn)入你的網(wǎng)站卻無(wú)法知道你的目錄結構。就好比，要吃肉就應該去肉食店，而不是牛奶店。很不幸的是，有些網(wǎng)站就是這么干的。

隱藏的菜單與類(lèi)目不清楚導致網(wǎng)站導航難以使用。當訪(fǎng)客想找到他想了解的類(lèi)目將會(huì )是非常困難的。

該網(wǎng)站的類(lèi)目由豎條折疊而成。當哥點(diǎn)擊時(shí)卻提供了非常少的信息。如果是第一次訪(fǎng)問(wèn)該網(wǎng)站，可能需要花點(diǎn)時(shí)間才能找出你需要的東西。

該網(wǎng)站的確告訴我們要”點(diǎn)擊與拖拽”，但這個(gè)區域看上去更像是份海報，我很懷疑到底會(huì )有多少人知道那里是可以點(diǎn)擊的。該網(wǎng)站也的確的意識到了上面說(shuō)的這一點(diǎn)，于是在頁(yè)面頂部創(chuàng )建了菜單。但有多大的幾率會(huì )被人看到呢？

這是另一個(gè)視覺(jué)效果很好但由于糟糕的用戶(hù)體驗會(huì )引起訪(fǎng)客不爽的案例。網(wǎng)站上沒(méi)有固定的導航欄，而只是浮動(dòng)的頭部。如果要找到聯(lián)系方式，需要到左下角點(diǎn)擊”Information”（信息）。使用更傳統的方式將有助于提升訪(fǎng)客體驗：例如，放一個(gè)電子郵箱或是將文案改為”contact information”（聯(lián)系信息），亦或是在頁(yè)面底部添加聯(lián)系方式。這是典型的通過(guò)細節提升用戶(hù)體驗的方式。

可視化與滾動(dòng)條

即便是網(wǎng)站布局并不混亂，導航也十分清晰。但如果關(guān)閉了鼠標交互效果或頁(yè)面不能滾動(dòng)了，那也就意味著(zhù)無(wú)人可以看到這些內容了。原本可見(jiàn)的元素因為變?yōu)椴豢梢?jiàn)會(huì )導致訪(fǎng)客直接離開(kāi)你的網(wǎng)站。

除非你用鼠標點(diǎn)擊不同的區域，否則可點(diǎn)擊元素是根本看不見(jiàn)的。點(diǎn)擊某個(gè)區域后又是長(cháng)時(shí)間的等待，點(diǎn)擊后額外增加的效果也在考驗訪(fǎng)客跳出網(wǎng)站的幾率。

網(wǎng)頁(yè)的滾動(dòng)通常是從左至右，從上到下。而這個(gè)坑爹的網(wǎng)站卻是從網(wǎng)頁(yè)底部開(kāi)始。加上不能關(guān)閉的關(guān)閉按鈕和其他些小問(wèn)題，你會(huì )覺(jué)得樂(lè )高這個(gè)網(wǎng)站很莫名其妙（雖然設計很漂亮）。

該網(wǎng)站非常巨大，但事實(shí)上你打開(kāi)后根本就不可能知道這個(gè)情況。拖動(dòng)滾動(dòng)條后也沒(méi)有提示信息，就離開(kāi)內容區域。如果你拖拉滾動(dòng)條太快甚至都可以跑出網(wǎng)站設計部分。而且，回到內容部分也很麻煩。該網(wǎng)站的設計好但也太難用了吧。

這是另一個(gè)設計漂亮，但卻導航無(wú)鼠標交互效果或提示信息。

優(yōu)衣庫網(wǎng)站看上去很美觀(guān)也很易用。但直到訪(fǎng)客添加10件商品到購物車(chē)才發(fā)覺(jué)無(wú)法結賬。而事實(shí)上這根本就不是購物車(chē)而是愿望清單。該體驗完完全全的把每個(gè)使用過(guò)的用戶(hù)都給坑了。

這是另一個(gè)拖動(dòng)方式進(jìn)行導航的網(wǎng)站，很顯然它對于這種導航方式自我感覺(jué)非常良好。從視覺(jué)/樂(lè )趣角度來(lái)說(shuō)是個(gè)好網(wǎng)站，但設計公司設計了用戶(hù)體驗很糟糕的導航方式：必須要使用鼠標滾輪才能看到比首屏更多的內容。

小結

設計要服務(wù)于網(wǎng)站功能以及訪(fǎng)客溝通。如果你的網(wǎng)站同時(shí)也能夠達到美觀(guān)，那就一舉兩得了。設計得美觀(guān)漂亮僅當網(wǎng)站首要任務(wù)是視覺(jué)美觀(guān)才適用。

注意那些無(wú)序的排版，尤其是在導航欄與訪(fǎng)客首次訪(fǎng)問(wèn)的頁(yè)面。設計的排版過(guò)于雜亂無(wú)序會(huì )導致訪(fǎng)客不知道如何使用你的網(wǎng)站。最糟糕的可能是訪(fǎng)客在首個(gè)頁(yè)面沒(méi)有打開(kāi)就走掉了。網(wǎng)站訪(fǎng)客不喜歡等待。確保網(wǎng)站的加載速度快，并且能讓訪(fǎng)客知道可以加載完畢所花費的時(shí)間。減少訪(fǎng)客流失的最小風(fēng)險是一打開(kāi)網(wǎng)頁(yè)就能夠吸引他們的注意。

一旦訪(fǎng)客訪(fǎng)問(wèn)，你希望他們訪(fǎng)問(wèn)你網(wǎng)站上的某個(gè)頁(yè)面。確保訪(fǎng)客可以輕松找到你的導航欄，以及每個(gè)導航元素的動(dòng)作。不要讓訪(fǎng)客猜測或胡亂點(diǎn)擊尋找鏈接。在有許多內容的的大網(wǎng)站，信息構架與組織尤為重要。要確保訪(fǎng)客可以瀏覽你的內容。確保菜單易識別，節省訪(fǎng)客的時(shí)間，讓訪(fǎng)客知道導航可用。

我公司是在寶雞市工商局注冊的專(zhuān)業(yè)提供網(wǎng)站建設、網(wǎng)站優(yōu)化、網(wǎng)站推廣，軟件開(kāi)發(fā)的高新技術(shù)企業(yè)， 一直致力于面向寶雞地區黨政機關(guān)、企事業(yè)單位提供大中型門(mén)戶(hù)網(wǎng)站解決方案、 OA 辦公自動(dòng)化系統解決方案，以及中小型應用軟件開(kāi)發(fā)及其它信息化外包業(yè)務(wù)。目前已承建寶雞地區近630多家政府網(wǎng)站、企業(yè)網(wǎng)站，是寶雞網(wǎng)站建設行業(yè)規模最大、客戶(hù)數量最多、技術(shù)力量雄厚的寶雞網(wǎng)絡(luò )公司。歡迎您來(lái)電咨詢(xún)，咨詢(xún)熱線(xiàn)：0917-3535180 3536690……