菲茨定律與互聯(lián)網(wǎng)設(shè)計 （Fitts’ Law）
菲茨定律是用來預(yù)測從任意一點(diǎn)到目標(biāo)中心位置所需時間的數(shù)學(xué)模型。 它由保羅.菲茨在1954年首先提出。這個模型考慮了用戶定位點(diǎn)的初始位置與目標(biāo)的相對距離以及目標(biāo)的大小。菲茨定律雖然在很多領(lǐng)域都得到了應(yīng)用但其在人機(jī)交互（HCI）和設(shè)計領(lǐng)域的影響卻最為廣泛和深遠(yuǎn)。（用于估算用戶移動光標(biāo)點(diǎn)擊鏈接或控件按鈕所需的時間）目的地明確的移動可以細(xì)分為兩個部分：首先一個大幅度的移動將光標(biāo)移向與目標(biāo)大致相同的方向和區(qū)域；緊接著是一系列精細(xì)的小幅度微調(diào)來將光標(biāo)精確定位在目標(biāo)中心。你現(xiàn)在就可以做一個小實驗來觀察這一過程–舉起你的手臂并試著用手指指向遠(yuǎn)處的一個小物體，例如遠(yuǎn)處墻上的一個電燈開關(guān)。開始你的手臂可能會往開關(guān)的位置大幅的移動而且很有可能稍微過頭了一點(diǎn)。接下來你會做一些微小的調(diào)整動作直至你的手指正好對準(zhǔn)目標(biāo)開關(guān)的中心?，F(xiàn)在你可以試著指向一個更大的物體–比如說電視或一面墻壁。這一次你也會以大幅度的手臂動作來使手指指向目標(biāo)方向， 但因為目標(biāo)體積很大所以一般情況下你只需要做很少（甚至不需要任何)的微調(diào)。
讓我們來看下面這個例子。圖中的紅色盒子代表目標(biāo)；虛線代表從起點(diǎn)至目標(biāo)的移動軌跡，目標(biāo)上灰色左右箭頭之間的范圍是用戶光標(biāo)減速并微調(diào)以彌補(bǔ)誤差的區(qū)域。在右方有一個較大的目標(biāo)，因為面積很大所以用戶從任意點(diǎn)快速點(diǎn)擊應(yīng)該不會很難：
大的目標(biāo)區(qū)域意味著光標(biāo)在目標(biāo)上停下來之前不需要做太精細(xì)的調(diào)整在下一個例子中，屏幕的右方有一個小得多的目標(biāo)所以用戶快速點(diǎn)擊目標(biāo)會困難得多。
因為用戶需要將光標(biāo)移動較長距離而且目標(biāo)面積很小所以在光標(biāo)正確的對準(zhǔn)目標(biāo)前需要做一系列精細(xì)的調(diào)整動作。但如果同樣大小的目標(biāo)距離很近的話，因為到達(dá)目標(biāo)范圍所需的初始動作很小所以準(zhǔn)確點(diǎn)擊它的難度也會小很多。距離越近， 初始動作因為幅度太大而超出目標(biāo)區(qū)域的風(fēng)險就越小。
對于形狀不規(guī)則的目標(biāo)而言，目標(biāo)區(qū)域的大小和移動的方向是相對的。在下面的例子中，如果用戶從和目標(biāo)平行的位置水平移動光標(biāo)，那么這個按鈕的相對目標(biāo)區(qū)域就很大。但如果用戶光標(biāo)的初始位置在目標(biāo)的上方或下方，那么這個長方形按鈕的相對目標(biāo)區(qū)域則小得多。
除了調(diào)整目標(biāo)的大小以外，我們還可以將目標(biāo)放在屏幕的邊緣或角落上來使其更容易被選中。因為在屏幕邊緣和角落位置時它們是“無限可選中”的；具體一點(diǎn)來說就是–有一個隱形的邊界來阻止用戶的初始大幅移動讓光標(biāo)超出目標(biāo)區(qū)域范圍，這樣的話普通指向性移動的第二步“微調(diào)”動作就不需要了。
這個方法在兩大主流OS中都起到了很好的效果：Mac OS X默認(rèn)將底欄（Dock)放到了屏幕的最下方；這樣的話底欄就變得“無限可選中”，因為用戶不能將光標(biāo)移到底欄下方所以在向底欄方向做出大幅度移動后光標(biāo)始終是落在底欄上的。
在Windows中，開始菜單在屏幕的左下角，這個角落是“無限可選中”的，因為不管用戶朝左下角方向做多大幅度的擺動，光標(biāo)總是會停在開始菜單按鈕的上方。
Mac OS X系統(tǒng)和Windows系統(tǒng)的一個最大不同之處便是程序菜單的位置。Mac OS X將菜單置于屏幕的頂端而Windows將它們放置在單獨(dú)的應(yīng)用程序窗口上。菲茨定律顯示在許多情況下Mac的做法是更好的：在Mac OS X中用戶不論如何將光標(biāo)拋向屏幕頂端其總是會停在菜單上。 而在Windows中的窗口模式下應(yīng)用程序菜單則沒有像Mac中的“無限可選中”的屬性。
但是，Mac的做法也開始凸顯出其局域性。雖然Mac OS X下的程序菜單是“無限可選中”的，不要忘了菲茨定律也考慮到了用戶當(dāng)前定位點(diǎn)與目標(biāo)的相對距離。隨著顯示器尺寸越來越大，雙/多屏顯示器的配置越來越常見。Mac的用戶不得不在這些情況下穿過很長的距離來讓光標(biāo)到達(dá)主屏幕的頂端菜單。這樣的話長距離拖動光標(biāo)所耗費(fèi)的時間可能會超出不用做細(xì)微調(diào)整來矯正光標(biāo)位置而省下的時間。
菲茨定律的應(yīng)用
網(wǎng)頁設(shè)計師最大的遺憾之一就是不能利用瀏覽器的邊角和邊緣作為可“無限可選中”的區(qū)域。不過設(shè)計師仍然可以按照菲茨定律在設(shè)計上做一些優(yōu)化。
?放大鏈接點(diǎn)擊區(qū)域。在鏈接文字周圍放置可點(diǎn)擊的填充區(qū)域，這樣用戶想要點(diǎn)擊的鏈接文本會有更大的容錯性。
?當(dāng)您有幾個放置在一起的可點(diǎn)擊目標(biāo)或鏈接時，把它們的體積增大或增加他們之間空白區(qū)域的大小。搜索結(jié)果中的網(wǎng)頁導(dǎo)航鏈接通常都有很差的可用性。例如，下圖中的搜索結(jié)果頁面就顯示了太多的結(jié)果，并且這些結(jié)果互相之間也離得太近：
亞馬遜（Amazon)在處理搜索結(jié)果的方法上則要高明許多
?將用戶最有可能點(diǎn)擊（或最想要）的按鈕放大。例如，將”O(jiān)K”按鈕設(shè)計的更大：
?將動作分類–如果相關(guān)的操作按鈕靠近彼此的話，則不僅可以在視覺上增強(qiáng)用戶對它們相關(guān)性的認(rèn)知，還可以減少光標(biāo)在它們之間移動所需的距離和時間。
最后請記住，一定要敢于嘗試！37 Signal在它們的產(chǎn)品Sortfolio主頁的“Signup”按鈕上就有一個靈活運(yùn)用菲茨定律的有趣實驗–當(dāng)用戶的光標(biāo)劃過時按鈕會自動變大并顯示更多信息–這樣的話當(dāng)用戶即將開始做細(xì)微調(diào)整以精確定位光標(biāo)至按鈕時，微調(diào)的必要性因為按鈕的自動增大而大大減少了！多么絕妙的創(chuàng)意和應(yīng)用??！
本文轉(zhuǎn)自網(wǎng)絡(luò)，如有侵權(quán)，立即刪除。
原文鏈接? http://blog.sina.com.cn/s/blog_5f63e3d80102vd0l.html
