剖析網頁設計中典型錯誤 |
作者:佚名 發布時間:2012-03-03 瀏覽:1982次 |
以下內容由寶雞網絡公司,寶雞世紀網絡為您搜集整理。 在接下來的案例中,我們將展示那些設計得漂亮但可用性差的網站。可用性差的原因包括:布局混亂不堪,載入速度過慢,導航識別性差。盡管這些網站在視覺設計上很有特色,但功虧一簣,他們可用性的確很差。讓我們研究下這些失敗的案例避免出現在自己的設計中出現這種典型錯誤。 雜亂無序的設計 我看到的是什么網站?我要在那里點擊?接下來我該怎么做?設計的雜亂無序是給訪客最糟糕的印象。訪客不知道設計師所要表達的意圖(因為都被隱藏在了雜亂無序的設計中),從而導致訪客在未做任何動作之前就要關閉該網頁。 導航信息超載 不僅我們不知道要看什么,甚至都不知道應該點擊那里。通過鼠標掃描方式查找可點擊區域無助于提升網站的易用性。并且,整個網站的載入過程連個進度條都沒有。而且更令哥震驚的是,還要花時間搞清楚必須關閉歡迎的窗口才可以點擊頁面其他地方。欄目里缺少滾動條的內容讓哥對藏在里面的內容頓時失去了興趣。 即便是已經閱讀”關于我們”頁面并文字里有許多的隨機鏈接,哥還是很疑惑這個頁面到底是不是打醬油用的。最合適的猜測可能這是個人介紹頁面,而亂七八糟的鏈接和找不到導航欄,哥只能帶著困惑和不解離開這個網站。 有一半的圈圈看上去是可以點的,實際上卻不能。如果拖拽一個圈圈,它會跳到其他圓圈中去。當然,這些坑爹的圈圈動畫效果充分的體現出公司比較xxx的理念,這明顯有些過度了嘛!用58秒等待一個動畫的確太漫長了。并且,如果你想需要更多的圈圈,點擊或拖拉空白區域就會出來,同時也帶給訪問者更多迷惑。 加載問題 隨著跳出率上升,頁面停留時間變得越來越短。能立即抓住訪問者眼球就變得尤為重要。網站加載時間越長,訪問者返回google或facebook尋找下一個合適網站可能性也就越大。加載時間、跳過按鈕、無固定導航欄與其他部分都是我們需要思考的點。 這是另一個很糟糕的情況,flash設計師強迫用戶看介紹動畫。沒有跳過按鈕的介紹動畫會讓訪問者在進入網站前就放棄訪問。點擊又沒立即響應的按鈕或是視覺上不像是導航欄的設計將導致訪問者失去興致繼續訪問即便是足夠漂亮的網站。該網站花費許多周折浪費訪客的時間才能回到首頁將給人感覺進行次”世界之旅”。在網站地圖里需要查找隱藏在里面的許多泡泡。 哥從未見到過加載問題如此之杯具的網站。多重加載元素,即使你看到了網頁內容實際上還有東西要再次加載。也沒有跡象可以表示加載結束了,這樣做也讓哥非常的困惑不解并且該網站還不易使用。事實上,找到閱讀的內容也需要花些功夫,而網站在牛奶卡通包裝盒所做的效果與內容根本沒有毛關系嘛。 進入網站要花很長時間痛苦的等待,如果接下來打開的網站足夠漂亮,易用性再好些也算是能接受的??上?,打開頁面后哥徹底傻眼了,里面每張圖片還要繼續下載,我去!并且還要強迫看模糊圖片。更好的改進是,加載圖片時有加載進度條示意正在加載中。如果訪客的帶寬足夠也許問題還不算嚴重。但如果不是,那么訪客很快就會變得抓狂起來。還有那個返回按鈕不夠明顯,這也讓哥覺得這個網站很杯具。 導航欄 對于那些信息量大或是欄目結構復雜的網站來說,良好的導航顯得尤為重要。你可以想象沒有地圖的情況下開車或在沒有標簽的雜貨鋪里購物有多么困難。導航欄會告訴我們應該去那里,而在下面的案例中的網站導航幾乎沒有提供任何有用的信息。你甚至可以考慮帶個指南針了,因為這些案例實在是太容易讓人迷失方向了。 經過漫長的加載后,網站需要訪客點擊”進入”按鈕。好吧,我們點它下。盡管網站上有坨快捷菜單,但很不幸的是這坨菜單并沒有引起訪客的注意。并且,訪客需要將鼠標挪到圖片上才能查看子類目。而這些導航按鈕需要訪客非常仔細的查找才行。 易用性差的網站通常都有同樣的通病。當哥在這么漂亮的網站上看不到導航時,就不得不用鼠標亂戳的方式查找鏈接。這個網站很漂亮但也非常復雜,復雜到我們需要花費一個小時來找鏈接,但你可能都猜不到點擊跟隨鼠標的圖標方式進入網站。并且,這個網站除了令人印象深刻的設計之外就沒提供個毛內容出來! 緩慢的加載導致訪客不明白接下來要做點啥:導航欄的視覺不清晰與難以發現的返回按鈕問題一樣嚴重。哥很疑惑:當訪問該豐田網站時到底要傳遞給訪客什么樣的概念呢? 無跳過介紹的按鈕。無視覺清晰的導航欄。加載很慢。而牛x的是頁面與播放的背景音樂竟然是分開的。當網速快的訪客訪問網站時,網站的動畫都可能引起訪客的反感。 構架與目錄問題 你的網站加載情況良好,你知道訪客來你網站想做什么,你的網站有固定的導航。但訪客一旦進入你的網站卻無法知道你的目錄結構。就好比,要吃肉就應該去肉食店,而不是牛奶店。很不幸的是,有些網站就是這么干的。 隱藏的菜單與類目不清楚導致網站導航難以使用。當訪客想找到他想了解的類目將會是非常困難的。 該網站的類目由豎條折疊而成。當哥點擊時卻提供了非常少的信息。如果是第一次訪問該網站,可能需要花點時間才能找出你需要的東西。 該網站的確告訴我們要”點擊與拖拽”,但這個區域看上去更像是份海報,我很懷疑到底會有多少人知道那里是可以點擊的。該網站也的確的意識到了上面說的這一點,于是在頁面頂部創建了菜單。但有多大的幾率會被人看到呢? 這是另一個視覺效果很好但由于糟糕的用戶體驗會引起訪客不爽的案例。網站上沒有固定的導航欄,而只是浮動的頭部。如果要找到聯系方式,需要到左下角點擊”Information”(信息)。使用更傳統的方式將有助于提升訪客體驗:例如,放一個電子郵箱或是將文案改為”contact information”(聯系信息),亦或是在頁面底部添加聯系方式。這是典型的通過細節提升用戶體驗的方式。 可視化與滾動條 即便是網站布局并不混亂,導航也十分清晰。但如果關閉了鼠標交互效果或頁面不能滾動了,那也就意味著無人可以看到這些內容了。原本可見的元素因為變為不可見會導致訪客直接離開你的網站。 除非你用鼠標點擊不同的區域,否則可點擊元素是根本看不見的。點擊某個區域后又是長時間的等待,點擊后額外增加的效果也在考驗訪客跳出網站的幾率。 網頁的滾動通常是從左至右,從上到下。而這個坑爹的網站卻是從網頁底部開始。加上不能關閉的關閉按鈕和其他些小問題,你會覺得樂高這個網站很莫名其妙(雖然設計很漂亮)。 該網站非常巨大,但事實上你打開后根本就不可能知道這個情況。拖動滾動條后也沒有提示信息,就離開內容區域。如果你拖拉滾動條太快甚至都可以跑出網站設計部分。而且,回到內容部分也很麻煩。該網站的設計好但也太難用了吧。 這是另一個設計漂亮,但卻導航無鼠標交互效果或提示信息。 優衣庫網站看上去很美觀也很易用。但直到訪客添加10件商品到購物車才發覺無法結賬。而事實上這根本就不是購物車而是愿望清單。該體驗完完全全的把每個使用過的用戶都給坑了。 這是另一個拖動方式進行導航的網站,很顯然它對于這種導航方式自我感覺非常良好。從視覺/樂趣角度來說是個好網站,但設計公司設計了用戶體驗很糟糕的導航方式:必須要使用鼠標滾輪才能看到比首屏更多的內容。 小結 設計要服務于網站功能以及訪客溝通。如果你的網站同時也能夠達到美觀,那就一舉兩得了。設計得美觀漂亮僅當網站首要任務是視覺美觀才適用。 注意那些無序的排版,尤其是在導航欄與訪客首次訪問的頁面。設計的排版過于雜亂無序會導致訪客不知道如何使用你的網站。最糟糕的可能是訪客在首個頁面沒有打開就走掉了。網站訪客不喜歡等待。確保網站的加載速度快,并且能讓訪客知道可以加載完畢所花費的時間。減少訪客流失的最小風險是一打開網頁就能夠吸引他們的注意。 一旦訪客訪問,你希望他們訪問你網站上的某個頁面。確保訪客可以輕松找到你的導航欄,以及每個導航元素的動作。不要讓訪客猜測或胡亂點擊尋找鏈接。在有許多內容的的大網站,信息構架與組織尤為重要。要確保訪客可以瀏覽你的內容。確保菜單易識別,節省訪客的時間,讓訪客知道導航可用。 我公司是在寶雞市工商局注冊的專業提供網站建設、網站優化、網站推廣,軟件開發的高新技術企業, 一直致力于面向寶雞地區黨政機關、企事業單位提供大中型門戶網站解決方案、 OA 辦公自動化系統解決方案,以及中小型應用軟件開發及其它信息化外包業務。目前已承建寶雞地區近630多家政府網站、企業網站,是寶雞網站建設行業規模最大、客戶數量最多、技術力量雄厚的寶雞網絡公司。歡迎您來電咨詢,咨詢熱線:0917-3535180 3536690…… |