從網頁設計角度評測淘寶首頁改版（外加評論）轉載

從網頁設計角度評測淘寶首頁改版（外加評論）無意間查看 wiLdGoose 空間，發現竟然「私藏」了那麼好的一篇文章。在「詛咒」其身體和手機能好起來的同時，心理不禁對大雁兄的那種敬業精神表示一下敬意。自己目前也是搞 WEB 這塊的，所以 Taobao 的每一次改動我都分外的關注（其實我也是其用戶之一）。下面就原文補充一下我的個人看法（使用藍色字體標注）。
這兩天正好在看《網站界面設計》一書，這本書，也是我首次接觸比較系統的介紹界面設計理論的書，書中對界面的可用性設計原則、交互設計、呈現設計以及網絡廣告設計四方面介紹的很系統很詳細的介紹，而且書中包含了大量的實際案例分析，看後收穫很大。於是，最近一直想找個界面來練練手，剛好 Taobao 的首頁進行了新一輪的「胖身」改版，就全當成學習來，來分析一下 Taobao 的首頁界面改版評測。
% `; A( ?/ n% M7 o+ s8 ?: l首頁是網站的大門，用戶從這裡進入網站，又從這裡進入到網站的各個頻道和內容，首頁是用戶的主要集散地，他的呈現和側重點直接決定了網站的導向，對於用戶來說，首頁是導航，對於網站來說，他相當於目錄和發佈區，對於活動以及商家，他又是廣告。平衡三者的關係是首頁設計的重點，網站的首頁和欄目頁體現了網站的主旨以及特色，把流量引向網站最重要的地方，這一方面來說，Taobao的網站改版還是達到要求了。
3 f; q  r5 G& n9 \1 C& R首頁的基本設計原則：
! n% {0 i6 b& L4 D" d8 s( E（1）首頁上最顯著的設計元素之一應該是公司網站的名稱（Logo），讓用戶知道他來到了什麼地方。呵呵，這個很明顯，Taobao 的 Logo 依舊放在左上角最顯眼的地方。
似乎將 Logo 放在首頁的左上角是上個世紀遺留下來的傳統了。當然我們可以一句反三，因為放到這裡位置的根本目的是讓用戶能通過我們的 Logo 記住我們，但是如果因為這個 Logo 影響了用戶體驗的話那就得不償失了。
% ]( a4 l# t# n+ {

（2）首屏需要體現最基本的用戶任務，即 70% 以上目標用戶需要使用的功能和網站的主推的服務，需要將兩者巧妙地結合在一起，引導網站流量。Taobao是一個 C2C 的網站，用戶上網主要來淘自己喜歡的東西，所以搜索是他最重要的入口，這裡淘寶的首頁把搜索的設計很顯眼，也很人性化，只不過不知道為什麼右上角上方也有一個搜索，雖然搜索很重要，但是太多相似的信息會不會令用戶感到迷惑。
2 \" M) X' }2 [! W0 b這點我不怎麼同意原文作者的看法。說到底網站提供的是針對某方面的單一內容（排除門戶網站），從網站的架構上分析的話，我認為 Taobao 的網站架構是建立在搜索的基礎上的。其二，從用戶體驗的角度上說內容的「合理重複」也是加深用戶體驗的一種方式之一。況且我認為如果去除右上角的搜索框以後，按照內容延伸的角度分析的話這裡必定是要放滿一排的按鈕了。或許那樣的話才會讓用戶感到「真正」的迷惑了。
1 K/ m4 |) {% q% b% m& ~1 M

0 \: r& ~" r: a+ \/ R; F（3）首屏需要傳達足夠的信息，以讓用戶感受網站內容或功能的豐富。這個看看後面密密麻麻的寶貝類目，就能感覺到，不過這個也是最最困難的，信息多了，要如何安排，安排不當，就容易造成信息的雜亂無章，讓用戶迷失導向，不過這裡這個處理的還可以，一些重要的常用的用不同顏色處理，各個類目用不同的背景區分開來，相對信息還是比較清晰。只是他的背景背景感覺應該用橙色系的色度比較淡的來做背景，這個整體的有機型會強一些。
嗯，是的。在這塊 Taobao 的處理上面可能會比較的保守：我的起初觀點是可以將這些「雜亂無章」的數據整理一下，做成一個下拉菜單，按照分類的層次排列。但是仔細一想這樣的話首頁的空間是少了很多，而用戶體驗卻降低了：試想一下，如果用戶為了尋找一雙襪子他首先要點擊「我要買」菜單，然後點擊「服裝」，然後點擊「男裝」，然後再點擊……是的，我想這樣的話你也心煩了。所以 Taobao 這方面的處理還是比較合理的。首先能拉走一大塊主頁的空間，讓頁面「看起來」內容非常的充實；二來讓用戶有的放矢，操作起來非常的直觀。
& ]' b+ i1 V# u  L2 N  Y+ |

7 e! E; m8 p: z$ @) b（4）首屏需要體現網站的更新，體現網站的活力。淘寶集市；品牌商城，二手閒置。類目的右側，全球購和促銷區的領地，尤其是新增的促銷區域，這些動態的數據更新，相信已經足夠體現了這個中國最大的 C2C 的活力，這一版，也把這些強化了不少。
這塊就足夠體驗了 Taobao 的人員配合功底了。一個首頁的 Flash 可以說在一天以內的時間裡面可以「平滑」得更新數次，這個無論從技術的角度還是從界面的設計的角度上說，他們的人員分工配合的非常的默契的。
（5）首頁的設計能夠引人注目，能夠讓目標用戶過目不忘，並對網站形象產生良好的準確的認知和記憶，就設計和視覺而言，用戶所希望的是：佈局整齊清晰，板塊明確，色調不要讓眼睛疲勞。這一塊，感覺改版後，板塊比原來清晰不少，整個網站的架構也更明瞭，設計上更加大膽，色彩依舊保持鮮艷為主，刺激用戶購買慾望，還是保持原來的主色調，畢竟也是一個企業色，但是個人感覺用色還是有點雜，有點很強烈的對比，讓用戶感覺心理很不舒服。

8 e2 J! I& o! w& O9 ]（網頁頁面的顏色跳躍會不會太突然了些，雖然這樣可以強調公告信息，但是，感覺不是很和諧~）
; F7 Z9 ]5 H  O3 V

（整體的色彩過於混亂，按照我個人的理解，Taobao 的主題色應該是橙紅色，但是，感覺整個頁面中，藍色跟橙紅比重相似，從上來拉下來，感覺進入兩個世界，感覺整體性不是很好~）
嗯，這點我也同意原文作者的觀點。Taobao 的企業色調是暖色的橙紅色。而公告欄的藍色是冷色調，一種暖色調加上一種冷色調形成一種相對的色覺反差是不錯，但是如果過分使用的話可能會適得其反。而從我個人角度上說這點 Taobao 還沒有如原文作者所說的「不是很和諧」的層次。至少按照用戶習慣來說他們的注意點會集中在中間的搜索上（當然如果能改進一下會更好）。
* [' \; {3 {6 u/ o（6）首屏需要較快的下載，因此網頁頂端需要減少圖片，減少表格的複雜性，保證表格橫切的可能性以加快下載速度。這個個人感覺淘寶的導航雖然設計的很漂亮，但是經常打開後圓角丟失，或者背景圖片沒現實出來，不過好在導航文字能很快出現，但是過多的圖片還是影響了用戶對網站整體的感覺，還有個問題，也是關於頁面下載速度的，公告欄以及中間的圖片廣告的背景，好像是深色的粉紅，在頁面下載之前很刺眼，但是最後有出現清淡的板塊，感覺用戶心理變化很大，這一塊的背景設置應該還是以淡色為主，雖然用戶最終影響不大，但是，速度慢的時候，還是很明顯的。
/ o. t7 C5 o# ^! X6 s用戶體驗永遠是和時間成反比的。正如前幾年的 Flash 留言本一樣，雖然會有很好的用戶體驗，但是由於需要載入整個 Flash 才能真正的發揮功效。「用戶等待一個頁面最大的耐心只有八秒」，所以永遠不要期待讓用戶在你所謂的「具有良好用戶體驗」的頁面上會花上那麼多的等待時間。讓我們再來想想為什麼 Ajax 會那麼流行吧。
; m; y$ ~1 n3 Q3 W（7）對於商業網站而言，首屏需要考慮廣告的位置和呈現。這個不要說了吧，眼球最中間就是三幅翻動廣告，廣告鼠標放在下面數字上會出現相對應的圖片，下面對應的數字會變大，背景變暗，以前面區分開來，這個讓用戶有控制權，讓用戶掌握所有操作的主動權，感覺產品是為他服務，廣告也是自己需要的，廣告雖然對網站的生存很重要，但是 Taobao 的廣告還不是很令討厭，已經成為首頁設計的一分子，這方面他們處理得很不錯。
廣告和用戶體驗永遠是網站設計甚至可以說是網站盈利上的一座天平。這點我想我們可以借鑒一下 Google 的做法：讓用戶永遠認為他們在使用的是我們提供的產品，而不是讓用戶「被動地」去看所謂的廣告。廣告對於網站的發展固然重要，但是絕對不是最重要的！
Taobao 的首頁改版，整體來說還是很成功的，功能板塊比之前清晰了不少，立體感也強了很多，給人感覺很好，之前的頁面感覺信息有點匱乏，而且信息冗余很多，經常進來，就陷入迷失狀態（會不感覺有點馬後炮的感覺，呵呵，不過這的確是我的最初的感覺，首頁信息的雜亂，影響了用戶最網站忠誠度，現在的改版，整體感覺更清新，頁面功能也更明瞭，對用戶的操作也有一定的引導性整體來說，個人感覺改版還是非常成功的，至少在一定程度上我在首頁關注的時間比以前多很多，很多有用的信息，在首頁就能找到。目前還在學習相關理論，等書全看完了，再過來分析一下～

軟文？