建站常識
三言兩語:美國雅虎首頁改版
2009-07-24 07:52:00
昨天美國雅虎正式宣布網(wǎng)站首頁的新版,這也算互聯(lián)網(wǎng)一件大事,尤其是對設(shè)計的朋友們。而且現(xiàn)在的美國雅虎的情況也不是很好的情況下有大刀闊斧的進行改版,也算是要有一些魄力了。其實這次新版早在幾個月前就已經(jīng)在某位同行的博客中透露出來,不過當(dāng)時沒有過多注意。昨天宣布正式改版以后,上去逛了一圈,才仔細的研究了一下。總體的評價就是這次的改版就相當(dāng)于Vista到Win7,也就是說內(nèi)核不變,但是在交互和體驗上下功夫。
1.布局
新版的布局和舊版的布局,幾乎沒有任何區(qū)別,頂部搜索框,左側(cè)導(dǎo)航,中間重要新聞資訊。主要是右側(cè),新版去掉了很雞肋的個人信息區(qū)塊,把登錄信息放到了頂部右側(cè)一條。把舊版放到右側(cè)最下面的熱門搜索關(guān)鍵字替換,放到了右側(cè)上面變成第一區(qū)塊。
2.搜索
雅虎是一個門戶,雅虎是一個搜索引擎。這次新版中,進一步把頂部的搜索框進行了優(yōu)化。
2.1.提高位置:新版中的一個核心就是更加突出搜索功能的重要性,那么出現(xiàn)的位置就是第一重要的,所以雅虎干脆把一直品牌核心的logo放在了右側(cè),把搜索功能提到了整個頁面的最有優(yōu)先的位置,這樣用戶一打開頁面一個大大的搜索框經(jīng)映入眼簾。
2.2.加大面積:要想引起人的注意,一個更直接的處理方式就是讓物體看起來更大。所以雅虎為了讓用戶對搜索框更加注意,就再一次加大了搜索框的大小。
2.3.視覺效果:看得出雅虎的設(shè)計師為了這個搜索框可謂是煞費苦心,而新版的設(shè)計理念我理解為是讓搜索框本身更突出,而不是搜索區(qū)域。我們可以對比一下舊版和日本、韓國版的搜索功能設(shè)計。這些設(shè)計都是為了讓搜索功能更加突出,所以加大了整個搜索功能區(qū)塊的視覺效果。也就是以整體區(qū)塊效果突出,帶動整個功能突出。而新版去掉了濃重的背景色,更加突出了搜索框的視覺效果。也就是用局部關(guān)鍵控件的效果突出,帶動整個功能的突出。
2.4.切換:在這個搜索功能區(qū)域除了搜索按鈕以外,最常用的就要是搜索類型切換了。而切換功能往往是一般設(shè)計中不太被重視的。從舊版、日版、韓版都可以看出。切換類型只是用了很簡單的文字鏈接而已。而新的設(shè)計中為了讓切換點擊起來更有手感,不僅加大了文字的尺寸,而且采用了tab的方式與搜索框融為一體。
3.導(dǎo)航
從上一次改版以后,雅虎把原來頂部的導(dǎo)航放到了右側(cè)。而我覺得這一次改版最大的亮點就是左側(cè)導(dǎo)航。我們都知道雅虎是一個門戶網(wǎng)站,但是雅虎還是世界上最早的網(wǎng)絡(luò)目錄。如果你要問什么是網(wǎng)絡(luò)目錄?看看hao123.com就知道了。
網(wǎng)絡(luò)目錄(web directory)是網(wǎng)頁鏈接的列表。
門戶網(wǎng)站(web protal)是人們上網(wǎng)的起點網(wǎng)站。
所以為了凸顯門戶網(wǎng)站的搜索特性,所以上面說道搜索部分采用了新的設(shè)計。而為了凸顯門戶網(wǎng)站目錄的特性,雅虎這次改版也從新設(shè)計了左側(cè)導(dǎo)航。左側(cè)導(dǎo)航不僅可以自定義雅虎本身提供的服務(wù),還可以自定義當(dāng)下其它站點的服務(wù),譬如ebay,facebook,mysapce等。而這次雅虎最關(guān)鍵的一點不僅是解決定制的問題,而且還試圖解決信息問題。就是說不僅希望用戶可以自定義網(wǎng)站目錄,而且還可以在上面處理這些站點的信息。
我們發(fā)現(xiàn)其實這個概念并不新鮮,在美國有好多站點都提供類似的服務(wù),最有代表性的就是Google的IG。IG通過用戶自定義一些站點Widget放到首頁上,形成自己的個性首頁。不過有意思的是所以提供類似服務(wù)的網(wǎng)站幾乎都是采用widget的方式。也就是說同一種理念和同一樣的設(shè)計模式。
而雅虎這次采用了全新的交互設(shè)計模式來處理這個問題,把目錄和信息瀏覽有基的結(jié)合一起。當(dāng)用戶有鼠標懸浮在左側(cè)導(dǎo)航上時,右側(cè)出現(xiàn)這個站點的最新消息和最常用的操作。那這個和上面的widget有什么不同呢?
雖然Widget看上去很好,但是真的要用起來確實不那么爽,不爽的就原因就是雖然我可以琳瑯滿目的把整個頁面布置的很滿。但是這個頁面最關(guān)鍵的作用就是快速處理最新信息,并且快速操作。也就是監(jiān)控信息,操作需要處理的信息。而Widget全部扔在一個頁面上,如果數(shù)量比較多,根本很難進行監(jiān)控,既然很難監(jiān)控也無從談起對信息的操作了。再有一個用戶的頁面空間是有限的,所以每一個widget的大小都是固定的,而且相對來說都是比較小,這樣就更加不容易進行信息的監(jiān)控和處理了。
那我們看看雅虎的處理方式的特點:拿雅虎信箱為例,當(dāng)我打開雅虎首頁,瀏覽左側(cè)導(dǎo)航,就可以迅速查看雅虎標簽是否有數(shù)字提示,如果有就證明是有新的郵件了,如果沒有就證明沒有新的郵件。然后把鼠標懸浮到標簽上右側(cè)上,可以用效大的區(qū)域顯示最新的郵件標題,然后進行處理。
可見雅虎新的左側(cè)導(dǎo)航,不僅可以讓用戶自定義收藏常用的網(wǎng)絡(luò)服務(wù),還可以迅速的篩選那些服務(wù)需要有信息處理,并且提供信息處理快捷的操作方式。也就是“快交互”+“信息片段”結(jié)合的處理方式。這種設(shè)計理念的最經(jīng)典案例就是Twitter和新版的Facebook登錄后首頁。
4、視覺風(fēng)格
新版的視覺風(fēng)格繼承了上一版低調(diào)華麗的特質(zhì),同時又處理的更加清新。最明顯的一個處理方式就是去掉了標題欄的漸變效果,采用最樸實的文字無背景。并且為了更加突出視覺效果,加大了這些標題文字的字號。去掉了左側(cè)導(dǎo)航整體紋理漸變方式,采用一個目錄標簽一個小按鈕的設(shè)計。不僅單獨一個目錄標簽做為小按鈕很突出,而且整體疊加以后效果也很協(xié)調(diào)舒服。
總體來說這次美國雅虎改版是否成功,這個還要看正式運行以后的數(shù)據(jù),但是我認為總體效果要比上一個版本要好很多。并且對不斷努力創(chuàng)新的設(shè)計師表示欽佩。
近期更新
- [2023-06-25 23:22:29] 優(yōu)秀網(wǎng)站設(shè)計的五大特點
- [2023-04-27 14:05:55] Html 5 響應(yīng)式網(wǎng)站設(shè)計制作
- [2023-04-10 11:07:30] 網(wǎng)站建設(shè)制作流程知多少
- [2022-10-14 10:11:30] 做網(wǎng)站設(shè)計應(yīng)該更看重框架搭建還是視覺觀感?
- [2022-08-09 15:57:48] 以“產(chǎn)品”思維搭建網(wǎng)站!
- [2022-08-08 09:12:57] 一家公司的網(wǎng)站應(yīng)該有哪些板塊內(nèi)容?
- [2022-08-05 09:28:06] 企業(yè)網(wǎng)站建設(shè)為什么要設(shè)置新聞板塊?
- [2022-07-04 15:58:06] 網(wǎng)站首頁設(shè)計的好看,這個網(wǎng)站就成功了一大半!
- [2022-05-20 09:34:19] 網(wǎng)站后臺管理系統(tǒng)是什么?有什么作用?
- [2022-05-17 11:29:32] 作為消費者,應(yīng)該如何選擇一家水平高的網(wǎng)站建設(shè)公司
- [2022-05-17 11:27:01] 高端網(wǎng)站定制與模板化網(wǎng)站應(yīng)該怎么選擇?
- [2022-04-22 16:00:41] 現(xiàn)在高端的網(wǎng)站設(shè)計都有哪些新的趨勢?
延伸閱讀
- [2009-10-22 08:15:00] 為什么這么設(shè)計:支付寶首頁改版
- [2019-02-27 09:13:37] 網(wǎng)站為什么要改版你知道嗎?
- [2007-12-03 22:42:00] 有感豆瓣的改版
- [2007-06-22 12:26:00] 非設(shè)計師談設(shè)計之Apple改版
- [2007-12-18 12:30:00] 網(wǎng)站改版方案的一些建議
- [2007-08-23 12:24:00] 臭魚:QQ空間大頭貼改版設(shè)計總結(jié)
- [2010-04-09 11:32:00] 《絲路英雄》官網(wǎng)改版設(shè)計總結(jié)與心得
- [2007-01-04 15:02:00] Sun首頁改版分析
- [2010-04-23 08:36:00] 頻繁改版引發(fā)的合意性思考
- [2007-11-23 12:30:00] 網(wǎng)站改版:先沐浴再更衣
- [2009-10-13 08:01:00] 再談網(wǎng)易首頁的改版
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計解決方案 機械行業(yè)網(wǎng)站設(shè)計解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計解決方案 科技企業(yè)網(wǎng)站設(shè)計解決方案 電子家電網(wǎng)站設(shè)計解決方案 食品行業(yè)網(wǎng)站設(shè)計解決方案 集團公司網(wǎng)站設(shè)計解決方案 企事業(yè)單位網(wǎng)站設(shè)計解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計解決方案 健身運動網(wǎng)站設(shè)計解決方案 美容與化妝品網(wǎng)站設(shè)計解決方案 建筑設(shè)計行業(yè)網(wǎng)站設(shè)計解決方案 物流行業(yè)網(wǎng)站設(shè)計解決方案
TAGS關(guān)鍵字
網(wǎng)站建設(shè),企業(yè)網(wǎng)站建設(shè) 青島高端網(wǎng)站建設(shè)公司哪家好 html和css 網(wǎng)頁設(shè)計 圖形網(wǎng)格 青島SEO 微官網(wǎng)帶來的好處 青島海洋投資集團 SEO 舒適的界面 網(wǎng)站改版 交互設(shè)計 手機網(wǎng)站建設(shè) IT資訊 網(wǎng)站交互設(shè)計 官網(wǎng)網(wǎng)站建設(shè) GOOGLE 網(wǎng)站品牌 企業(yè)網(wǎng)站設(shè)計 如何做網(wǎng)站優(yōu)化 青島網(wǎng)絡(luò)公司 網(wǎng)站的速度 php程序 響應(yīng)式設(shè)計 青島網(wǎng)站建設(shè)基礎(chǔ)知識 網(wǎng)站推廣 企業(yè)網(wǎng)站建設(shè) 青島flash網(wǎng)站 青島網(wǎng)站建設(shè) 搜索引擎蜘蛛