Michiel是Yoast和我們的首席運營官的合伙人。互聯網資深人士。他大部分文章的主要目標是啟動網站優化。需要做的事情還很多！
網頁上用作主要號召性用語的按鈕中有一半不邀請我點擊。您可以並且應該測試按鈕設計，但有時，它只是從常識開始的。在過去十年中，按鈕UX設計發生了很大變化。一個長期的趨勢似乎是在設計中融合一個按鈕。也許從美學上講是令人愉悅的，但是您實際上希望它脫穎而出，並讓您的訪客單擊它，對嗎？
請注意，並非每個按鈕都是指定的號召性用語。有時您只需要一個按鈕，例如在評論表單中。但是，該按鈕應該看起來像一個按鈕！在本文中，我將討論五種類型的按鈕，並作為全職網路衝浪者向您提供我的意見。
默認按鈕
我找到了一篇非常不錯的文章，內容涉及如何為2004年網站設置按鈕樣式。這些按鈕看起來和感覺就像按鈕一樣，甚至可能帶您回到更懷舊的時代，讓我們將它們放在那裡。它們古老，古老，屬於博物館。不在您的網站上。當我必須填寫具有舊樣式的表格時，我總是會猶豫。它使您想知道該表格是否安全以及您不想讓他們動手的人不會收集您的數據。它是默認設置，絕對是一個按鈕，但是，來吧，您可以做得更好。
平面按鈕
平面按鈕就像彩色正方形或帶有文字的矩形。它可能是橫幅，也可能只是強調的文字。我知道平面設計已經流行了一段時間了。而且，您中的許多設計師都喜歡按鈕，因為更容易使其適合您的設計。但是我認為我們將從現在開始回顧這十年，想知道為什麼我們曾經使用過這些。並不是說平面按鈕本身是錯誤的，但是我喜歡按鈕看起來像按鈕。讓它們模仿現實生活中的物體：
第一個（左上方）是看起來像橫幅的扁平按鈕。右上方是一個輕微的改進。圓角使其看起來有點像按鈕。左下角甚至更好：一個凸起的按鈕。陰影傳達了深度，表明可以單擊它。出於轉換原因，我在最後一個添加了一些額外的信任。當它是 您網站上的主要號召性用語時，此方法可能會起作用 ，但對於表單按鈕則不是必需的。我寧願在這些表單按鈕下方添加一個不錯的推薦，以增強信任。
幽靈按鈕
儘管虛幻按鈕（或輪廓按鈕）在UX設計中似乎更常使用，但我不鼓勵使用它們。出於相同的原因，我不會使用平面按鈕。UXMag有一些很棒的鬼按鈕示例。我特別喜歡村上春樹（Haruki Murakami）的示例，因為該網站實際上看起來令人印象深刻。仍然是：
正在使用重影按鈕。
但是，就像在許多列出的網站中一樣，您很快就會發現問題出在哪裡。「現在可用」按鈕看上去並不像按鈕。如果有的話，它看起來像是標籤或橫幅。就像傳達信息的元素一樣，而不是號召性用語。儘管它看起來很棒，但它僅與頁面的其餘部分融合在一起，幾乎使它變得毫無用處……
這是否意味著您永遠不應該使用幻像按鈕？我認為這很大程度上取決於您要使用它們的上下文。當與第二個按鈕並排使用時，它們可能會非常有效，並且重點更加突出。因為重影按鈕在視覺上很輕，所以將其與包含的按鈕配對可以自動傳達層次結構。這會自動將訪問者指向您的主要操作。對於您認為更重要的按鈕。
一狀態按鈕
這裡有第二個要素（或維度）很重要。與其說初始按鈕對訪問者是什麼樣，不如說它是如何交互的。這是關於懸停按鈕並發現沒有任何變化。是按鈕，還是沒有？我必須實際單擊它才能找出看起來像按鈕的東西是否實際上是按鈕。嗯 人們傾向於在單擊之前猶豫，並且使用沒有設計的懸停狀態的單狀態按鈕只會使他們變得更加猶豫。
添加懸停狀態可以很簡單，只需在按鈕上加下劃線或更改背景顏色即可。或兩者。
最好的按鈕UX
我認為，好的按鈕背後的原理實際上是永恆的，絕不隨潮流而變化。在Blogs.adobe.com上 ，我對這些按鈕的最佳實踐進行了很好的簡單總結，我想將其與DesignExcellent上的結合起來：
- 使它看起來像一個按鈕（大小，形狀，顏色，深度）。
- 單擊後添加明確的消息。
- 注意按鈕的順序和位置（放置）。
獎勵鏈接：按鈕顏色對比如何引導用戶採取行動。
上面列表中的第一項總結了我的觀點：一個按鈕就是一個按鈕。與其說是設計元素，不如說是設計元素。按鈕UX設計是關於識別和清晰度的。
思考的食物
在撰寫本文時，令我驚訝的是，我們也沒有遵循本網站上的信函中的一些最佳實踐。總有改進的餘地。當您查看自己的按鈕時，請從最重要的按鈕開始。例如產品頁面上的購買按鈕或新聞稿的訂閱按鈕。請記住，並非所有內容都是按鈕，也不應該看起來像按鈕。
隨時分享您對按鈕UX的意見。我很好奇您的想法！
閱讀更多：主要的輔助功能檢查»