昨天美國(guó)雅虎正式宣布網(wǎng)站首頁(yè)的新版，這也算互聯(lián)網(wǎng)一件大事，尤其是對(duì)設(shè)計(jì)的朋友們。而且現(xiàn)在的美國(guó)雅虎的情況也不是很好的情況下有大刀闊斧的進(jìn)行改版，也算是要有一些魄力了。其實(shí)這次新版早在幾個(gè)月前就已經(jīng)在某位同行的博客中透露出來(lái)，不過(guò)當(dāng)時(shí)沒(méi)有過(guò)多注意。昨天宣布正式改版以后，上去逛了一圈，才仔細(xì)的研究了一下。總體的評(píng)價(jià)就是這次的改版就相當(dāng)于Vista到Win7，也就是說(shuō)內(nèi)核不變，但是在交互和體驗(yàn)上下功夫。
1.布局
新版的布局和舊版的布局，幾乎沒(méi)有任何區(qū)別，頂部搜索框，左側(cè)導(dǎo)航，中間重要新聞資訊。主要是右側(cè)，新版去掉了很雞肋的個(gè)人信息區(qū)塊，把登錄信息放到了頂部右側(cè)一條。把舊版放到右側(cè)最下面的熱門(mén)搜索關(guān)鍵字替換，放到了右側(cè)上面變成第一區(qū)塊。
2.搜索
雅虎是一個(gè)門(mén)戶，雅虎是一個(gè)搜索引擎。這次新版中，進(jìn)一步把頂部的搜索框進(jìn)行了優(yōu)化。
2.1.提高位置：新版中的一個(gè)核心就是更加突出搜索功能的重要性，那么出現(xiàn)的位置就是第一重要的，所以雅虎干脆把一直品牌核心的logo放在了右側(cè)，把搜索功能提到了整個(gè)頁(yè)面的最有優(yōu)先的位置，這樣用戶一打開(kāi)頁(yè)面一個(gè)大大的搜索框經(jīng)映入眼簾。
2.2.加大面積：要想引起人的注意，一個(gè)更直接的處理方式就是讓物體看起來(lái)更大。所以雅虎為了讓用戶對(duì)搜索框更加注意，就再一次加大了搜索框的大小。
2.3.視覺(jué)效果：看得出雅虎的設(shè)計(jì)師為了這個(gè)搜索框可謂是煞費(fèi)苦心，而新版的設(shè)計(jì)理念我理解為是讓搜索框本身更突出，而不是搜索區(qū)域。我們可以對(duì)比一下舊版和日本、韓國(guó)版的搜索功能設(shè)計(jì)。這些設(shè)計(jì)都是為了讓搜索功能更加突出，所以加大了整個(gè)搜索功能區(qū)塊的視覺(jué)效果。也就是以整體區(qū)塊效果突出，帶動(dòng)整個(gè)功能突出。而新版去掉了濃重的背景色，更加突出了搜索框的視覺(jué)效果。也就是用局部關(guān)鍵控件的效果突出，帶動(dòng)整個(gè)功能的突出。
2.4.切換：在這個(gè)搜索功能區(qū)域除了搜索按鈕以外，最常用的就要是搜索類(lèi)型切換了。而切換功能往往是一般設(shè)計(jì)中不太被重視的。從舊版、日版、韓版都可以看出。切換類(lèi)型只是用了很簡(jiǎn)單的文字鏈接而已。而新的設(shè)計(jì)中為了讓切換點(diǎn)擊起來(lái)更有手感，不僅加大了文字的尺寸，而且采用了tab的方式與搜索框融為一體。
從上一次改版以后，雅虎把原來(lái)頂部的導(dǎo)航放到了右側(cè)。而我覺(jué)得這一次改版最大的亮點(diǎn)就是左側(cè)導(dǎo)航。我們都知道雅虎是一個(gè)門(mén)戶網(wǎng)站，但是雅虎還是世界上最早的網(wǎng)絡(luò)目錄。如果你要問(wèn)什么是網(wǎng)絡(luò)目錄？看看hao123.com就知道了。
網(wǎng)絡(luò)目錄（web directory）是網(wǎng)頁(yè)鏈接的列表。
門(mén)戶網(wǎng)站（web protal）是人們上網(wǎng)的起點(diǎn)網(wǎng)站。
所以為了凸顯門(mén)戶網(wǎng)站的搜索特性，所以上面說(shuō)道搜索部分采用了新的設(shè)計(jì)。而為了凸顯門(mén)戶網(wǎng)站目錄的特性，雅虎這次改版也從新設(shè)計(jì)了左側(cè)導(dǎo)航。左側(cè)導(dǎo)航不僅可以自定義雅虎本身提供的服務(wù)，還可以自定義當(dāng)下其它站點(diǎn)的服務(wù)，譬如ebay，facebook，mysapce等。而這次雅虎最關(guān)鍵的一點(diǎn)不僅是解決定制的問(wèn)題，而且還試圖解決信息問(wèn)題。就是說(shuō)不僅希望用戶可以自定義網(wǎng)站目錄，而且還可以在上面處理這些站點(diǎn)的信息。
我們發(fā)現(xiàn)其實(shí)這個(gè)概念并不新鮮，在美國(guó)有好多站點(diǎn)都提供類(lèi)似的服務(wù)，最有代表性的就是Google的IG。IG通過(guò)用戶自定義一些站點(diǎn)Widget放到首頁(yè)上，形成自己的個(gè)性首頁(yè)。不過(guò)有意思的是所以提供類(lèi)似服務(wù)的網(wǎng)站幾乎都是采用widget的方式。也就是說(shuō)同一種理念和同一樣的設(shè)計(jì)模式。
而雅虎這次采用了全新的交互設(shè)計(jì)模式來(lái)處理這個(gè)問(wèn)題，把目錄和信息瀏覽有基的結(jié)合一起。當(dāng)用戶有鼠標(biāo)懸浮在左側(cè)導(dǎo)航上時(shí)，右側(cè)出現(xiàn)這個(gè)站點(diǎn)的最新消息和最常用的操作。那這個(gè)和上面的widget有什么不同呢？
雖然Widget看上去很好，但是真的要用起來(lái)確實(shí)不那么爽，不爽的就原因就是雖然我可以琳瑯滿目的把整個(gè)頁(yè)面布置的很滿。但是這個(gè)頁(yè)面最關(guān)鍵的作用就是快速處理最新信息，并且快速操作。也就是監(jiān)控信息，操作需要處理的信息。而Widget全部扔在一個(gè)頁(yè)面上，如果數(shù)量比較多，根本很難進(jìn)行監(jiān)控，既然很難監(jiān)控也無(wú)從談起對(duì)信息的操作了。再有一個(gè)用戶的頁(yè)面空間是有限的，所以每一個(gè)widget的大小都是固定的，而且相對(duì)來(lái)說(shuō)都是比較小，這樣就更加不容易進(jìn)行信息的監(jiān)控和處理了。
那我們看看雅虎的處理方式的特點(diǎn)：拿雅虎信箱為例，當(dāng)我打開(kāi)雅虎首頁(yè)，瀏覽左側(cè)導(dǎo)航，就可以迅速查看雅虎標(biāo)簽是否有數(shù)字提示，如果有就證明是有新的郵件了，如果沒(méi)有就證明沒(méi)有新的郵件。然后把鼠標(biāo)懸浮到標(biāo)簽上右側(cè)上，可以用效大的區(qū)域顯示最新的郵件標(biāo)題，然后進(jìn)行處理。
可見(jiàn)雅虎新的左側(cè)導(dǎo)航，不僅可以讓用戶自定義收藏常用的網(wǎng)絡(luò)服務(wù)，還可以迅速的篩選那些服務(wù)需要有信息處理，并且提供信息處理快捷的操作方式。也就是“快交互”+“信息片段”結(jié)合的處理方式。這種設(shè)計(jì)理念的最經(jīng)典案例就是Twitter和新版的Facebook登錄后首頁(yè)。
4、視覺(jué)風(fēng)格
新版的視覺(jué)風(fēng)格繼承了上一版低調(diào)華麗的特質(zhì)，同時(shí)又處理的更加清新。最明顯的一個(gè)處理方式就是去掉了標(biāo)題欄的漸變效果，采用最樸實(shí)的文字無(wú)背景。并且為了更加突出視覺(jué)效果，加大了這些標(biāo)題文字的字號(hào)。去掉了左側(cè)導(dǎo)航整體紋理漸變方式，采用一個(gè)目錄標(biāo)簽一個(gè)小按鈕的設(shè)計(jì)。不僅單獨(dú)一個(gè)目錄標(biāo)簽做為小按鈕很突出，而且整體疊加以后效果也很協(xié)調(diào)舒服。
總體來(lái)說(shuō)這次美國(guó)雅虎改版是否成功，這個(gè)還要看正式運(yùn)行以后的數(shù)據(jù)，但是我認(rèn)為總體效果要比上一個(gè)版本要好很多。并且對(duì)不斷努力創(chuàng)新的設(shè)計(jì)師表示欽佩。
