客製化網站按鈕設計理念和靈感

設計師有句俗話說：越不起眼的東西，越能夠影響網站的表現，其中一個就是介面設計了。對於使用者來說，也許只有「好用的介面」與「不好用的介面」兩種差異，但對設計師來說可就不同了。

以我們今天要分享的UI介面設計的元素之一：按鈕來說，他是用戶與系統互動的觸發橋梁，並透過按鈕，用戶可以做出他們的選擇，系統則根據這個選擇來採取行動。從主頁選單、留言表單、線上客戶服務、會員工具欄...每個頁面都可以看到按鈕的存在。

按鈕和連結常常被混為一談，因為文章的文字超連結提供與按鈕一樣的功能，但定位卻完完全全的不同。網站按鈕設計用於執行一些重要的事件，例如：運行一個重要的功能，做出一個重大的決定...而文章內的連結用於頁面之間的移動，是提供用戶參考資訊的正確做法。
 
也因為按鈕的意義重大，所以設計介面的工作中，按鈕總是會下更多的功夫，一個好的按鈕，可以提醒用戶做出重要的決定，而不會忽略重要的事情。然而不好的按鈕，可能會引起用戶的猜忌，或是否定網站所提供的重要訊息，重要性不言而喻。

網站按鈕設計原則

我們在下面詳細介紹了一些優秀的按鈕設計，以及過往常見的不良網頁按鈕設計以供參考：

1. 良好的網站按鈕設計

清晰：按鈕的文字和顏色必須清晰、清晰且易於閱讀。近年來，扁平化按鈕設計一直是流行的網頁設計趨勢，所以這是一種安全的嘗試風格。

簡潔：近年「簡易設計」與「扁平設計」風氣影響，在按鈕上，使用最少的文字是理想的。這個想法是只使用一兩個字。再多就會變得不方便和令人困惑。

關聯：按鈕的功能是什麼？它究竟有什麼作用？難以理解的按鈕不會被點擊。如果您有一個「立即購買」按鈕，它應該會將訪問者帶到他們可以輸入信用卡訊息的頁面，而不是討論他們想要購買的商品的頁面。

互動：過去的按鈕是靜態的，無法與用戶的行為作出互動，如今透過新的技術，設計師可以做出許多如同實體按鈕的視覺效果，例如：選擇時出現細微的色差、微幅移動的文字、或是圖樣的變化等等，讓用戶明白這個地方是可以點擊的。

2. 糟糕的網站按鈕設計

胡亂用色：明亮、粗體的按鈕吸引目光的效果很好，有些人尤其是沒有設計基礎的人，會迷上這樣的效益，使用很古怪的配色以吸引用戶點擊。或許你會因此吸引到用戶目光，但按鈕與整體網站的色調格格不入，會減低網站的整體形象價值，也可能會干擾閱讀，影響電子商務的表現。

訊息錯誤：任何網站使用是基於信任才成立，但如果訊息不實就會影響這個基礎，舉例來說，一些網頁按鈕會提示你切勿錯過本次的優惠，事實上這個優惠是一整年都在進行的，這就是一個錯誤訊息的呈現。

RWD：在網頁設計方面，行動體驗是鐵則，不過有些設計師忽略了一些小細節，例如按鈕就是一例，最好是上線前，手動仔細檢查它們是否也符合RWD響應式網頁設計標準。這個步驟不太容易透過自動檢查的方式進行，如果網頁按鈕設計對於行動裝置來說太大或太小，就會影響網頁的效益。

圖片化：過去網頁設計時，很流行將按鈕製作成一張圖片，而不是使用CSS或是程式語法製作圖片。圖片化的按鈕可以做出一些很真實的效果，例如立體感極佳的視覺感受，但以今日網頁設計的趨勢來看，這做法不太明智，主要是因為按鈕一旦過多，用戶就需要大量下載內容，造成網頁速度品質下滑，這可是會影響到網站效能表現與網站自然排名。