用戶體驗在網(wǎng)站建設(shè)過程中的被重視程度，在近些年得到越來越大的提升。很多從事網(wǎng)頁設(shè)計的朋友都會在設(shè)計網(wǎng)頁的時候考慮到用戶體驗這一關(guān)鍵因素，因為不重視用戶體驗的網(wǎng)站，很難在當(dāng)下愈發(fā)成熟的互聯(lián)網(wǎng)環(huán)境中得到用戶的青睞與肯定。在文章中心內(nèi)容開始前，我們來看一組圖片：
（2003年的騰訊網(wǎng)首頁）
（2003年的百度首頁）
（2003年的淘寶網(wǎng)首頁）
十二年前的網(wǎng)站都是這般的，簡單的table布局，可能現(xiàn)在那些抱著ipad上網(wǎng)的00后小朋友很難想象會有這么丑的網(wǎng)頁吧。但現(xiàn)在div+css布局方便了我們設(shè)計很多精美的網(wǎng)頁，界面上的美化從很大程度上提升了網(wǎng)站的用戶體驗。不過，除了界面呢？影響用戶體驗的因素還會有哪些？
正文開始，我們從用戶體驗的角度聊聊，讓訪客反感的12種網(wǎng)頁設(shè)計。
總有那么些網(wǎng)頁，讓我們一打開就迫不及待想要離開的。留不住用戶的網(wǎng)站，花再多的心思引流也都是徒勞。想要增加網(wǎng)站的用戶粘性，提升網(wǎng)站用戶體驗，這12個因素千萬要注意了。
來，從最糟糕的開始說吧……
影響用戶體驗的網(wǎng)頁設(shè)計因素一：漫長的加載時間；
這是本人認為最糟糕的一個因素，網(wǎng)頁加載時間太漫長。要是在十二年前，打開一個網(wǎng)頁要一兩分鐘的話可能大家愿意忍受，畢竟這是很正常一件事；但在十二年后的今天，如果還要我花費一兩分鐘去等待你的網(wǎng)頁加載，我是絕對沒這個耐心忍受這一切的，不知道你們是不是贊同。
因此，提升網(wǎng)頁加載速度，是提升用戶體驗的一個非常重要的因素。影響網(wǎng)頁加載速度的因素也有很多，袁程旭在之前的文章中多次有提及這方面知識。你可以買一臺配置好點兒的服務(wù)器，當(dāng)然不建議買港臺或海外的，部分地區(qū)的訪客瀏覽網(wǎng)頁時加載會很吃力；除了服務(wù)器以外，網(wǎng)站程序的選擇也很有講究，不過這不是一兩句話可以說完的。另外，諸如網(wǎng)頁延遲加載（點擊閱讀），或圖片異步延遲加載（點擊閱讀）之類的技術(shù)使用可以很好地提升網(wǎng)頁加載速度，感興趣的朋友可自行了解。
影響用戶體驗的網(wǎng)頁設(shè)計因素二：自動播放的聲音；
說實話，這樣的網(wǎng)站經(jīng)常會嚇到我，尤其是在半夜的時候。請試想一下，你打開一個網(wǎng)頁，突然就聽到了一些亂七八糟的聲音，沒有心理準備的話是不是會被這東西給嚇到？這樣的網(wǎng)頁設(shè)計常見于那些搞銷售類的頁面，一進入網(wǎng)頁就自動播放音樂或者廣告宣傳，實在讓人抓狂。
玩QQ空間的時候感覺設(shè)置一個自動播放的背景音樂很酷炫，但設(shè)計網(wǎng)頁的時候如果采用自動播放聲音的設(shè)計其實是很影響用戶體驗的。你大可以在網(wǎng)頁某處放置音頻或視頻文件，讓用戶自主選擇是否打開播放，我想這樣更尊重用戶選擇的設(shè)計才會更受用戶歡迎吧？
影響用戶體驗的網(wǎng)頁設(shè)計因素三：彈窗 & 廣告；
可能現(xiàn)在有很多攔截廣告的插件，但這并不影響我們對廣告的厭惡。最討厭的廣告形式就是那些永無止境的彈窗了，這是對用戶非常不友好的一種廣告形式。當(dāng)然，彈窗這一讓人反感的東西也不一定表現(xiàn)在廣告上，很多企業(yè)的官網(wǎng)經(jīng)常彈出“點擊咨詢”類窗口，關(guān)閉了沒幾秒又自動打開，這是很讓用戶反感的一個設(shè)計。信息還沒瀏覽多少，你就不斷要我點擊咨詢，我只好退出你的網(wǎng)站了。
再說說廣告，最惡心的廣告形式是那些偽裝著騙你去點擊的，常見于那些下載站，你經(jīng)常不知道哪個才是正確的下載鏈接，是不是經(jīng)常就下載了一些莫名其妙的軟件下來？袁程旭并不是說網(wǎng)站不能投放廣告，是希望大家在用戶體驗的考慮前提下合理設(shè)計廣告位，比如代碼君網(wǎng)站的廣告位分布。
影響用戶體驗的網(wǎng)頁設(shè)計因素四：關(guān)鍵信息不在顯眼位置；
設(shè)計網(wǎng)頁的時候，你必須要知道用戶第一眼看到網(wǎng)頁時，視線的集中點會落在哪里?？赡苣阏J為網(wǎng)頁設(shè)計只是往頁面上堆砌信息那般簡單，但其實信息的分配布局是很有講究的。頁面的關(guān)鍵信息必須要在顯眼的位置突出展現(xiàn)，才能更方便地被用戶獲取，不然的話其實很影響用戶體驗。
就這么說吧，之前我瀏覽過一個主題酒店的網(wǎng)頁，但找了半天沒發(fā)現(xiàn)在哪里查看房型、價錢這些用戶比較關(guān)心的信息和資訊，反倒是其企業(yè)文化介紹、發(fā)展歷程這些并不太重要的信息，擺在了非常明顯的位置。這樣的設(shè)計是反人類的，在顯眼位置放置用戶關(guān)心的關(guān)鍵信息，才是正確的設(shè)計。
中企動力是一家專注于網(wǎng)站建設(shè)、網(wǎng)站設(shè)計、網(wǎng)站制作、建網(wǎng)站、制作網(wǎng)站的高端網(wǎng)站制作公司。
影響用戶體驗的網(wǎng)頁設(shè)計因素五：過早地要求注冊；
我去一個網(wǎng)站尋找一張設(shè)計圖，你要我注冊會員才能查看，那我肯定不干了。這些過早地要求注冊的網(wǎng)站也是很讓用戶反感的，除非你是那種什么真愛、相親類的網(wǎng)站。比如百合網(wǎng)這類，你要我注冊了才有權(quán)限查看更多會員的信息，為了找到真愛那我也認了。但如果只是下載一張圖片或者一首歌就要求我注冊的話，哪兒有那閑工夫理會你，網(wǎng)上的免費資源多得是。
從用戶體驗的角度出發(fā)，就應(yīng)該給予用戶更多的自主選擇權(quán)。比如我一部分資源是免費對外提供給所有用戶瀏覽或下載的，但還有很多精品資源是會員才有權(quán)限瀏覽和下載，只要資源足夠優(yōu)秀還怕吸引不到用戶來注冊么？別強迫用戶去做他們不喜歡做的事情，不然很容易遭受用戶反感。
影響用戶體驗的網(wǎng)頁設(shè)計因素六：糟糕的導(dǎo)航設(shè)計；
網(wǎng)站的導(dǎo)航欄往往是為了更好地引導(dǎo)用戶，如果導(dǎo)航欄設(shè)計得太過糟糕的話，還怎么能起到引導(dǎo)用戶的作用呢？設(shè)計網(wǎng)站導(dǎo)航欄的時候，一般要遵循鼠標的最短路徑原則，還要盡可能的方便用戶去到他們想要去的頁面。網(wǎng)站設(shè)計的每一點一滴其實都有講究，要不然怎么配得上設(shè)計二字？
還是以那個主題酒店的網(wǎng)頁為例，試想一下，如果你現(xiàn)在迫切需要預(yù)定一個房間，但找了半天沒找到訂房的鏈接入口，內(nèi)心會不會很崩潰？一邊是即將噴涌而出的荷爾蒙，一邊是對這糟糕網(wǎng)頁體驗上的各種差評，兩者無論哪一個都夠讓你瘋狂的，內(nèi)心難免會大罵道：這都TM什么網(wǎng)站??！
影響用戶體驗的網(wǎng)頁設(shè)計因素七：Flash（特別是主頁只有Flash展現(xiàn)）；
在之前的SEO類文章中，袁程旭多次提到，F(xiàn)lash的應(yīng)用很不利于網(wǎng)站SEO。目前為止，搜索引擎爬蟲還不能夠很好地爬取Flash文件內(nèi)容，對網(wǎng)站的收錄會有一定的影響。而網(wǎng)站主頁恰巧是SEO過程中非常值得重視的一個頁面，如果只有一個Flash文件在網(wǎng)站主頁展現(xiàn)的話，那就未免太搞笑了。
撇去SEO的因素不談，如果你進入一個網(wǎng)站主頁發(fā)現(xiàn)只有一個Flash文件展現(xiàn)，會不會有種摸不著頭腦的感覺？一般這樣的網(wǎng)頁設(shè)計也多見于那些產(chǎn)品推廣、企業(yè)推廣類站點，而展現(xiàn)的Flash文件內(nèi)容多半是對產(chǎn)品或企業(yè)進行介紹的。這是一種強硬推廣手法，很容易讓用戶產(chǎn)生反抗的逆反心理。
影響用戶體驗的網(wǎng)頁設(shè)計因素八：色彩搭配太過耀眼；
網(wǎng)頁色彩搭配給用戶視覺上的沖擊是非常強的，袁程旭個人還是比較喜歡采用那些簡約樸素的色彩搭配方式來設(shè)計網(wǎng)站。我可不喜歡進入一個網(wǎng)站看到五顏六色的模塊，色彩搭配太過耀眼會讓眼睛很容易感到疲倦。如果你網(wǎng)站的文字信息比較多，就更不能采用太鮮艷的色彩了，不然用戶視覺疲勞了還怎么有心思去閱讀資訊呢？多參考一下大型互聯(lián)網(wǎng)公司的網(wǎng)頁配色，或許值得你去學(xué)習(xí)模仿。
袁程旭強烈建議各位朋友，設(shè)計網(wǎng)頁時要保證頁面的主色調(diào)搭配不超過三種，除非你有特殊的需求而不得不將網(wǎng)頁設(shè)計成萬花筒那般。各位可以閱讀《三分鐘帶你快速入門極簡色彩學(xué)》這篇文章來學(xué)習(xí)一些基本的色彩學(xué)知識，我想會非常有利于你在網(wǎng)頁設(shè)計過程中進行合理配色。
影響用戶體驗的網(wǎng)頁設(shè)計因素九：table布局 or 界面過丑；
正如文章開頭所言，現(xiàn)在的網(wǎng)頁之所以可以設(shè)計得比十二年前精美，是因為div+css的布局結(jié)構(gòu)能夠營造出很多table布局實現(xiàn)不了的效果。如果你還沉迷于table布局的網(wǎng)頁中無法自拔的話，那么請原諒我實在看不下去，只好默默退出你的網(wǎng)站了。table布局的網(wǎng)頁非常難看，總之我是忍受夠了。
不過，就算是div+css布局，竟然也有人能夠把網(wǎng)頁設(shè)計得非常丑的。這樣的網(wǎng)頁一般多是采用類似于dreamweaver的軟件拖動設(shè)計出來的，沒有代碼寫出來的網(wǎng)頁來得精致。界面過丑的網(wǎng)頁總之不會太讓人喜歡，畢竟大家還是更樂于追求美感的，沒有人會喜歡在那些丑陋的界面上多加停留。
影響用戶體驗的網(wǎng)頁設(shè)計因素十：網(wǎng)站太過“業(yè)余”；
這里所謂的業(yè)余，不僅體現(xiàn)在網(wǎng)站資訊表達上，也體現(xiàn)在網(wǎng)站所有者的運營上。如果網(wǎng)站的主題不夠明確，網(wǎng)站文章對某件事物所表達的觀點也不是很讓大部分人贊同，那么就可以說這樣的網(wǎng)站很是業(yè)余。網(wǎng)站所有者在日常運營工作中，如果未及時更新網(wǎng)站資訊，或者甚至連網(wǎng)站的關(guān)于我們和聯(lián)系我們等重要信息都未及時更新，那么這樣的網(wǎng)站也可以稱為業(yè)余網(wǎng)站。
如果我進入一個網(wǎng)站，發(fā)現(xiàn)首頁最新推薦的文章還是2002年的，那我肯定不會多看就馬上退出這個網(wǎng)站了。你如果在編碼技術(shù)上或者SEO基礎(chǔ)常識上略顯業(yè)余，我還是可以忍受的，畢竟那跟我沒有多大的關(guān)系。但如果我想獲取的東西找不到，或者找到了但卻很業(yè)余可笑的，那肯定也不會有好感。
影響用戶體驗的網(wǎng)頁設(shè)計因素十一：設(shè)計上的一些瑕疵；
這些因素可能不會導(dǎo)致大量用戶對你的網(wǎng)站產(chǎn)生反感情緒，但如果能注意到這些問題并且有針對性地進行改進，一定能更好地提升網(wǎng)站用戶體驗。接下來我們就簡單聊聊，這些設(shè)計上的瑕疵。
這些因素可能不會導(dǎo)致大量用戶對你的網(wǎng)站產(chǎn)生反感情緒，但如果能注意到這些問題并且有針對性地進行改進，一定能更好地提升網(wǎng)站用戶體驗。接下來我們就簡單聊聊，這些設(shè)計上的瑕疵。
1、分頁瀏覽圖片
常見于一些圖片類站點，瀏覽一張圖片就要轉(zhuǎn)向下一頁才能繼續(xù)瀏覽，但真的有必要嗎？明明可以在一頁瀏覽完十張圖片，我卻不得不翻十頁瀏覽完，雖然網(wǎng)站的流量得到了很好的提升，但用戶體驗真的會非常差，瀏覽起圖片來真的好累啊；
2、字體選擇和布局
特別是對于文字信息比較多的站點來說，良好的閱讀體驗很是重要。代碼君網(wǎng)站的文章頁字體是經(jīng)過嚴格試驗后，綜合用戶反饋進行改進的。字體類型的選擇、大小、行高和段落之間的距離等等因素，還有字體的右對齊，只有都做精細了才能達到更好的感官效果；推薦閱讀：《中文網(wǎng)頁設(shè)計：關(guān)于字體的那些事兒》；
3、網(wǎng)頁過窄或者偏向一側(cè)對齊
現(xiàn)在大屏的設(shè)備越來越普遍，寬度為800px的網(wǎng)頁設(shè)計顯然已經(jīng)跟不上時代了。建議PC端網(wǎng)頁寬度至少要保持在1000px至1200px左右，當(dāng)然可自適應(yīng)布局。而網(wǎng)頁如果偏向一側(cè)對齊也是非常難看的，雖然分割屏幕的做法很新穎，但不適合整站偏向一側(cè)對齊；
4、結(jié)構(gòu)混亂
這個想必也不用多說了，跟糟糕的導(dǎo)航設(shè)計給人感覺差不多。網(wǎng)站結(jié)構(gòu)混亂很容易讓人進去就找不到出來的路，只好關(guān)閉瀏覽器直接退出了。對于一般的小站點來說，沒有太多的東西拿來分配，自然不會有太復(fù)雜或者混亂的結(jié)構(gòu)。一旦網(wǎng)站做大了，考慮結(jié)構(gòu)的合理布局就很必要了；
5、瀏覽器兼容問題
不寫代碼的人可能就會容易忽略這個問題，訪客在使用IE瀏覽器和谷歌瀏覽器分別對你網(wǎng)頁進行瀏覽的時候，看到的效果可能是不一樣的。從用戶體驗的角度出發(fā)，這個問題是很有必要考慮的，但你也可以忽略這個因素，祈禱用戶別用低等級的IE等瀏覽器，或者祈禱這些低等級瀏覽器升級。
影響用戶體驗的網(wǎng)頁設(shè)計因素十二：沒有wap端入口或沒有自適應(yīng)布局；
web端網(wǎng)頁在屏幕較大的電腦設(shè)備上欣賞起來可能還不錯，但換了屏幕較小的平板電腦或者手機等移動設(shè)備瀏覽時，難免會讓內(nèi)容布局顯得過于局促。手機端網(wǎng)站開發(fā)設(shè)計在很早前就被大家提出但卻一直沒被重視，不過隨著近些年百度等搜索引擎對擁有wap端入口或自適應(yīng)布局的網(wǎng)頁表現(xiàn)得更為友好，讓大家開始重視wap端網(wǎng)站建設(shè)。而移動設(shè)備的普及和移動端搜索流量的提升，則促成了更多人下定決心要建設(shè)wap端網(wǎng)站或者直接采用自適應(yīng)布局來設(shè)計網(wǎng)頁。
個人還是比較建議大家采用自適應(yīng)網(wǎng)頁布局的，比較適合各種不同配置的瀏覽設(shè)備，符合當(dāng)下的用戶瀏覽情況。如果想了解自適應(yīng)網(wǎng)頁布局的，可自行查看本欄目之前發(fā)表的系列文章。
最后總結(jié)：
各種各樣的原因讓人們在還沒有真正了解一個網(wǎng)站的時候就把網(wǎng)頁直接關(guān)掉了，所以用戶體驗的考慮其實是非常重要的。比如這篇文章，其實是不太尊重用戶體驗的，寫了一大堆文字卻沒見幾個插圖合理布局一下，能全篇看下來的人肯定很累。但圖片多了的話，網(wǎng)頁加載又會變慢，本文開篇拿了五張大圖來作展示已經(jīng)夠影響網(wǎng)頁加載了，為了盡可能地提升網(wǎng)頁加載速度，只好少放幾張圖片了。
當(dāng)然這十二點也不完全是用戶進入網(wǎng)站后馬上又離開你網(wǎng)站的必然因素，比如我是點錯鏈接才進的你網(wǎng)站，那我肯定會馬上離開，這也是一種可能。那么，你是為什么離開一個網(wǎng)頁的？
相關(guān)標簽：企業(yè)網(wǎng)絡(luò)推廣公司、網(wǎng)頁設(shè)計、企業(yè)網(wǎng)站開發(fā)、網(wǎng)頁設(shè)計公司、公司網(wǎng)站推廣、企業(yè)網(wǎng)絡(luò)推廣、建設(shè)網(wǎng)站公司、公司網(wǎng)站、網(wǎng)站公司、企業(yè)建網(wǎng)站、保定網(wǎng)站建設(shè)、北京網(wǎng)站制作、北京企業(yè)建站、福州網(wǎng)站建設(shè)、長春網(wǎng)站制作
