費(fèi)茨定律是指用戶使用指點(diǎn)設(shè)備到達(dá)一個(gè)目標(biāo)的時(shí)間同以下兩個(gè)因素有關(guān)，距離和目標(biāo)大小。

　　( 1.設(shè)備當(dāng)前位置和目標(biāo)位置的距離(D)。距離越長(zhǎng)，所用時(shí)間越長(zhǎng);2.目標(biāo)的大小(S)。目標(biāo)越大，所用時(shí)間越短。該定律可用以下公式表示：t = a + b log2 (D / S + 1)

　　距離越近，目標(biāo)越大，點(diǎn)擊所需時(shí)間越短。這看起來很好理解，也很容易運(yùn)用在設(shè)計(jì)中。但當(dāng)使用費(fèi)茨定律去衡量所有設(shè)計(jì)時(shí)，就會(huì)發(fā)現(xiàn)一些交互體驗(yàn)上的問題。

　　費(fèi)茨定律之一：更大的可點(diǎn)擊區(qū)域

　　費(fèi)茨定律最主要的理論是：點(diǎn)擊區(qū)域越大，點(diǎn)擊目標(biāo)所需的時(shí)間越短。

　　優(yōu)點(diǎn)：可點(diǎn)擊區(qū)域越大越容易操作，因?yàn)橛脩舻氖髽?biāo)能輕松觸達(dá)。

　　例如：一些網(wǎng)站按鈕的可點(diǎn)擊區(qū)域小得離譜。結(jié)果導(dǎo)致用戶需要將光標(biāo)準(zhǔn)確的移到鏈接上，才會(huì)產(chǎn)生響應(yīng)。費(fèi)茨定律建議設(shè)計(jì)師盡可能的去增大按鈕的可點(diǎn)擊區(qū)域，讓用戶有更好的體驗(yàn)。

　　左邊可點(diǎn)擊區(qū)域小， 右邊可點(diǎn)擊區(qū)域大，右邊光標(biāo)可以更快速的點(diǎn)擊到按鈕。(左邊案例是 Firefox ，右邊案例是 Apple)。

　　增大按鈕的可點(diǎn)擊區(qū)域，引導(dǎo)用戶去完成某些特定的操作，這確實(shí)是一個(gè)不錯(cuò)的主意，也是設(shè)計(jì)師常用到的方法之一。

　　比方說，設(shè)計(jì)界面的主要按鈕時(shí)，往往把按鈕做得很大，費(fèi)茨定律為此提供了強(qiáng)大的理論基礎(chǔ)。

　　缺點(diǎn)：點(diǎn)擊區(qū)域難道是越大越好嗎?點(diǎn)擊區(qū)域越大，占用屏幕空間就越多，會(huì)打亂界面的平衡。當(dāng)界面空間不是很擁擠時(shí)，增大可點(diǎn)擊區(qū)域是可行的。可是，點(diǎn)擊區(qū)域增大到一定程度后，它和可用性之間就沒什么關(guān)系了。

　　一個(gè)小按鈕，把它放大10%，它的可用性會(huì)顯著提升，但如果你將一個(gè)本來就很大的按鈕再增加10%，它和可用性之間就不成正比了。

　　費(fèi)茨定律之二：減少光標(biāo)的移動(dòng)

　　距離越近，點(diǎn)擊目標(biāo)所需時(shí)間越短，這是費(fèi)茨定律第二大理論。

　　優(yōu)點(diǎn)：將用戶常用的功能放置在一個(gè)區(qū)域，相比那些分開放置的，用戶可以減少光標(biāo)的移動(dòng)，更快的去完成操作。

　　比如：Ubuntu Unity界面，屏幕頂端是搜索框，下端是文件類型篩選。兩個(gè)篩選區(qū)域相隔非常遠(yuǎn)，用戶在瀏覽信息時(shí)需要在兩個(gè)不同區(qū)域操作。

　　(費(fèi)茨定律不贊同這種做法，因?yàn)樗鼈儜?yīng)該彼此相鄰。)案例:Ubuntu Unity, 屏幕截圖： Webupd8.org)

　　缺點(diǎn)：如果嚴(yán)格按照費(fèi)茨定律來設(shè)計(jì)，可能會(huì)與其他設(shè)計(jì)理論相沖突，如：根據(jù)不同的內(nèi)容和功能來組織信息，讓界面信息整齊合理，用戶能輕松找到所需的內(nèi)容。

　　下面這張圖片將不同類型操作安排在了一個(gè)很小的界面，左邊是桌面工具，右邊是文件插入工具。

　　這種左右分類方式讓界面很整潔，很有組織性。(例如： Numbers)

　　用戶會(huì)對(duì)有組織的分類方式產(chǎn)生熟悉的心理模型。在使用過一次之后，可以清晰的記住左右兩邊功能區(qū)的作用。相反，如果界面設(shè)計(jì)只用按鈕使用率去安排界面布局，那么布局方式就會(huì)完全不同了。

　　與費(fèi)茨定律沖突的另一個(gè)原則是，讓界面看起來不凌亂。下拉菜單是有效的整合網(wǎng)站內(nèi)容的形式。雖然會(huì)有一些設(shè)計(jì)師提出異議，但下拉菜單的好處是不可否認(rèn)的。

　　下拉菜單使你的界面看起來干凈，不凌亂。

　　費(fèi)茨定律不推薦使用下拉菜單，原因是光標(biāo)需要移動(dòng)很長(zhǎng)的距離才能到達(dá)用戶所選項(xiàng)。首先，用戶需要點(diǎn)擊或者懸停在下拉菜單上，然后移動(dòng)光標(biāo)，最后才到他所需要的選項(xiàng)，雖然不是太快捷，但是和下拉菜單的多個(gè)優(yōu)勢(shì)比起來，這點(diǎn)瑕疵不足為道。

　　與費(fèi)茨定律沖突的第三個(gè)重要的原則是設(shè)計(jì)允許用戶出錯(cuò)的界面，幫助用戶減小出錯(cuò)的代價(jià)。費(fèi)茨定律建議設(shè)計(jì)師將一些常用的功能放在一起，以減少光標(biāo)的移動(dòng)，同時(shí)也能節(jié)省一些界面空間。但節(jié)省界面空間的代價(jià)是用戶的誤操作。當(dāng)按鈕邊緣不易識(shí)別時(shí)，用戶容易發(fā)生誤操作。

　　界面元素放置方式直接決定錯(cuò)誤是否會(huì)發(fā)生。(比如：Blurb.com)

　　注意，如果是分享或編輯這一類功能時(shí)，誤操作的代價(jià)會(huì)很高，用戶會(huì)恨死你的。

　　當(dāng)用戶不小心打開錯(cuò)誤鏈接，他可以點(diǎn)擊返回按鈕恢復(fù)他此前的操作，不會(huì)給用戶造成任何嚴(yán)重后果。所以，此時(shí)鏈接可以放在相對(duì)隨意的位置。

　　而有些情況，問題就煩人了。當(dāng)用戶在播放一段視屏或音頻文件時(shí)，不慎點(diǎn)到停止，退出，下一個(gè)或清楚播放列表，他就不可能再輕易的恢復(fù)此前的操作了。

　　涉及到編輯或是分享功能時(shí)，問題就更具有殺傷力了。誤點(diǎn)擊到發(fā)送 打印 刪除 下載 上傳 刻錄 關(guān)閉 關(guān)機(jī) 鏈接 斷開 接收或拒絕，用戶的行為可能造成一些無法挽回的后果。

　　因此，設(shè)計(jì)如編輯，分享等特殊功能的按鈕時(shí)，設(shè)計(jì)師必須盡可能地想辦法，避免用戶誤操作。

　　1 給用戶提供一個(gè)撤銷執(zhí)行的操作。(如臨時(shí)取消按鈕)

　　2在兩個(gè)界面元素間留一點(diǎn)空間。

　　3 讓按鈕邊緣容易識(shí)別。

　　4 突出重點(diǎn)。

　　5 將按鈕按照功能分組。

　　最后來舉個(gè)例子，

　　如果想“接收郵件”，但卻不小心誤點(diǎn)成“創(chuàng)建新郵件”，這不會(huì)造成任何嚴(yán)重的后果，但不要將回復(fù)和刪除按鈕靠的太近。

　　兩步輸入法可以有效防止錯(cuò)誤的發(fā)生，它和可用性相違背的，但卻有效防止用戶的誤操作。因?yàn)椋脩魰?huì)誤操作到其中任何一個(gè)動(dòng)作，卻不可能同時(shí)誤操作它們成功。比如滑動(dòng)刪除。

　　先滑動(dòng)，再刪除。每一個(gè)非常容易發(fā)生的錯(cuò)誤，結(jié)合起來可以成為一個(gè)有效預(yù)防錯(cuò)誤的機(jī)制。

　　用戶會(huì)不小心向左右滑動(dòng)，也會(huì)不小心點(diǎn)到刪除按鈕，但他們會(huì)不小心滑動(dòng)后再不小心點(diǎn)擊到刪除按鈕嗎?這個(gè)幾率就非常小了。

　　兩步輸入法在移動(dòng)設(shè)備上使用廣泛，因?yàn)橐苿?dòng)設(shè)備使用場(chǎng)景較為復(fù)雜，常會(huì)出現(xiàn)誤操作。

　　在設(shè)計(jì)時(shí)，可以先將用戶操作的第二部隱藏起來，當(dāng)用戶操作完第一步后，再出現(xiàn)第二步。

　　所以，當(dāng)滑動(dòng)與滑動(dòng)，滑動(dòng)與點(diǎn)擊兩者結(jié)合時(shí)，用戶操作起來雖比直接按下一個(gè)大按鈕麻煩，可這是有必要的。

　　費(fèi)茨定律之三：避免肌肉緊張

　　費(fèi)茨定律性能指標(biāo)的目的是為了確定人類運(yùn)動(dòng)系統(tǒng)的信息容量。換句話說：它通過判斷用戶操作時(shí)需耗費(fèi)的體力，來決定操作的方式。

　　好處：我們?cè)诓僮饕粋€(gè)復(fù)雜的設(shè)備時(shí)，簡(jiǎn)單輸入的好處是顯而易見的。最突出的例子是垂直觸摸屏。

　　使用費(fèi)茨定律理論，可以使垂直觸摸屏的交互體驗(yàn)更好。 (比如：Perceptive Pixel)

　　當(dāng)操作觸摸屏?xí)r，手臂保持垂直的方向會(huì)讓三角肌迅速疲憊。從而導(dǎo)致輸入錯(cuò)誤或迫使用戶放棄操作。所以，避免復(fù)雜的輸入方式可以延長(zhǎng)用戶的操作時(shí)間。

　　缺點(diǎn)：復(fù)雜的輸入方式可以預(yù)防錯(cuò)誤。比如：移動(dòng)設(shè)備經(jīng)常放在口袋里，常引發(fā)意外操作。這種情況下，高精度的輸入法是很有用的。同時(shí)，這些高精度的輸入法也提醒用戶這些命令的嚴(yán)重性。舉個(gè)例子，iphone的關(guān)閉。

　　如果這個(gè)操作會(huì)帶來嚴(yán)重后果，選擇滑動(dòng)操作，相反，選擇按鈕。

　　關(guān)機(jī)或重啟設(shè)備后果相對(duì)比較嚴(yán)重，一旦觸發(fā)，就不可以撤銷。因此，它使用了需要高精度操作的滑動(dòng)。相反取消則相對(duì)沒什么嚴(yán)重后果，因此設(shè)計(jì)成按鈕。

　　滑動(dòng)控件和其他需要高精度的手勢(shì)是非常安全也非常繁瑣的輸入方式。因此，為了平衡安全和可用性之間的關(guān)系，他們常被執(zhí)行一些后果嚴(yán)重但不經(jīng)常操作的命令。如：屏幕解鎖，關(guān)機(jī)，設(shè)置系統(tǒng)，執(zhí)行管理任務(wù)或喚醒報(bào)警設(shè)備。當(dāng)有些命令后果嚴(yán)重也會(huì)被用戶頻繁操作時(shí)，如編輯刪除或轉(zhuǎn)移文件，有間隔的圖標(biāo)和兩步輸入法是很有效的。

　　第二個(gè)原因是手勢(shì)可以節(jié)省一些界面的空間。然而，根據(jù)費(fèi)茨定律，涉及到一定程度上的拖拽會(huì)讓肌肉處于一個(gè)緊張的狀態(tài)，這就是為什么費(fèi)茨定律推薦使用點(diǎn)擊和指向。可拖拽等不利于費(fèi)茨定律的手勢(shì)也是有好處的，它不需要界面控件。

　　舉個(gè)例子，你管理 deviantART藝術(shù)收藏品的方法。將項(xiàng)目添加到收藏夾，你不需要按鈕，相反，你只需要拖動(dòng)圖片，方框就會(huì)顯示告訴你如何去拖拽。

　　拖拽等操作形式不需要占用界面的空間，因?yàn)樗恍枰粹o或者是其他的UI元素。但是這種操作方式也有弊端，它不會(huì)給用戶提供明顯的視覺線索。用戶有可能會(huì)忽略或不知道它們的存在。

　　費(fèi)茨定律之四：利用主要的像素

　　利用主要像素的概念是屏幕中有些特定位置的像素，用戶可以更容易的點(diǎn)擊到它們，如屏幕的邊緣位置。不過最快的方式還是直接點(diǎn)擊鼠標(biāo)右鍵，只要在特定元素周邊點(diǎn)擊右鍵就可以獲取相應(yīng)的選項(xiàng)，不需要將光標(biāo)移動(dòng)很長(zhǎng)的距離。

　　優(yōu)點(diǎn)：你只要在文本特定的像素周邊點(diǎn)擊右鍵就可以獲取上下文的選項(xiàng)，因此，你不必長(zhǎng)距離的去移動(dòng)光標(biāo)。有兩種文本菜單的形式：線性菜單和餅狀菜單。

　　費(fèi)茨定律是更傾向于餅狀菜單的。原因：餅狀菜單提供了很大的可點(diǎn)擊區(qū)域。第二，因?yàn)椴藛问且粋€(gè)圓形，光標(biāo)到達(dá)菜單的任何位置距離都是相同的。這樣的一致性可以讓用戶對(duì)到選項(xiàng)時(shí)肌肉產(chǎn)生力道產(chǎn)生記憶。相反，線性菜單只有前幾個(gè)選項(xiàng)光標(biāo)是非常容易到達(dá)的，這就是為什么我們要把常用選項(xiàng)放在光標(biāo)最接近的地方。

　　(費(fèi)茨定律更傾向于餅狀菜單)

　　當(dāng)選項(xiàng)在屏幕邊緣時(shí)，用戶可以將光標(biāo)直接移到邊緣位置，相比將選項(xiàng)放在屏幕中間位置的做法，可以更簡(jiǎn)單快捷的點(diǎn)擊到目標(biāo)區(qū)域。

　　壞處：餅狀菜單在時(shí)間和錯(cuò)誤概率上相比線性菜單有微弱的優(yōu)勢(shì)。但在實(shí)際設(shè)計(jì)中，餅狀菜單就不被看好了。

　　盡管費(fèi)茨定律更偏向餅狀菜單，它的缺點(diǎn)卻足以將優(yōu)點(diǎn)抹殺。

　　餅狀菜單會(huì)導(dǎo)致選項(xiàng)很多時(shí)，區(qū)域變得很小。解決這個(gè)問題的方法是刪除多余的選項(xiàng)，這符合席克定律。

　　第二當(dāng)有大量選項(xiàng)時(shí)，子菜單是一個(gè)不錯(cuò)的方式。餅狀菜單雖然也可以添加子菜單，但這種做法會(huì)打亂屏幕結(jié)構(gòu)，讓它看起來凌亂沒有組織性。這是線性菜單比餅狀菜單有的明顯優(yōu)勢(shì)，線性菜單更容易利用子菜單方式組織層級(jí)結(jié)構(gòu)。

　　最后，餅狀菜單占用更多的空間。會(huì)導(dǎo)致兩個(gè)問題：第一，掩蓋選項(xiàng)，第二，當(dāng)光標(biāo)觸發(fā)屏幕四個(gè)邊緣時(shí)，他們更可能在彈出的地方而不是當(dāng)前光標(biāo)的位置。

　　總而言之，做為設(shè)計(jì)師應(yīng)更偏向使用線性菜單，而不是餅狀菜單。

　　1 必須整個(gè)很多選項(xiàng)

　　2 必須使用子菜單

　　3 組合排列菜單項(xiàng)

　　4 屏幕是最重要的

　　最后，當(dāng)使用鼠標(biāo)操作設(shè)備時(shí)，有兩個(gè)潛在的問題不得不被提到。在大屏幕上，光標(biāo)需要移動(dòng)很長(zhǎng)的距離，這幾乎可以抵消屏幕邊緣的優(yōu)點(diǎn)。網(wǎng)頁(yè)設(shè)計(jì)師也無法從這個(gè)規(guī)則中得到好處，因?yàn)樗麄兊膬?nèi)容往往會(huì)超出這個(gè)屏幕，他們必須選擇一些更加緊湊的中心布局。

　　當(dāng)使用觸屏設(shè)備時(shí)，將界面元素放置在屏幕四角不僅不會(huì)加快交互的速度，相反，它甚至?xí)蟹疵嫘Ч｜c(diǎn)擊四個(gè)角的區(qū)域需要用戶頻繁的使用手臂，讓手臂迅速感到疲勞。因此，將元素放置在用戶手最容易到達(dá)的地方，會(huì)讓他們使用起來更加舒適，這是符合費(fèi)茨定律的。