網頁設計費茨法則的應用

前言:尋找寫作靈感?中文期刊網用心挑選的網頁設計費茨法則的應用,希望能為您的閱讀和創作帶來靈感,歡迎大家閱讀并分享。

網頁設計費茨法則的應用

隨著互聯網的發展,現在的人們會花費更多的時間瀏覽網頁、網站。然而網頁上每一部分的大小,每一部分的長寬比,都是怎樣的數值才能讓用戶獲得更好的體驗跟更精準的點擊呢?有沒有一種科學的依據呢?費茨法則就是一種科學的界定大小、長寬比的非??茖W的法則。依據費茨法則,可以設計出擁有更好用戶體驗的網頁。

一、費茨法則是什么

費茨法則(Time=a+blog2(D/S+1)),其中D是鼠標到達目標的距離,S是目標的寬度或者說是目標的尺寸,a代表設備的啟停時間(截距),b代表設備的固有的固有速度(斜率)。費茨法則主要是為人機交互提供了一個度量的法則,每個目標的大小,距離屏幕的距離都提供了一個科學的依據。其實費茨法則已經運用在電腦操作的各方各面上,不僅僅是網頁設計。一打開電腦,桌面上的圖標的默認大小就是經過費茨法則設計過的,才能使用戶在使用的時候既能快速又能準確的點擊到客戶想要點擊的目標。

二、費茨法則的應用

費茨法則在生活中的方方面面都是在使用著的,例如汽車的設計。汽車的剎車和油門的大小就是經過費茨法則設計過的。在汽車上,剎車和油門的距離較近,并且剎車的大小比油門大一些,這就是運用了費茨法則進行的設計。剎車與油門距離較近,可以使得使用者能盡快的踩到想要踩到的目標,而剎車的大小較大可以使用戶想要踩剎車時比較快速的踩到剎車,防止一些事故的發生。然而在游戲廳的賽車游戲中,剎車和油門的大小與正常車的大小成反比,也就是油門比較大,剎車比較小。這是因為在賽車游戲中,操作者更加需要快速踩到油門的時間比較多,需要踩剎車的時間比較小。而且操作者會希望比較快速的完成游戲,踩油門的幾率十分高。在電腦操作系統上費茨法則的運用頻率也是十分高的,例如windows系統和macintosh系統。非常大的一個差別就是macintosh系統的工具欄是始終在屏幕最頂端,而windows系統的工具欄是在標題欄的下方。事實表明,工具欄固定放在屏幕最頂端比放在工具欄下方更容易點擊。當鼠標想要點擊工具欄時,使用macintosh系統可以鼠標直接向上移,不用擔心會因為移動的距離過于大而無法快速的點擊目標,而使用windows系統時就需要斟酌一下鼠標移動的距離,不然就會因為移動的距離過大而錯過目標。

三、費茨法則在網頁設計中的應用

很多設計者其實在無意中都會運用費茨法則來進行設計。比如最經常用到的百度網站,它就會把一些經常用到的按鈕比較集中的放在一起。同時,搜索引擎最重要的搜索框放在最中間,最醒目的地方,并且在讓用戶舒服的前提下讓搜索框盡量的大一些,使用戶能更快速更精準的點擊到搜索框。微博也是一個很好的費茨法則的例子,還未登陸之前,重要的登錄入口和一些活動頁放在最頂端也是最醒目的地方,同時能吸引住還未注冊的用戶注冊并同時進行廣告宣傳。登陸入口就在活動區域的右側,能順利且快速的找到并點擊想要的目標,同時將登陸入口放在右邊較醒目的位置能減少用戶使用鼠標從當前位置到目標的路程距離。登陸進入后的頁面,新微博占據了較大的空間位置。想新微博的用戶能迅速準確的找到自己想要尋找的目標進行新微博的,不想新微博的用戶可以運用滾輪進行瀏覽。在利用滾輪進行瀏覽時,微博的用戶信息的大小就進行了一番設計。頭像占據了一塊比較大的距離,那是因為比起文字,大多數人更傾向于記憶圖片。然后是用戶的名稱,用戶名稱也是使用的用戶經常會點擊的區域,所以用戶名也是比較大的。相對來講,點擊微博時間的人數會少很多,所以在設計上,時間運用了比較小的字體,占據的位置也不是十分重要。微博內容有時會十分長且復雜,所以設計者在設計內容布局上比較注重文字的清晰程度,運用了和用戶名相同的大小,但是更加清晰的文字來使用戶更加清晰快速的獲得想要獲得的信息。費茨法則在網頁中的應用多種多樣,比較常見的就是運用在鏈接的點擊區域上,例如登陸界面,用戶名輸入框的大小、長寬比,密碼輸入框的大小、長寬比,確認和注冊按鈕的長寬比,他們之間的距離,在頁面中的位置都可以運用費茨法則來進行設計。費茨法則在網頁設計中的應用是十分廣泛的。雖然費茨法則的應用十分廣泛且實用,但是也不必刻板的遵循費茨法則。有時,脫離了費茨法則定義的設計反而會使得網頁更加生動有趣。費茨法則在網頁設計中主要是給點擊區域,文字,圖片的大小和長寬比以及各種元素之間的距離給定了一個可以依靠的科學依據。讓設計者們在設計時可以擁有一個站得住腳的科學依據。

四、結束語

本文主要就費茨法則的應用進行了討論。經過本文的討論可以發現,費茨法則是與我們生活息息相關的一條法則。不止是在小小的電腦屏幕上,只要是人類與機器的交互上就會或多或少的使用到費茨法則。只是某些時候費茨法則不應當是一個約束,只是將其當做一個可以合理解釋為何這樣設計、為何設計成這樣的科學依據將能更好的理解與應用費茨法則。

作者:侯曉雨 單位:山東女子學院

亚洲精品一二三区-久久