malirun 2009-12-27 01:02
火狐4.0 全新介面亮相
Firefox近期也更新了不少次,不過小編一直期待據說[b]會有加速偵測功能的3.6版[/b]倒是還沒出現。
而最近Mozilla Firefox介面更新計畫參與者之一的[b]Stephen Horlander[/b]在其個人部落格中透露了目前關於Firefox 4.0的全新介面內容。
Stephen Horlander透露新的介面預計將精簡目前現有的Firefox功能選單,而將參考微軟自Office 2007以及後續應用於Windows 7小畫家、WordPad等附屬應用程式的[b]「Ribbon UI」標籤式工具列介面[/b]設計,藉此讓操作介面更為簡單並減少功能選單所會佔去的空間,同時藉由分頁標籤來區隔功能群組。
目前較為明顯的變更如下︰
[img]http://mag.udn.com/html/digital/UDNMAG/2009/1225/01.jpg[/img](
圖/擷自Stephen Horlander個人部落格)
01.App Button介面開發成員先參考了蘋果Safari與Google Chrome的設計,研究如何將選單加以簡化,因此便有了先前所提出的[b]「Page」、「Tools」兩個按鈕[/b]產生。
但他們依然覺得這樣子的設計有好有壞,於是目前他們參考了微軟「Ribbon UI」介面概念中的「App Button」功能,而使新版本的Firefox畫面可以更為簡單。 [img]http://mag.udn.com/html/digital/UDNMAG/2009/1225/02.jpg[/img]
微軟「Ribbon UI」介面概念
(圖/擷自Stephen Horlander個人部落格)[/td][/tr][/table]而在Firefox 4.0的App Button將會以文字方式呈現,而不採用圖示表現,原因是避免使用者無法清楚立即理解按鈕功能。另外原本最上方會顯示網頁名稱的欄位將會被取消,而改為擺放App Button以節省空間 (也可避免原本同時顯示名稱列與分頁標籤內容時過於雜亂的情形)。
另外,App Button呈現方式以及擺放位置也有不同決定,以下為開發小組曾經提出的呈現樣式︰ [img]http://mag.udn.com/html/digital/UDNMAG/2009/1225/06.jpg[/img]
(圖/擷自Stephen Horlander個人部落格)
[b]02.工具列按鈕[/b] Firefox 4.0重新設計過的工具列按鈕將會在視覺上變得更加簡潔且明顯。
[b]03.網址列[/b] Firefox 4.0的網址列中作了一些調整,變得更有視覺上的功用,例如讓使用者可以清楚知道目前所瀏覽的頁面內容來源、標示網址中主要網域名稱等。
[b]04.搜尋列[/b] 開發小組認為搜尋應該維持其簡潔的操作模式,因此將原本即獨立使用的搜尋列保留下來。
[b]05.書籤按鈕[/b] 新的書籤按鈕有兩種顯示方式︰當書籤工具列選擇為不顯示時,書籤按鈕會位於搜尋列右側;當書籤工具列選擇為顯示時,書籤按鈕就會出現在書籤工具列上。 [b][color=#0066cc]未定的分頁位置[/color][/b] 目前部份分頁位置還在商議中,以下為現行所列出來的候選顯示狀態︰ ‧分頁標籤位於頂端,網址列下方增加書籤工具列。
[img]http://mag.udn.com/html/digital/UDNMAG/2009/1225/03.jpg[/img]
(圖/擷自Stephen Horlander個人部落格)‧分頁標籤位於網址列下方,不顯示書籤工具列。
[table=205][tr][td=1,1,203][table=98%,#eeeeee][tr][td][img]http://mag.udn.com/html/digital/UDNMAG/2009/1225/04.jpg[/img][/td][/tr][tr][td](圖/擷自Stephen Horlander個人部落格)[/td][/tr][/table][/td][/tr][/table]‧分頁標籤位於網址列下方,同時也增加書籤工具列。
[img]http://mag.udn.com/html/digital/UDNMAG/2009/1225/05.jpg[/img]
(圖/擷自Stephen Horlander個人部落格)
[b][color=#0066cc]4.0與3.5外觀比較[/color][/b] 以下為Firefox4.0預計呈現外觀與3.5外觀作比較,明顯看得出來那邊不一樣了吧?
[table=205][tr][td=1,1,203][img]http://mag.udn.com/html/digital/UDNMAG/2009/1225/07.jpg[/img][/td][/tr][/table]