UI小按鈕基礎技巧原則

　　按鈕是UI設計中最常用的控件之一，但我們真的了解這種最常用的控件嗎？本文AAA教育的武老師對按鍵的12個知識點進行了詳細的分解。雖然這篇文章很基礎，但肯定會對你有所幫助。
 

　　一、每個按鈕只能有一種樣式
 

　　很多時候，網(wǎng)站和應用程序對同一操作類型使用多個按鈕樣式。計算您使用的按鈕樣式的數(shù)量，并將它們與每個類型的一個樣式相匹配。標準按鈕類型包括：呼叫操作(CTA)、主要按鈕、次要按鈕、第三按鈕、成功按鈕、危險按鈕、鏈接按鈕等。
 

　　二、包含視覺反饋和狀態(tài)
 

　　按鈕狀態(tài)，如懸停、按下和進行中，為用戶提供所需的視覺反饋。如果沒有事件狀態(tài)，用戶可能會對提交操作時發(fā)生的情況感到困惑。
 

　　三、區(qū)分按鈕類型
 

　　按鈕類型應該在風格上加以區(qū)分，以便為其層次結構提供視覺提示。一級動作按鈕應比二級動作按鈕或三級動作按鈕更突出，并應設計一個具有不可逆結果的附加動作。
 

　　四、保持按鈕樣式一致
 

　　任何設計風格都可以使用，只要你保持整體風格一致。如果您使用4PX的邊框半徑、細微的漸變和陰影，請確保您所有的按鈕類型都是這種樣式。
 

　　五、非按鈕不應看起來像按鈕
 

　　按鈕，尤其是圓形的矩形按鈕，其樣式通常類似于標簽。如果在設計中使用這兩個組件，請確保添加足夠的視覺差異以避免混淆。你最不想看到的是，用戶憤怒地點擊一個元素，錯誤地認為它是一個可操作的按鈕。
 

　　六、保持尺寸一致
 

　　無論您使用大寫、標題大小寫、句子大小寫還是小寫，請確保您的不同按鈕類型是一致的。
 

　　七、知道何時使用圖標
 

　　扣子堆在一起看起來很糟糕，就像長桌上的每一排一樣?？紤]在具有重復內容的上下文中使用更微妙的視覺樣式(如圖標)。
 

　　八、避免長標簽
 

　　長按鈕或鏈接標記會混淆用戶界面并迫使用戶思考。除非操作是唯一的、復雜的或可能導致不可逆的損害(例如刪除數(shù)據(jù))，否則操作標記的內容僅限于反映所需的操作。
 

　　九、標簽應該清楚地傳達它所代表的行為
 

　　不要讓用戶猜測按鈕的作用，尤其是如果它是不可逆的。清楚簡潔地解釋行動的后果。“是”、“否”和“取消”等標簽可能會被誤解。在上面的例子中，用戶可以將“取消”解釋為確認位置已被取消，而不是取消刪除。
 

　　十、在鏈接之間添加空間
 

　　不要忽略鏈接類型的操作按鈕。當它們出現(xiàn)在一起時，請確保為它們添加足夠的空間。
 

　　十一、不換行標簽文本
 

　　按鈕標簽的換行符降低了可讀性，看起來很糟糕。確保文本顯示在一行之內。
 

　　十二、標簽的長度不應超過按鈕的寬度
 

　　顯然，我見過很多設計中按鈕文本的長度超過按鈕的寬度。使用間距控件，而不是硬編碼按鈕的寬度。另外，盡量減少字數(shù)和字數(shù)，只為能傳達動作。也許最好的標簽是根本沒有標簽-也許是一個圖標。

        UI設計的小按鈕能帶來那么多思考，這篇文章的內容你學到了嗎，更多資訊請持續(xù)關注AAA教育~