我們在瀏覽一個(gè)網(wǎng)站的時(shí)候會對這個(gè)網(wǎng)站有初步一個(gè)的印象，有些網(wǎng)站讓人看了第一眼就愛上，有些網(wǎng)站剛打開幾秒就被關(guān)閉。所以，為什么有些網(wǎng)站一打開就會被關(guān)閉呢？今天給大家整理了在網(wǎng)站建設(shè)當(dāng)中8種讓人討厭的設(shè)計(jì)元素，你中招了嗎？

1、干擾用戶
我們在前面緘默原則一文中說起過干擾用戶這個(gè)問題，緘默指的是交互上的不要擾民。這里說的“擾民”是指用戶在操作某一步驟時(shí)，因?yàn)樵O(shè)計(jì)的不合理而中斷了用戶的使用，給用戶在體驗(yàn)的過程中造成一定的不適感。
例如：每次打開wps，都要先彈出一個(gè)wps的廣告頁面，時(shí)不時(shí)給你推送一些廣告。又比如各種彈窗廣告，最具有代表性的是早年間右下角的假qq 彈框，加咳嗽。這種擾民的方式都讓人很不舒服。
許多網(wǎng)站為了吸引用戶的注意力，特意“設(shè)計(jì)”這種抖動彈窗，有些甚至以“欺騙”用戶，或者辜負(fù)用戶的信任為代價(jià)去做這些彈窗。
的確，你應(yīng)當(dāng)吸引用戶的注意力，但是這不能以“欺騙”用戶，或者辜負(fù)用戶的信任為代價(jià)。

當(dāng)你被一個(gè)充滿噱頭的新聞標(biāo)題吸引了注意力，點(diǎn)開卻發(fā)現(xiàn)內(nèi)容完全不是你想的那樣。標(biāo)題黨令人生厭。同樣的，通過搜索引擎找到你想要的產(chǎn)品或者素材，打開頁面之后卻直接出現(xiàn)彈出框，要你注冊，要你支付，有的甚至壓根就不是相關(guān)的頁面。所有的一切都是在干擾、打斷用戶體驗(yàn)。

也許在網(wǎng)站中采用這樣的設(shè)計(jì)，短期內(nèi)會有一定的效果，但是從長期來看，這種干擾性的用戶體驗(yàn)很難讓用戶留存。
2、導(dǎo)航混亂，內(nèi)容多
導(dǎo)航是網(wǎng)站的一項(xiàng)重要組成部分，通常網(wǎng)站的主導(dǎo)航主要包括網(wǎng)站的首頁和產(chǎn)品欄目及各個(gè)單頁面的導(dǎo)入鏈接。方便用戶以最快，最簡單的到達(dá)不同的網(wǎng)頁！同時(shí)也方便用戶一目了然的發(fā)現(xiàn)網(wǎng)站的主要信息，而不用費(fèi)力的尋找！所以導(dǎo)航的設(shè)計(jì)一定要簡單清晰。
有些網(wǎng)站的導(dǎo)航設(shè)計(jì)為了突出，加入各種各樣的元素和動態(tài)效果為了吸引消費(fèi)者的眼球，要知道，這樣反而降低了界面的識別度。
千萬不要考驗(yàn)?zāi)愕挠脩?，?dǎo)航設(shè)計(jì)不要太多層級，一定要有一個(gè)清晰明了的導(dǎo)航結(jié)構(gòu)。除此，導(dǎo)航的內(nèi)容一定要精簡，不能多。每一欄的內(nèi)容過多會降低導(dǎo)航的識別性。
中興的這個(gè)導(dǎo)航我其實(shí)不是很喜歡，設(shè)計(jì)得有點(diǎn)復(fù)雜了，設(shè)計(jì)感是有了，但是識別性相對來說有點(diǎn)弱，因?yàn)閺?fù)雜了。當(dāng)然，也不排除有人喜歡這種設(shè)計(jì)，畢竟設(shè)計(jì)的風(fēng)格各有喜好。
嘉寶莉漆官網(wǎng)的導(dǎo)航設(shè)計(jì)，其實(shí)可以再簡單點(diǎn)的，二級導(dǎo)航內(nèi)容本就不多，完全可以將導(dǎo)航的配圖去掉，改用再簡潔的設(shè)計(jì)，會顯得更高大上一些。
3、內(nèi)容沒有主次
都知道，一個(gè)干凈簡潔清新的網(wǎng)站頁面，往往會給訪問者留下很深刻的第一印象。一個(gè)好的網(wǎng)站應(yīng)該像一個(gè)超市一樣，整體的布局有條理性，訪問者很容易就可以找到自己需要的內(nèi)容。相反那些排版亂七八糟、指東畫西、看著就犯暈的網(wǎng)站，絕對不會受到用戶的青睞。
就拿京東天貓來舉例，為什么京東天貓這類大型的商城網(wǎng)站，我們在瀏覽的時(shí)候都可以快速的找到我們想要的內(nèi)容呢？就因?yàn)榫W(wǎng)站的結(jié)構(gòu)和主次內(nèi)容區(qū)分明確。
ZUI前端框架 這個(gè)網(wǎng)站的主次內(nèi)容就非常清晰，甚至網(wǎng)站中的主要內(nèi)容都羅列出來，邏輯清晰，也便于游客去找尋。
網(wǎng)頁中不同的內(nèi)容是有輕重緩急的，而這種重要性不論是基于設(shè)計(jì)的需求還是用戶的需求，都要進(jìn)行判斷和劃分。因而，在設(shè)計(jì)一個(gè)網(wǎng)站的時(shí)候，重要的內(nèi)容應(yīng)當(dāng)置于重要的、易于掃視查看的位置。不是很重要的內(nèi)容可以放在視覺關(guān)注區(qū)較弱的地方。避免網(wǎng)站凌亂，主次不分。這種情況經(jīng)常出現(xiàn)在老一些的企業(yè)網(wǎng)站當(dāng)中。
4、復(fù)雜的注冊流程
復(fù)雜的注冊流程，不要。說到這一點(diǎn)，可能有些人說在設(shè)計(jì)這些流程的時(shí)候，為了拿到用戶更多的信息資料，我們故意多設(shè)置一些必選項(xiàng)。這種想法都是錯(cuò)誤的。
大部分的人都比較慵懶沒有耐心，現(xiàn)在大家最喜歡的兩種注冊方式，一種是qq、微信等一鍵式注冊方式，一種是手機(jī)驗(yàn)證碼注冊方式。這兩種方式受到大家的歡迎是因?yàn)楹啽愎?jié)約時(shí)間。如果你的網(wǎng)站需要注冊，可以考慮以上兩種方式，盡可能的簡便，因?yàn)榇蠖鄶?shù)用戶都不喜歡復(fù)雜。
用簡書登錄界面做例子，可以看到除了正常的賬號登錄之外，底部還有一些社交賬號的一鍵登錄方式。一鍵登錄的網(wǎng)站提高了用戶注冊的效率，也杜絕了用戶忘記賬號密碼的情況。
5、忽略基礎(chǔ)功能
網(wǎng)頁的可用性始終是擺在易用性之前的。我想你也有過這樣的經(jīng)驗(yàn)：打開網(wǎng)頁之后經(jīng)過漫長的等待而網(wǎng)頁無法加載；點(diǎn)擊一個(gè)按鈕而沒有相應(yīng)的反饋；想找到網(wǎng)頁背后所有者的聯(lián)系方式，但是在About Us 的頁面中一無所獲。
這些基礎(chǔ)的工作都需要設(shè)計(jì)師用心做好。確保網(wǎng)頁的基礎(chǔ)功能都能夠順暢的使用，正確的反饋，而這些基本的可用性問題，常常出現(xiàn)在搜索框、導(dǎo)航、頁腳甚至業(yè)務(wù)邏輯當(dāng)中。搜索框點(diǎn)擊不能搜索、點(diǎn)擊按鈕沒有反應(yīng)……這種基礎(chǔ)功能不能用，是不是特別讓人崩潰。
泰富 這個(gè)網(wǎng)站的導(dǎo)航，二級導(dǎo)航鼠標(biāo)移過沒有樣式上的區(qū)別，這樣會讓用戶使用起來不方便。
說到這塊，我不得不提的最讓我頭疼的是一些采用瀑布流方式的網(wǎng)站，所有聯(lián)系方式都放在最底部，而你怎么拉都拉不到底部，沒辦法查閱到聯(lián)系方式，這是最讓人抓狂的。
蟬知官網(wǎng)的幻燈，在按鈕的設(shè)計(jì)上就很明確，讓用戶一目了然的知道按鈕的內(nèi)容。
所以在網(wǎng)頁當(dāng)中，大到一張幻燈片的調(diào)整，小到不同類型的元素涉及到不同類型的內(nèi)容，或者牽涉到特定的功能或者交互，這些元素的功能都是要設(shè)計(jì)好的，不能違背用戶的認(rèn)知常理?？捎玫陌粹o、鏈接等基礎(chǔ)功能，確保了信息的完整性和功能的完整性，只有這樣，用戶才能信任網(wǎng)頁本身。
6、使用深色的背景
深色的背景不是說不能用，也不是說用了深色的背景就不好。大多數(shù)是用深色背景的網(wǎng)站，多為一些游戲類、運(yùn)動類或其他一些特殊網(wǎng)站。深色作為大幅的背景，那就意味著字體顏色是白色或是淺色的，這樣的搭配小篇幅還可以，大篇幅的話，會讓人的眼睛產(chǎn)生視覺疲勞感。
游戲網(wǎng)站的文字內(nèi)容本就不多，所以用戶瀏覽停留的時(shí)間不會太長，不會讓用戶產(chǎn)生太明顯的時(shí)間疲勞感。當(dāng)一個(gè)信息量大的網(wǎng)站，采用深色做背景的話，間接加大了瀏覽者的視覺壓力，可能看不完內(nèi)容這個(gè)網(wǎng)站就被關(guān)了。所以我們一般建議內(nèi)容多的網(wǎng)站少用深色來做背景，如果真要用，建議網(wǎng)站內(nèi)容中增加其他色彩和穿插多一些插圖。
再來看看國外的設(shè)計(jì)案例，Impero國外設(shè)計(jì)公司網(wǎng)站，這個(gè)網(wǎng)站雖然采用了黑色作為背景，但是里面沒有通篇的黑色，這樣看起來有層次，視覺效果也比較好。
7、可讀性差
說到可讀性，之前我們也有單獨(dú)用一篇的文章來給大家講解，可讀性包括文字的可讀性、段落可讀性、區(qū)塊可讀性、圖片可讀性、導(dǎo)航可讀性等。
要讓文字提高可讀性，可以通過調(diào)整字體樣式、外邊距、內(nèi)邊距、顏色和對比度等參數(shù)來提高文字的可讀性。
良好的設(shè)計(jì)應(yīng)該都是可讀的設(shè)計(jì)，如果信息都無法正常而清晰的傳達(dá)，那么設(shè)計(jì)就失去了意義。
設(shè)計(jì)的可讀性和排版設(shè)計(jì)息息相關(guān)，與此同時(shí)，對比度的控制也是其中的核心，同樣的字體，不同對比度可讀性就不一樣。想要提升內(nèi)容的可讀性，讓內(nèi)容以更加順暢、更符合邏輯的形式呈現(xiàn)在用戶面前，怎么提升網(wǎng)站的可讀性，我之前跟大家分享過，感興趣的朋友可以看一下原文——可讀性在網(wǎng)頁設(shè)計(jì)中的重要性。
8、為了界面效果添加過多的動畫
我給很多客戶做過網(wǎng)站，有一部分客戶會有自己的主見，對網(wǎng)站有些想法特別堅(jiān)持，好比在網(wǎng)站的首頁每個(gè)元素都要加入動畫，讓這些元素動起來，就連個(gè)字體都想讓它抖動一下，生怕瀏覽者錯(cuò)過。這種觀點(diǎn)其實(shí)是錯(cuò)誤的。
試想首頁的每個(gè)元素圖片都要加入動態(tài)效果，這種體驗(yàn)其實(shí)很糟糕的，你的眼睛應(yīng)接不暇的看了一圈下來，我相信你可能會感慨一下網(wǎng)站的動畫，但實(shí)際網(wǎng)站的內(nèi)容卻都記不住。很明顯，這就是喧賓奪主。
所以我們在設(shè)計(jì)首頁的時(shí)候，我們可以適當(dāng)?shù)脑诰W(wǎng)頁中局部區(qū)塊加入一些動畫做點(diǎn)綴，不僅可以起到活躍界面的作用，還能增加一些趣味，又不會喧賓奪主。
EWA APP應(yīng)用產(chǎn)品網(wǎng)站，里面有些動畫做的還可以，不多，但是效果也比較出彩。
以上8個(gè)設(shè)計(jì)的錯(cuò)誤，其實(shí)都是可以避免的。沒有好的網(wǎng)站。每一個(gè)網(wǎng)站都會有這樣那樣的問題：該表單字段有問題，該段文本編輯不當(dāng)，該導(dǎo)航還缺一個(gè)選項(xiàng)等等。只要能發(fā)現(xiàn)問題、及時(shí)修改即可。
有些人想說，我就是故意設(shè)計(jì)的，或者這個(gè)qq彈窗就是為了吸引客戶故意留的，不愿刪。我們在網(wǎng)站的時(shí)候，一定要尊重自己網(wǎng)站的用戶，真正在意自己網(wǎng)站用戶的，就不要干擾用戶體驗(yàn)，尊重使用你的網(wǎng)站的用戶，當(dāng)你給予用戶足夠尊重之時(shí)，他們會用尊重予以回饋的。

網(wǎng)站名稱：深圳網(wǎng)站建設(shè)中讓人討厭的8種設(shè)計(jì)元素
文章位置：http://jinyejixie.com/news37/139987.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營銷seo公司；服務(wù)項(xiàng)目有網(wǎng)站建設(shè)等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)