您現在的位置: 网站首頁 / 網站建設 / 正文

提高WEB用戶體驗至關重要的幾點

作者: admin 发布: 2015-4-17 0:58:18 分类: 網站建設 閱讀: 次 查看評論

  一個精通算法經驗豐富的後端工程師,也不一定能夠完成出色的前端頁面,對邏輯經驗豐富的程序員來說,html/css顯得繁瑣低效,即便是SASS、LESS這樣的框架也難以讓傳統程序員理解前端工程師,多數人眼中前端是編程與設計各占一部分的新職業,特別是在衆人把用戶體驗挂在口中時,更讓人覺得前端應當對此有獨特的理解。其實在我看來,用戶體驗這東西不管是從哪方面來說都沒有一個確切的定義,可能前端可以更多的用經驗來認識它,亦有可能在不同人眼中的web用戶體驗有所差別,只不過方向相同而已。

  筆者也從自己的經驗中總結了一些WEB中用戶體驗的實際細節,當然也不可能面面俱到,限于篇幅筆者就只分享幾個包含顯著特征容易被認可的細節:

  AJAX

  看到這裏肯定有人忍不住笑出聲,的確這已經不算什麽新技術,但要讓我站在用戶的角度來評價網站技術上的變化中給訪問者帶來最大友好性的一項,我肯定會選AJAX.

  記得在我剛剛開始學會上網時候,不管是注冊頁面還是登錄都是我最煩的,那時候網速又不快,打開一個注冊頁面就要幾秒時間,然後從上往下有幾十個選項要全部填滿,比如其中有一項讓我填寫“密碼保護問題”,這個設計簡直讓人想吃電腦,因爲很多人一看這種問題應該都會和我一樣隨便寫幾個數字就提交,然後等幾秒加載完網頁提示“密碼保護問題”不允許有數字,同時之前填寫的十幾項數據全部清空需要重新再來一遍,再花幾分鍾寫完之後提交又提示不允許有字母,再來一遍,有時候還會提示字符太短太長有空格超時之類,總之如果你第一次注冊這種頁面,至少要花掉十幾分鍾,而且還是在重複做一件事。從網站運營者角度來看這也很煩,重複十幾分鍾填寫表單很容易就失去很多潛在用戶。

  在AJAX的異步請求出現之後,這種情況明顯的改善,給用戶的體驗感最明顯。用戶並不知道何時已經提交請求,就拿剛才表單的例子來說,如果每填寫一項都會在當前表單的最後提示具體錯誤類型(在用戶未點擊時已經異步提交了請求並且用返回數據更新部分頁面),這就給用戶很直觀的提示,這種即時的互動讓訪問者能夠很直觀的感受到這是一個友好的網站。(當然用javascript也能做到部分表單驗證,這只是舉一個例子)。在不重新加載整個頁面,通過操作DOM來改寫小部分數據這點上也能給訪問者帶來極大的交互感,現在流行的微博就是最好的例子,在發送微博/評論/轉發之後用戶會發現不用刷新等待整個頁面加載,操作之後立刻會有小部分的頁面發生變化,雖然看起來微不足道,但對一個訪問者來說,這足以讓他們欣喜。

  網頁字體

  網站中所有的文字內容表達方式都是通過字體,合理的字體無疑會給用戶更好的體驗感。在業內來說豆瓣可能是對字體研究最多的一個網站,拿豆瓣讀書都來他們用Helvetica和Arial這兩種差別非常小的字體,這種非襯線字體很容易讓人一目了然同時富有一些科技感,豆瓣本身就是以圖片加上簡短語句組成,讓人能夠從字體中快速找到重心是設計的目標所在。

  有人擔心非襯線用作正文對閱讀體驗有影響,實際上不難發現國外很多網站都用非襯線字體來處理正文,當然也不排除他們可能考慮的更多是英文。其實我還是非常喜歡非襯線體,它們看起來更富美感,而且如今大量的文字在互聯網上比較少見,一些活潑具有現代感的非襯線字體也逐漸被更多的開發者認同而且使用。

  除去這些,字體還可以在選擇上再細分一些,記得曾經看過一篇統計,不同的字體會影響用戶對站點權威性的信賴程度。比方說在一個公司網站上大量使用類似于幼圓、Cursive一類字體,很容易讓訪問者不信任網站,當然如果是以娛樂爲主的網站也不能過于嚴肅和簡樸,在使用時既要考慮到大衆用戶的接受程度,也要知道自己的網站是什麽定位,當然技術性的問題也不能忽略,像是火狐比IE區分sans-serif要更模糊一些,有的字體“O”和“0”、“L”和“1”容易讓人難以區分(代碼較多的站點需要考慮)等等,這樣綜合對比選擇得到的字體無疑能讓網站更有魅力,從而留下更多的用戶。

  順便一提,在使用字體時注意版權。

  加載速度

  很多用戶在還未見到你出色的設計和內容之前就已經離開了頁面,這是因爲網站加載時間實在是太長,已使訪問者失去耐心。其實很多的訪客不關心腳本和圖片的加載順序,他們只要看到網站的整體結構能夠迅速的加載出來就可以開始浏覽,即便是其他元素逐漸加載也可以接受,基于這點,我們可以使用很多延時加載的方法來使用戶更快的見到頁面。除此之外還有很多因素可能會對加載速度造成影響,也有逐一優化的辦法,之前我已經寫了兩篇相關文章來解決此問題(提高網站加載速度的解決方案有多少),不再細述。

  結構設計

  不知道大家發現沒有,近來很多網站都喜歡把菜單fixed在頂部(維特博客就是個例子),只要這個菜單選擇項不是太多,訪客對這樣的固定菜單接受程度還是很高的,這只是設計中的一個小例子,相類似的有很多,比如在表單中以深淺顔色區分每一行,以提高可閱讀性;在激活窗口時爲當前控件添加一個邊框,使用戶能夠更建議的分辨自己在操作哪個窗口等等。很多的設計與排版方式都已經得到了大衆認可,可以作爲網站設計時的參考。

  網站結構設計的好看不好看對訪客來說雖然有影響,但也不至于立刻離開,而且即便是非常精致的頁面卻對用戶不怎麽友好,想必也不會有多少人願意訪問。

  舉個例子,以前我用好搜(360搜索)的時候總感覺怪怪的,沒有google和百度順手,研究了一段時間之後才發現好搜的的主頁搜索框比百度和google要低一些,Google到頂部固定菜單的距離是286px,百度是192px(未登錄238px),而好搜則是328px。相比之下,好搜的搜索框更趨向于屏幕中間,而百度與Google則是在屏幕中上方,對于已經常年習慣了百度和Google搜索的用戶來說,想要改變這個習慣來適應好搜多少有些困難,除此之外搜索框還有結果頁也有幾個問題不一一細述,360這樣做無外乎兩點,一個是不在乎/不知道/不關心用戶體驗,一個就是故意有所不同,想要培養自己的用戶習慣。(在我看來也不怎麽成功)

  細節決定成敗

  喬布斯的父親是個木匠,曾經教給喬布斯一個理念,就是櫥櫃的背面裏層也要細致處理甚至是打磨光滑,即便用戶看不見。在理想主義的偉大試驗品“麥金塔”出世之後,有人甚至感歎,就連電路板上的電路圖都能當作藝術品,的確如此,喬布斯就曾經開除一個對電路圖美學設計不滿的員工。一個偉大産品的誕生並不是一蹴而就的,必然經過了長期的沈澱積累與琢磨,但僅此依舊不能稱之爲偉大,只能算成功。一個産品細節上的最後潤色可能才是決定它價值的關鍵。對于WEB開發者來說,更是如此。

  很多时候用户体验应遵循“less is more”,堆积如山的垃圾信息不仅无用还破坏了整体的用户感受,这也就是所谓的设计细节决定成败。

  如果把WEB用戶體驗展開來說,就算說個一天一夜也說不完,太多的細微之處需要我們留意,而且想要做好任何一處都並不是簡單的事。對于開發者來說,對用戶體驗有更深更實際的理解就是把自己視爲用戶,在逐漸滿足自己細枝末節體驗感的同時,也豐滿了站點的用戶體驗感受。

  --維特博客

  來源:SEO搜尋引擎優化 - SEO自學網 轉載注明出處!

? 上一篇下一篇 ?   本文關鍵詞: 網站建設  

評論列表:

站長SEO學院
第一節:百度搜索引擎工作原理
第二節:建設對搜索引擎友好的站點
第三節:如何進行網站內容建設
第四節:整體優化、結構優化、網頁優化
第五節:移動搜索-明確移動搜索優化標准
百度SEO資料文檔
百度搜索引擎優化指南2.0
百度移動搜索優化指南2.0
網站分析白皮書(站長版)
移動站點該如何優化
建設對百度友好的站點
百度搜索引擎網頁質量白皮書
石榴算法-綠蘿算法-冰桶算法
新搜索時代下的優化策略
更多百度SEO資料文檔
站長推薦
DIV+CSS布局實例教程-Web標准
网站SEO優化常见问题汇总
SEO優化推广方案该如何写
SEO優化方案步骤
影響網站關鍵詞排名因素總結
影響谷歌搜索引擎排名的因素調查
手機移動端站點適配優化
最近發表