歡迎關注團隊號：
當進入新頁面時，回到上一級頁面的操作會使用「返回」、「關閉」或者是「取消」。他們看起來相似，但實際使用上有明顯的區別。
今天來聊一聊「返回」、「關閉」和「取消」在實際設計中的用法。
本文大綱如下：
1、返回
2、關閉
3、取消
4、總結
1、返回
如下圖在微信App-我tab頁，點擊列表（卡包）進入下一頁，新頁面（卡包）從右往左出現，這時候導航欄左側是返回圖標。
上述案例，幾乎所有的頁面返回都符合這個規律，可以簡單總結下：如果下一級頁面從右往左移動，這時候使用「返回」。
從右往左移動，然後通過「返回」，原路回去，符合交互行為邏輯。
2、關閉
如下圖，發朋友圈，點擊「從手機相冊選擇」，這時候新頁面從屏幕底部出現，導航欄左側為「關閉」。
之前版本微信從相冊中選取照片，使用的是「取消」，後面版本改為了關閉，如下圖所示：facebook發布動態，頁面從底部出現，使用的也是「關閉」。對於頁面臨時從底部覆蓋上一級頁面，且是完全覆蓋，這種情況不應該使用返回，可使用「關閉」。用戶點擊鏈接，通過微信內置的瀏覽器打開，頁面從右邊往左移動打開，這時候導航欄為「關閉」操作。這似乎不符合上述結論。出現這種情況的原因是：關閉操作承接的任務是關閉整個網站（程序），而不是回到該網站（程序）的上一級頁面。如果出現的新頁面是一個系統，這時候需要使用關閉（即使新頁面從右往左移動出現）。對於底部浮層面板，符合上述規則，基本都是使用「關閉」，如下圖所示：支付寶充值提現，選擇銀行卡時，浮層面板從底部出現，使用返回，不符合交互動效，這種做法不對，如下圖所示：「關閉」和「取消」區別不大，都是結束當前頁。很多情況下可混用。當含有「取消」按鈕，通常頁面有需要一些填寫的表單，如下圖iOS郵箱所示：目前我理解比較大的區別是：「取消」多適用於填寫較多的表單的臨時覆蓋頁面。如下圖發布朋友圈所示：上圖中，涉及到取消的位置，幾乎所有的取消都在左側。取消等同於關閉、回到上一級頁面的動作，位置上布局邏輯統一。幾乎主流的產品和iOS系統搜索，都將「取消」放在右邊。可能是為了布局的合理性，如果從邏輯上很難解釋這個現象。2、新頁面從底部出現覆蓋當前界面，可使用「取消」或者「關閉」，這部分沒有明確的對與錯；3、當新頁面從底部出現覆蓋當前界面，需要填寫較多表單內容時，使用「取消」居多。4、進入一個全新的系統，即使新頁面從右往左出現，也應該使用去「關閉」，而不應該使用「返回」。公眾號資源庫迎來大更新，資源鏈接均為阿里雲盤，不用擔心下載被限速。
留言列表