有些時候,當(dāng)我滿懷期待地點開某些網(wǎng)站的時候 —— 它們的存在簡直是設(shè)計的災(zāi)難!相信我,當(dāng)你看見它們也會抓狂的。從莫名的鏈接丟失到糟糕的可用性,本文會分享一些會讓人瞬間暴走的錯誤設(shè)計。注意!千萬別讓你的用戶遇到和下面同樣的問題。
1. 缺乏對比度
網(wǎng)頁上的文字和圖片都需要具備較高的可讀性,最簡單的方法就是讓它們具有高對比度。但是許多設(shè)計師卻經(jīng)常忽視這條規(guī)則。
圖片背景與文字對比度太差,導(dǎo)致文字模糊不清無法閱讀,用戶不僅錯過這段話也錯過了你要傳達的重要內(nèi)容。
你必須保證每一個元素都與它周圍的其他元素區(qū)別開來,記住這些基本方法——色彩、空間、尺寸。合理地運用它們讓你的每個元素都清晰可見吧!
上圖的兩個對比問題——白色的文字與淺色的圖片顏色過于相近以及過小的字號都讓這段文字的可讀性變得極差。
2. 糟糕的導(dǎo)航和操作流程
當(dāng)我登陸了網(wǎng)頁的第一眼,你就得讓我明白接下來我該做哪個操作。點擊按鈕以及信息需要放在顯眼的位置——這就是為什么導(dǎo)航和菜單欄往往處于頁面的頂部。
導(dǎo)航的標(biāo)簽內(nèi)容和運行效果必須清晰直觀,當(dāng)你嘗試使用水平方向的滾動條或者其他一些不太尋常的動效設(shè)計的時候,給用戶一些暗示讓他們知道你的網(wǎng)頁如何工作吧!過于復(fù)雜的設(shè)計會讓用戶感到無所適從并放棄你的網(wǎng)站。
3. 不使用網(wǎng)格
在網(wǎng)頁設(shè)計中,有些“雜亂”也能讓人賞心悅目,不對稱是其中的一種,不使用網(wǎng)格絕對不是!
是否使用網(wǎng)格是區(qū)分設(shè)計好壞的專業(yè)指標(biāo)之一。網(wǎng)格讓一切變得清晰有組織性 —— 讓你的元素之間保持一致的適當(dāng)?shù)拈g距,你知道應(yīng)當(dāng)把你的元素放在哪兒、怎么放。網(wǎng)格幫助你確定元素的尺寸、文本的尺寸和空間,通過比例展現(xiàn)內(nèi)容的側(cè)重點。
4. 不采用響應(yīng)式設(shè)計
使用響應(yīng)式設(shè)計框架!使用響應(yīng)式設(shè)計框架!使用響應(yīng)式設(shè)計框架!重要的事情說三遍! 你的網(wǎng)頁或許需要在手機上運行,它必須要和在電腦上運行一樣流暢。
我總能遇到一些網(wǎng)站,在手機上加載出的是一整個頁面。這些網(wǎng)站并不是響應(yīng)式設(shè)計,至少沒有手機版的視圖,以至于用戶無法使用。(雖然很不常見,但那些只提供手機版視圖的網(wǎng)站也相當(dāng)讓人無奈。)
或許很多用戶和我一樣,如果我不能在手機上順利使用你的網(wǎng)站,那我也不會在我的電腦上打開它了。
5. 鏈接丟失
崩潰的鏈接是網(wǎng)頁上最讓人惱火的事之一。養(yǎng)成每年都去審核你的網(wǎng)頁上鏈接是否暢通的習(xí)慣吧!你可以手動檢查或是使用某些工具,比如website link checker.
如果你的logo并不能鏈接到你的網(wǎng)站首頁,我也會感到奇怪。logo都是要鏈接到網(wǎng)站首頁的。(以及當(dāng)處于首頁的時候,不要禁用返回按鈕。)
考慮鏈接的可用性。保證你的鏈接,特別是那些文本中的鏈接足夠明顯并且易于點擊而不造成誤操作。不要在你的文本中添加很多文字鏈接,特別是在小的移動設(shè)備屏幕上,用戶很難點擊到正確的鏈接。
6. 自動播放音樂
在網(wǎng)頁上添加聲音會很生動,可千萬別在沒有用戶提示的情況下播放音樂。
你應(yīng)當(dāng)提供給用戶一個打開/關(guān)閉音樂的按鈕,并且默認關(guān)閉。音樂或許會讓用戶驚艷,可要是用戶正處于工作環(huán)境或是心情很差的時候這么做卻適得其反。用戶需要能完全操控你的網(wǎng)頁,而自動播放的音樂卻與之背道而馳。我需要網(wǎng)頁音樂但播放必須得到我的同意,如果我沒辦法找到按鈕關(guān)閉自動播放的音樂,那只能直接關(guān)掉網(wǎng)頁。
但應(yīng)用在廣告上這倒是個不錯的招數(shù)。如果你有有聲音的內(nèi)容必須要播放,考慮放一個大的彈出式靜音按鈕。用戶往往會接受幾秒鐘的廣告時間并會去閱讀內(nèi)容。雖然這不是一個理想的方法,卻是一個比較好的解決方案。
看看上面這張頁面,它會自動播放音樂但應(yīng)當(dāng)是靜音的。再看看能不能一眼找到切換按鈕吧——按鈕太小了特別是對比其他元素它更難被找到了。
更嚴重的罪狀
沒有最糟只有更糟,下面的一些細節(jié)設(shè)計錯誤也會讓我棄之而去,別讓你自己成為這些粗心犯的錯誤的受害者了。
沒有搜索功能
語法或拼寫錯誤
沒有呼叫功能
文字中出現(xiàn)太多鏈接
連字符連接的文本
超小的按鈕
糟糕的排版和可讀性
每個人都很容易造成這些設(shè)計失誤(你在整體設(shè)計很棒的網(wǎng)站上也會發(fā)現(xiàn)這些潛在問題)。在設(shè)計和開發(fā)過程中關(guān)注這些小細節(jié),你可以成功避開這些失誤。別惹你的用戶生氣(嚴肅臉)!
當(dāng)前文章:這六種設(shè)計萬萬不能出現(xiàn)的網(wǎng)站上,否則你將追悔莫及
網(wǎng)頁URL:http://m.rwnh.cn/news16/106766.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信公眾號、網(wǎng)站收錄、響應(yīng)式網(wǎng)站、企業(yè)建站、網(wǎng)站內(nèi)鏈、動態(tài)網(wǎng)站
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源:
創(chuàng)新互聯(lián)