淺談Firefox與Chrome的設計理念
如你所見,我本人一直都是一個Firefox的重度用戶。所以我寫的關于Firefox的文章絕對不在少數,比如前幾天的這篇文章中,就十分詳細的闡述了我為什么選擇火狐瀏覽器。
最近這幾天來,瀏覽器市場可謂是硝煙彌漫。先是網民集體為IE6舉行了葬禮;接著是微軟官方宣布IE9將完美支持HTML5;號稱地球上最快的Opera10.5如期發布;在這一切塵埃尚未落定的時候,Firefox又因為難以逾越25%的市場占有率而被人抨擊;隨即Mozila也迅速反擊,稱Firefox之所以在JS上效率不如其他瀏覽器并不是因為技術差,而是因為其他瀏覽器支持的JS遠沒有Firefox完善。你來我往,真是好不熱鬧。
作為我自己來說,目前這些主流的瀏覽器里,最令我感興趣的瀏覽器主要有兩個,那就是Mozilla的Firefox和Google的Chrome。這兩款瀏覽器我基本上都在同步更新著最新的nightly/dev版本,對他們也都有所了解。至于Opera,這確實是一款很強大的瀏覽器,也有諸多創新,但很可惜的是,他并不適合我,而我顯然也不能夠對自己所不了解的東西加以評論。
無論是Firefox和Chrome,現在他們都已經有了相當數量的擴展程序,而合理的使用這些擴展幾乎可以實現一切你所需要的功能。如果只是大概的從功能的角度上出發,輕易的下結論對于任何一個沒有安裝擴展的瀏覽器都是不公平的。因此,我將會盡量客觀的,從這兩款瀏覽器的設計理念的角度出發,對其進行評論。
一、界面
界面是軟件帶給用戶的第一感覺,界面的好壞也在很大程度上決定了一個第一次接觸該軟件的用戶是否還有興趣繼續使用下去。一個軟件的默認界面是最能代表其設計理念的。我的這一觀點從未發生過改變,因為對此界面的評論當然放在第一位。
Firefox和Chrome的界面有許多的不同,具體如上面的那張截圖。圖中我使用的是Firefox(Nightly的測試版被稱作Minefield) 3.7a3pre 和 Chrome 5.335.1 dev,都已經設置回了他們的默認界面。他們現在的版本可能與最初的版本在界面上有了一定的變化,但是其核心的設計理念是沒有改變的。
我實在沒有興趣在諸如后退按鈕的大小不同等等細枝末節的事情上下功夫,這是需求分析和交互設計該研究的事情,所帶來的可能僅僅是用戶體驗的改變,而非用戶行為習慣的改變。這些細節與其最核心的設計理念往往并沒有最直接的聯系。所以讓我們直接從重點開始。
1.1 標簽
如圖,上面是Chrome,下面是Firefox。除去Chrome在打開空白頁面時默認顯示的內容,標簽欄的位置想必是讓人感覺最為明顯的一個區別了。
- Firefox的標簽欄較為傳統;他被放置在地址欄和書簽欄的下方;標簽欄之后直接就是網頁的內容;每個標簽欄都分割了一個不同的網頁。
- Chrome的標簽欄是一種大膽的創新,他甚至取代了原有的標題欄;標簽欄被放置在瀏覽器的最上方,再往下依次是地址欄和書簽欄;因為標簽欄就是標題欄的緣故,每個標簽頁都分割了一個不同的瀏覽器。
Firefox的設計十分的傳統。早在Firefox出現之前,許多的標簽式瀏覽器就已經在使用這樣的設計了。默認將書簽欄放在標簽欄的上方,點擊之后,瀏覽器會開始在不同的標簽中展示出網頁內容。所以說,Firefox的每一個標簽分割的都是不同的網頁。
Chrome的標簽欄設計的確令人感到驚嘆,但熟悉了之后確又感覺非常舒服。他大膽的將標簽欄和常見的標題欄融合到了一起;點開一個新標簽之后,首先看到的是常規的工具欄,再往下是書簽欄;點擊書簽欄,網頁的內容便會直接在當前標簽頁中展示。因此我前面說,Chrome每個標簽頁風格的都是一個不同的瀏覽器。
Chrome的這種設計或許和他每個標簽頁均有獨立進程的安全設定有關,但更重要的原因是,這種設計凸顯出了Chrome獨特的設計理念:瀏覽器的一切功能均是為了更好的展示網頁的內容。
顯然,Firefox并沒有能夠通過其自身的界面,向我們展示出什么特別的東西來。
1.2 搜索
老樣子,仍然上半部分是Chrome,下半部分是Firefox。
網絡一個很重要的組成部分,就是搜索,而搜索正是Google的長處。于是我們再次看到Chrome對于地址欄搜索大刀闊斧的改進。
地址欄的瀏覽記錄搜索,這是兩款瀏覽器都有的功能。直接在地址欄中輸入,瀏覽器就會從你的瀏覽歷史和書簽中搜索結果并展示。這是一種非常方便的管理模式,畢竟隨著上網時間的累積,書簽也會越來越多。
他們的不同之處也是非常明顯——
- Firefox的設定仍舊傳統,地址欄搜索本地的瀏覽資料,對于網頁內容則在獨立的搜索框中進行搜索。如果在地址欄直接輸入文字會默認調用Google的手氣不錯直接打開結果網站。
- Chrome將常規的地址欄和搜索欄整合到了一起,無論你想搜索在本機的瀏覽資料還是網絡上的資訊,全部都可以在唯一的地址欄中完成。地址欄直接輸入文字調用Google搜索該內容并展示搜索結果。
Chrome的這個設計很有意思,也很大膽。對于那些已經習慣了獨立搜索框設計的用戶而言,這種整合或許會給初次使用帶來一定的迷惑,不過,好在Chrome已經準備了足夠的提示來告訴用戶,這就是你想要的搜索內容。
我認為,Chrome的整合的遠不止是傳統意義上的地址欄與搜索框,還有就是本機的瀏覽資料與網絡的搜索結果,無論用戶需要哪個,都只需在同樣的一個地址欄內完成搜索即可。也可以說,這是Chrome在有意的淡化本地資料與網絡搜索之間的界限。另外,這個設計對于小屏幕的用戶也是很有意義的。
在這個方面,Chrome大幅簡化用戶的搜索動作的目的,想必就是為了讓用戶感覺到:搜索并不是孤立的,而是網絡的一部分。無論是過去訪問過的網頁、收藏起來的書簽、還是只是有一點點印象的內容、或者是想要知道的問題答案、最新的咨詢,全都可以在一個搜索框中完成。從Google.com首頁那唯一的一個搜索框就能看出來,這與Google的簡單哲學是完全相符合的。
1.3 狀態欄
依然是上半部分為Chrome,下面為Firefox。
狀態欄是瀏覽器一個很重要的組成部分,用戶可以在這里看到網頁的載入進度以及預覽連接位置。當然,或許也可以看到瀏覽器某些功能的使用狀態。
Chrome和Firefox的狀態欄可以說完全不同。
- Firefox的狀態欄是常規的狀態欄,可以顯示網頁載入狀況并預覽連接,右邊則會顯示部分已安裝擴展的圖標方便切換其運行狀態。新版本在狀態欄增加了載入進度條。
- Chrome并沒有真正意義上的狀態欄,他只在需要的時候顯示,而其他時間都是隱藏的。不過你仍然可以看到狀態欄最基本的兩個功能:網頁載入狀況和連接預覽。
我不能確定Chrome的這種隱藏式狀態欄是不是首創,因為Opera上卻有類似的功能。不可否認的是,這樣的設計確實使得瀏覽器可以顯示更多的網頁內容,而用戶也不需要花時間去研究那個長長的狀態欄上掛滿的圖標都是干什么用的。
很顯然,這次我們很容易就能想出Chrome的設計理念:瀏覽器只是為了展示網頁內容的一個輔助工具。隱藏式的狀態欄可以讓用戶更容易的將注意力集中在網頁中,只有在需要的時候才會來關注,而不需要付出額外的精力。
Firefox的狀態欄設計幾乎與其他大部分的瀏覽器如出一轍,該有的功能也一個不少。只不過他允許擴展程序自行添加圖標到狀態欄以方便用戶的使用,所以你可以看到上圖中火狐的狀態欄里雖然有了一排的按鈕,但他們全部是由我所安裝的擴展添加上去的,沒有一個是瀏覽器自身的圖標。
直到此時,Firefox終于開始展示出了自身一些獨特的東西:瀏覽器的界面是可以按照用戶的需求自定義的。
1.4 界面總結
不知道各位有沒有聽說過奧卡姆剃刀原理呢?如果沒有的話,在互動百科上有相當詳細的解釋。奧卡姆剃刀原理事實上很容易理解,他歸根結底只有一句話:”萬事萬物應該盡量簡單,而不是更簡單。”
Chrome的界面設計,正是將奧卡姆剃刀原理發揮到了極致,而這也與Google自身的企業哲學是密不可分的。
盡可能的簡化一切麻煩的要素,節省用戶選擇的成本。這就是Chrome在界面設計上的信仰。而正是這種簡潔,給Chrome帶來了驚人的用戶,幾乎每個人都為他的這些獨特的設計而折服。這所有的設計看似大膽,而實際上確是真正的在從用戶角度出發,將一切盡可能簡單到了極致之后所帶來的結果。
Firefox的一切設計都符合人們對于瀏覽器的傳統認知,他并沒有試圖從本質上改變什么。但是我們仍然可以從中看出些什么,那就是剛才提到過的,界面的按需定制。幾乎每個稍有經驗的火狐用戶,他的瀏覽器界面都是與眾不同的。如果你愿意,完全可以把Firefox定制的和Chrome一摸一樣。
而這,就是Firefox為我們帶來的東西。
現在,結果已經很明顯了。
- Chrome認為:瀏覽器的界面應當盡可能簡單,一切都應該針對用戶行為來進行最大幅度的簡化。
- Firefox認為:瀏覽器的界面應當盡可能靈活,一切都可以按照用戶的需求進行最大幅度的自定義。
究竟你喜歡的是簡單,還是按需定制呢?
再怎樣華麗的界面,最終也是依托在瀏覽器自身的功能上的。只有分析了核心的功能,才能夠更加深入的了解他們使用現在這樣的界面設計的真正目的。