在網(wǎng)頁(yè)里，按鈕就像“引導(dǎo)員”，不管是“立即購(gòu)買(mǎi)”“提交表單”還是“查看更多”，都要靠它引導(dǎo)用戶(hù)完成成操作。但很多人在做按鈕的時(shí)候，總是讓用戶(hù)找不到重點(diǎn)，其實(shí)做好按鈕設(shè)計(jì)也沒(méi)有那么復(fù)雜，抓住以下這幾個(gè)核心要點(diǎn)，就能幫助大家設(shè)計(jì)的按鈕既顯眼又好用。一起來(lái)看看吧！

　　1、一眼能找到：顏色和對(duì)比度要到位。

　　按鈕的核心作用是引導(dǎo)操作，那你第一步就得讓用戶(hù)在頁(yè)面里快速發(fā)現(xiàn)它。

　　顏色選對(duì)很關(guān)鍵，核心按鈕（比如“立即購(gòu)買(mǎi)”“提交”）要選和頁(yè)面主色調(diào)有明顯反差的顏色，比如頁(yè)面主色是淺色系，按鈕就用深色；頁(yè)面偏深色，按鈕就用亮色，這樣對(duì)比度夠高，一眼就能鎖定。

　　同時(shí)要記得，別用太淡、且太接近背景色的顏色做核心按鈕，用戶(hù)找半天找不到，自然也就不會(huì)點(diǎn)。另外，輔助按鈕（比如“取消”“返回”）的顏色可以柔和一點(diǎn)，和核心按鈕區(qū)分開(kāi)，這樣能避免讓用戶(hù)混淆。

　　2、一看就懂：文字簡(jiǎn)潔，表意明確。

　　按鈕上的文字不用多，1-4個(gè)字最合適，而且要直白易懂，讓用戶(hù)一看就知道點(diǎn)了之后會(huì)發(fā)生什么。

　　比如別寫(xiě)“了解詳情”，不如直接寫(xiě)“查看詳情”；別寫(xiě)“進(jìn)行購(gòu)買(mǎi)”，簡(jiǎn)單兩個(gè)字“購(gòu)買(mǎi)”就夠了。還要注意文字大小，不能太小，保證用戶(hù)不用瞇眼就能看清；文字和按鈕邊緣要留足空白，別擠在一起，看起來(lái)才舒服。

　　3、點(diǎn)著順手：尺寸和位置要適配操作習(xí)慣。

　　按鈕尺寸不能太小，尤其是移動(dòng)端網(wǎng)頁(yè)，用戶(hù)用手指點(diǎn)，按鈕高度至少要44px，寬度根據(jù)文字長(zhǎng)度調(diào)整，太窄太小時(shí)很容易點(diǎn)錯(cuò)。

　　位置也要符合用戶(hù)習(xí)慣，比如“提交”“下一步”這類(lèi)按鈕，通常放在頁(yè)面右下角；“返回”“取消”放在左上角或左下角，跟著用戶(hù)的操作流程來(lái)，不用讓用戶(hù)到處找按鈕。

　　另外，多個(gè)按鈕并列時(shí)，要按重要的程度排序，核心按鈕放在最顯眼的位置，間距也要足夠，這樣才能避免誤觸。

　　4、有交互感：加個(gè)反饋，讓用戶(hù)知道“點(diǎn)中了”。

　　好的按鈕要有交互反饋，用戶(hù)在點(diǎn)擊的時(shí)候就能明顯的感覺(jué)到“我點(diǎn)中了”，這樣體驗(yàn)才會(huì)更順暢。

　　比如按鈕默認(rèn)狀態(tài)是平面的，點(diǎn)擊時(shí)輕微凹陷；或者默認(rèn)是一種顏色，點(diǎn)擊時(shí)顏色加深一點(diǎn)、亮度降低一點(diǎn)；也可以加個(gè)小動(dòng)畫(huà)，比如點(diǎn)擊時(shí)輕微縮放。這種小反饋能給用戶(hù)明確的操作提示，避免用戶(hù)反復(fù)點(diǎn)擊，也讓操作更有儀式感。

　　最后提醒下：風(fēng)格統(tǒng)一，別太花哨。

　　整個(gè)網(wǎng)頁(yè)的按鈕風(fēng)格要保持一致，比如圓角大小、顏色體系、文字字體都要統(tǒng)一，別這個(gè)按鈕是方角，那個(gè)是圓角，這個(gè)是紅色，那個(gè)是藍(lán)色，用戶(hù)會(huì)覺(jué)得混亂。也不用加太多復(fù)雜效果，簡(jiǎn)單干凈的設(shè)計(jì)反而更顯專(zhuān)業(yè)。

　　以上就是為大家總結(jié)的幾點(diǎn)按鈕設(shè)計(jì)的核心要點(diǎn)，大家有不懂的，可以多了解以上幾點(diǎn)，把這些基礎(chǔ)點(diǎn)做好，再保持風(fēng)格統(tǒng)一，就能幫助大家做出好用又好看的按鈕，來(lái)引導(dǎo)用戶(hù)們順利完成操作，希望以上幾點(diǎn)能給大家?guī)?lái)幫助。