按鈕的定義
就是網(wǎng)頁(yè)或應(yīng)用中用來(lái)承載用戶(hù)操作的元件坪它。用來(lái)承載用戶(hù)某一個(gè)具體的命令（操作）手报，用戶(hù)在按下Button后程序系統(tǒng)執(zhí)行一系列的行為。
通常在視覺(jué)上會(huì)著重表現(xiàn)搪缨。
按鈕是一個(gè)普通的必不可少的碉哑，幾乎我們每天都要接觸無(wú)數(shù)次的設(shè)計(jì)元件挚币，同時(shí)在Web或者App上創(chuàng)造流暢的用戶(hù)體驗(yàn)必不可少亮蒋。
按鈕的尺寸
點(diǎn)擊Button的是鼠標(biāo)或手指。
MIT Touch Lab的研究結(jié)果表明手指接觸面積平均為10-14mm之間妆毕，指尖平均為8-10mm慎玖，所以最佳的熱區(qū)尺寸應(yīng)設(shè)定為10mmX10mm。
按鈕的形狀
通常是直角矩形或者圓角矩形笛粘。直角形的按鈕向我們傳遞一種正式嚴(yán)肅的感覺(jué)凄吏。圓角能夠加強(qiáng)信息的傳遞，并且能夠?qū)⑷说囊暰€集中在元素的中心位置闰蛔。其他形狀，如圓形图柏，三角形等序六。
按鈕的顏色
按鈕的顏色有千萬(wàn)種，可能考慮到界面的設(shè)計(jì)風(fēng)格蚤吹；考慮到對(duì)用戶(hù)的心理暗示例诀；考慮到要傳達(dá)給用戶(hù)的理念會(huì)選擇合適的顏色。比如大眾默認(rèn)的紅色按鈕傳達(dá)有警告裁着、不可以的意思繁涂，同時(shí)也最能引起注意的顏色；藍(lán)色則傳達(dá)著可行二驰，暢通之意扔罪；灰色則傳達(dá)著不可用，不可點(diǎn)擊之意桶雀，如灰置按鈕就是這樣應(yīng)用的矿酵。
按鈕的樣式
1.立體按鈕
立體按鈕樣式相較于扁平按鈕設(shè)計(jì)增加了一維空間，在復(fù)雜或?qū)捲５目臻g中強(qiáng)調(diào)功能矗积，立體按鈕比扁平按鈕更加顯眼全肮。
2.扁平按鈕
扁平的按鈕不突出，在點(diǎn)擊時(shí)會(huì)有背景顏色棘捣，不打擾內(nèi)容辜腺。
3.開(kāi)關(guān)按鈕
用同一個(gè)Button表示開(kāi)啟和關(guān)閉，節(jié)省空間乍恐。
4.幽靈按鈕
透明背景评疗，與頁(yè)面文字一樣顏色，只加上邊框禁熏，通橙老铮基于品牌或設(shè)計(jì)的考慮。
5.懸浮按鈕
懸浮按鈕用于驅(qū)動(dòng)動(dòng)作時(shí)使用瞧毙。當(dāng)然在其它場(chǎng)景使用并不局限于單一形狀胧华，可以是圖片文字結(jié)合寄症，也可以是icon單獨(dú)構(gòu)成，懸浮于頁(yè)面中矩动。
懸浮按鈕也是谷歌設(shè)計(jì)的重要部分有巧，它是一個(gè)圓形的材質(zhì)按鈕，點(diǎn)按之后按鈕浮起并表現(xiàn)墨水暈開(kāi)的效果悲没，利用本身的圓形形狀懸浮于界面之上與其他元素進(jìn)行區(qū)分篮迎，加上運(yùn)動(dòng)動(dòng)作，包括漸變示姿，展開(kāi)和轉(zhuǎn)化為單一定點(diǎn)甜橱。
按鈕的狀態(tài)
按鈕有可用不可用兩種狀態(tài)，以及在交互上默認(rèn)狀態(tài)栈戳、鼠標(biāo)或懸浮時(shí)的狀態(tài)和按下時(shí)的狀態(tài)岂傲。
之前有提到灰置按鈕，就是不可用的子檀。如下圖的應(yīng)用按鈕镊掖，現(xiàn)在這種情況是不可用，不能點(diǎn)擊的褂痰。
只有在你做出相應(yīng)的改動(dòng)時(shí)亩进，這個(gè)按鈕才會(huì)被喚醒，變成可用可點(diǎn)擊的狀態(tài)缩歪。
在Web中按鈕的默認(rèn)狀態(tài)下归薛；
鼠標(biāo)懸停時(shí)是這樣；
按下時(shí)是這樣的匪蝙。
在界面設(shè)計(jì)按鈕時(shí)都要考慮到這個(gè)交互問(wèn)題苟翻，承現(xiàn)三種不同狀態(tài)。
按鈕的構(gòu)成形式
按鈕可以分為純文字的骗污、純icon的崇猫，純圖片的以及這三種元素各自相結(jié)合的，最常見(jiàn)的就是純文字形需忿、純icon形和文字icon結(jié)合形诅炉，純文字的太常見(jiàn)，就不用再例圖說(shuō)明了屋厘。
按鈕的使用形式
單個(gè)按鈕，最常見(jiàn)的汗洒。
按鈕組议纯，一般成組出現(xiàn)，共用邊框溢谤，在視覺(jué)上成一個(gè)整體長(zhǎng)條形狀瞻凤。末尾可能有更多的按鈕隱藏憨攒，通過(guò)下拉箭頭表示。
列表型按鈕阀参，類(lèi)似Select肝集，從可選的列表中選擇一項(xiàng)或者多項(xiàng)的菜單。
按鈕的擺放位置
按鈕應(yīng)放置在用戶(hù)能夠直接找到或者他有預(yù)期能看到的地方蛛壳。例如,iOS UI 設(shè)計(jì)規(guī)范給明了按鈕的合理位置杏瞻。
按鈕要執(zhí)行的命令和位置的關(guān)系非常重要，,特別是在出現(xiàn)成對(duì)的選項(xiàng)時(shí)(就像”上一個(gè)”和”下一個(gè)”)衙荐，確保設(shè)計(jì)強(qiáng)調(diào)了最主要或者最重要的動(dòng)作捞挥。
在下面的例子中我們使用了紅色的按鈕顏色表現(xiàn)一個(gè)潛在的具有破壞性的動(dòng)作，并且忧吟，主要?jiǎng)幼鞑坏梢酝ㄟ^(guò)顏色和對(duì)比度去引起注意树肃，還可以看它是否置于對(duì)話段落的右邊。
