和移動(dòng)設(shè)備上建設(shè)網(wǎng)站的很多其他圖標(biāo)一樣，拖拽圖標(biāo)也并不能很直觀的體現(xiàn)出背后的含義。我們發(fā)現(xiàn)很多用戶其實(shí)并不明白這個(gè)圖標(biāo)代表著所在元素是可以被拖拽移動(dòng)的，而且縱向排列的三條橫線也很容易讓人誤以為是某種菜單圖標(biāo)。實(shí)際上，這種形象隱喻的是可拖拽物體上的防滑條紋，好像你把手指放在上面就可以拖動(dòng)整個(gè)對(duì)象而不至于打滑。通常，用戶需要長(zhǎng)按這個(gè)圖標(biāo)，使對(duì)象整體進(jìn)入某種激活狀態(tài)，然后拖拽到合適的位置。

      在可用性測(cè)試當(dāng)中，我們發(fā)現(xiàn)，用戶更傾向于點(diǎn)按對(duì)象本身進(jìn)行拖拽，而不是去按住一個(gè)含義模棱兩可的小圖標(biāo)。相比于列表單元這樣的對(duì)象，圖標(biāo)在尺寸上太小了，如果要求用戶必須通過(guò)按住它來(lái)拖動(dòng)整個(gè)單元，那么交互成本的增加就是必然的(相關(guān)閱讀：交互成本的定義及案例分析)。此外，用戶也會(huì)認(rèn)為一個(gè)單元整體只會(huì)觸發(fā)一種行為，也就是無(wú)論拖拽小圖標(biāo)還是單元本身，都可以使其被拖動(dòng)。

Yahoo! Finace使用了標(biāo)準(zhǔn)的iOS拖拽圖標(biāo)，用戶長(zhǎng)按該圖標(biāo)可以使單元進(jìn)入可拖動(dòng)狀態(tài)。雖然列表單元本身是目標(biāo)更大、更易操作、更符合直覺(jué)的對(duì)象，但用戶卻無(wú)法通過(guò)長(zhǎng)按單元本身來(lái)達(dá)到觸發(fā)拖拽的目標(biāo)。

此外，我們還是要強(qiáng)調(diào)一下拖拽圖標(biāo)與我們所熟悉的漢堡包菜單圖標(biāo)真的過(guò)于相似了：

外形相同或過(guò)于相似的對(duì)象，所觸發(fā)的事件是截然不同的，這種情況會(huì)使人迷惑不安。雖然行業(yè)中關(guān)于漢堡包圖標(biāo)的爭(zhēng)論愈發(fā)激烈，但越來(lái)越多的用戶已經(jīng)開始習(xí)慣了“點(diǎn)擊三根線的圖標(biāo)展開導(dǎo)航菜單”的模式。當(dāng)他們發(fā)現(xiàn)行為結(jié)果和他們所習(xí)慣的、所預(yù)期的東西不一致時(shí)，就會(huì)產(chǎn)生挫敗與迷茫。

鑒于拖拽圖標(biāo)所存在的一些可用性問(wèn)題，我們建議：

• 至少允許用戶長(zhǎng)按目標(biāo)單元整體也能實(shí)現(xiàn)拖拽的目標(biāo)，而不要只將交互區(qū)域限制在拖拽圖標(biāo)上。

• 另一方面，對(duì)于漢堡包菜單圖標(biāo)，可以嘗試更清晰明確的表達(dá)方式，例如在三根線前面增加三個(gè)點(diǎn)，或是同時(shí)放出“菜單”標(biāo)題在圖標(biāo)旁邊。

------北京網(wǎng)站建設(shè)公司  北京傳誠(chéng)信------