當前位置:
首頁 > 科技 > 為什麼純文本按鈕會損害移動應用的可用性?

為什麼純文本按鈕會損害移動應用的可用性?

移動應用按鈕的可用性標準,應比桌面應用按鈕的高。由於屏幕較小且用手指導航,移動應用上的按鈕必須易於點擊、閱讀和識別。其中,大多數實心按鈕符合這一標準,但純文本按鈕很少符合。因此在你的應用程序使用純文本按鈕之前,你應該知道以下內容。

為什麼純文本按鈕會損害移動應用的可用性?

純文本按鈕更難點擊

手指比滑鼠游標大,將手指放在較小的目標上感覺很尷尬——用戶的手指遮擋了按鈕的內容,使得他們沒有視覺上的提示來確認是否提交了該動作。如果純文本按鈕里的文本足夠長,用戶通過露出手指外的內容,會得到一個小的視覺反饋,這會好一點,但仍然不足以使他們確保已經擊中了目標。

為什麼純文本按鈕會損害移動應用的可用性?

小尺寸的純文本按鈕強迫用戶精確地移動手指以擊中目標。但越精確越需要用戶付出更多的努力。他們必須密切注意手指和目標,以確保他們點中了按鈕所在區域。

缺少直邊使得純文本按鈕邊界難以區分,更難以瞄準。實心按鈕不會出現這樣的問題,因為它們具有更大的目標區域和筆直的邊緣。

所有大寫的純文本按鈕都難以閱讀

為了解決純文本按鈕的點擊問題,一些設計師將它們的文本按鈕全部大寫。Google的Material Design系統推廣了這種按鈕風格,但也有其缺陷。

全部大寫確實為純文本按鈕提供了更直的邊緣和更大的目標區域。但這並沒有好很多,因為目標區域只是略大,但是大寫樣式卻降低了可讀性。

為什麼純文本按鈕會損害移動應用的可用性?

所有大寫的純文本按鈕都難以閱讀,尤其是對於有閱讀障礙的用戶。用戶依靠字母的形狀來識別單詞。大寫字母外形上沒有對比鮮明的上升和下降,這使單詞更難以閱讀。

為什麼純文本按鈕會損害移動應用的可用性?

純文本按鈕難以感知

純文本按鈕和文本之間唯一的區別是顏色。這種相似性使得純文本按鈕難以識別,尤其對於色盲用戶而言。如果沒有明顯的外圍形狀,用戶更有可能忽略純文本按鈕,並錯過點擊它。

為什麼純文本按鈕會損害移動應用的可用性?

用什麼形式替代純文本按鈕

許多人在二級操作里使用純文本按鈕的形式,來表示此按鈕優先順序較低。但有更好的方法可以做到這一點,同時不會損害移動應用的可用性。

輪廓按鈕

一種方法是在文本周圍設計輪廓以製作輪廓按鈕。這使按鈕的邊緣可見,為用戶提供更大,更清晰的目標。他們的手指可以落在輪廓上或輪廓內的任何地方,以提交操作。

缺乏背景色可以防止它與按鈕內部主要的號召性用語競爭。輕盈但可見的輪廓是理想的,因此它不會干擾按鈕中的文本。

淺色陰影按鈕

純文本按鈕的另一種替代方法是將文本內容放在淺色陰影按鈕上。淺色陰影按鈕可區分按鈕邊框和背景,不會與主要號召性用語競爭。陰影應該幾乎融入背景,但仍然保持足夠的可視對比度。

哪種帶來更好的視覺呈現

輪廓按鈕和淺色陰影按鈕都可以作為二級操作的樣式。但是淺色陰影按鈕的視覺重量略高,按壓感覺更好。背景為手指提供了一個堅實的目標,而不是一個單薄的輪廓。

什麼情況下,純文字按鈕會起作用?

以下這些案例中,純文字按鈕的出現起了作用。

如圖所示,不要將純文字按鈕用於二級操作,而是將它們用於三級操作。三級操作不會得到那麼多的點擊,也不需要多麼突出。一級和二級操作更重要,因此他們需要更多的視覺重量。

為什麼純文本按鈕會損害移動應用的可用性?

另一處純文本按鈕具有意義的地方,是在用戶想採取行動需要幫助的情況下——當您需要向用戶提供與上下文有關的信息以幫助他們選擇最佳選項時,請使用純文本按鈕。純文本按鈕可防止用戶將幫助視為號召性用語,因為純文本的形式不會與其他按鈕競爭。

為什麼純文本按鈕會損害移動應用的可用性?

不要濫用純文本按鈕

在界面上的放置純文本按鈕很容易,因為它們不需要花費太多精力去設計。但是,這樣做的結果是讓那些無法有效閱讀、識別和選中按鈕的用戶感到受挫。

不要放任懶惰,濫用純文本按鈕。您的CTA入口(按鈕)可以包含文字,但它們應看起來始終像個按鈕,而不是一段話。

原文作者:Anthony

原文地址:https://uxmovement.com/mobile/why-text-buttons-hurt-mobile-usability/

編譯作者:桃花果 | 杭州 | 設計師(微信ID:shiningineye-bq)

編輯整理:TCC實驗室 | 翻譯特工隊(微信ID:sanfen-design)

本文由 @三分設 翻譯發佈於人人都是產品經理。未經許可,禁止轉載

題圖來自Unsplash,基於CC0協議

喜歡這篇文章嗎?立刻分享出去讓更多人知道吧!

本站內容充實豐富,博大精深,小編精選每日熱門資訊,隨時更新,點擊「搶先收到最新資訊」瀏覽吧!

TAG: |