Call-To-Action（CTA）是我們常見的用戶交互元素，也是數字行銷中的一個轉化率優化課題。好的CTA設計可以提升轉化率，而糟糕的CTA設計會平白浪費寶貴的流量。HubSpot One將以此文為讀者總結CTA設計的要點。
什麼是Call To Action？
一般譯作行動召喚。是指頁面、視圖、電郵、廣告中號召指引用戶產生特地行為的交互元素。比如常見的“了解更多”按鈕，“立即註冊”按鈕。如果沒有CTA，用戶會有這樣的疑問——“我來到這個界面，你到底期望我做什麼？”這樣你的內容就單單成為informational的內容，而不是transactional的內容了。
設計CTA的時候需要考慮哪些方面？
首先，請在心中默念三遍：“好看不一定好用”。在設計CTA的時候我們通常從下面幾個方面來考慮：
- 數量
- 位置
- 形狀
- 顏色
- 大小
- 文字
- 移動版
可以說一個優秀的CTA沁透了優秀的已轉化為中心的設計師和行銷者的良苦用心和滿滿的愛！
CTA設計在數量上有哪些考慮？
我們常用的CTA有單個使用的，也有兩個一組使用的。一般不建議超過兩個。單獨使用時CTA更給用戶“強勢”的感覺，也就是暗示在此界面中，執行該操作是唯一選擇。單獨使用CTA是許多落地頁的普遍用法。然而，有時我們也可以留給用戶一些後退的餘地，加入第二個CTA。在這兩個CTA之間我們可以留有差別，也可以使用同種設計不注入我們的傾向讓用戶自己決定。
如果你運營著一個在線社區，你可以在落地頁放上一個醒目的“立即加入”按鈕。但是如果你覺得讓用戶先以匿名遊客看看更能夠幫助轉化則可以在此按鈕旁邊加上第二個“匿名預覽”的按鈕。下面這個Spotify的落地頁是另一個優秀的範例
CTA應該放在什麼位置？
CTA應該放在界面的醒目位置，如果是網頁中則應該放在第一屏。 CTA應該放在你的行銷訊息之後，在訪客視線的必經之路上。許多時候我們還會用箭頭來幫助用戶更加容易地找到CTA。
為了使CTA更為醒目，你需要在其周圍留足空白。我們之前在討論交互設計師素養的時候也提到過這點。當然你也可以通過人物視線來引導訪客視線，如下圖：
我們之後還會討論手機版的情況。
CTA的形狀有什麼講究？
你可以用幾個文字或者一個圖標來構成CTA，但是作為CTA的按鈕的點擊率大多數情況下會遠超前者。畢竟“被點”這件事上來講，按鈕就是為此而生的。
為了讓按鈕更像按鈕，我們可以調整材質、紋理或利用陰影來凸顯按鈕。你可以使用圓形或圓角矩形來與輸入框的長方體區別開來。不過請務必保證平台按鈕不會形狀各異五花八門。
下面的案例中Google用了一個無法點擊的按鈕形狀文本“您還在等什麼呢？”讓人十分無語。
作為CTA的按鈕推薦什麼顏色呢？
許多時候我們選擇按鈕顏色都是因為我們品牌的VI，或者說老闆色，身不由己。但如果讓你放開大膽選擇你會選擇什麼顏色呢？
CTA按鈕用什麼顏色似乎早有定論。比如紅、綠、橙（黃）依次是轉化率最高的按鈕顏色，而黑、白、棕依次是轉化率最低的按鈕顏色。看著這個結論我們其實可以說許多故事，比如紅色代表激情，綠色代表通行，橙色代表溫暖安心等等。但HubSpot One還是希望讀者結合按鈕所在的頁面顏色選出優秀對比度且更吸睛的按鈕顏色，除非……
除非你想用鬼按鈕！
鬼按鈕（Ghost Button）就是那些空心的只有框沒有填充色的按鈕。這種設計蘋果愛用，已經流行了幾年。鬼按鈕看上去很乾淨，與環境自然地融為一體，以至於讓人忘了要去點擊。因此鬼按鈕不是任何人都能駕馭的。
雖然有許多“國際品牌”都曾經或者正在使用鬼按鈕，但是HubSpot One還是想勸退行銷者們盡量避免使用這種設計。如果要使用請增加按鈕的尺寸來填補存在感低的問題，也可以僅在次要CTA使用鬼按鈕（如上面Spotify的例子），以此來襯托作為主CTA的實心按鈕。
尺寸並不是越大越好？ ！
按鈕的尺寸並不是越大越好，按鈕太大會變醜只是次要原因，主要原因是因為太大的尺寸會吞食周圍的留白。作為CTA的按鈕在尺寸方面還有一個常見的問題是將按鈕和上方的輸入框設計得一樣寬，這裡就不舉例了。這樣的設計會讓按鈕變得不像按鈕。正確的做法是將按鈕設計得略短於上方的文案或者輸入框。這在平面設計上叫作倒金字塔設計，會增加行動的緊迫感。
CTA上的文案有哪些注意點？
相比“查看詳情”，“了解更多”這樣的“大街貨”，你可以更加個性化地設計按鈕上的文字，如“免費領取課程大綱”，“開始七天無限試用”。最重要的是要體現價值讓用戶有收益的預期。
在按鈕周圍，你或許需要一些其他文字來掃除用戶點擊的顧慮，如“30天價格保障”，“7天無條件退款”等。你也可以通過這些文案來增加轉化緊迫感，如“僅剩32份”，“剩餘36小時”。不過要注意的是不可以欺騙用戶哦！
你需要明確用戶行為的預期，如果點擊了以後就冷不防自動下載一個100M的APP，你可能一開始就失去用戶的信任。
最後，CTA按鈕內的文案不易過長，畢竟越短越有力。你還要避免在按鈕文字最後以感嘆號或問號這樣的標點符號結尾，這讓你的CTA看上去不像CTA。
移動設備上的CTA一樣設計嗎？
當然不一樣！你有沒有遇到過手機上輸入法打開後把表單下面的按鈕擋住的情況？在小屏上設計CTA需要有場景方面的考慮。
一個移動設備UI設計師熟知的概念叫作拇指區域（Thumb Zone）。這是當人們單手握手機時拇指能覆蓋的操控區域。
上圖很好地解釋了拇指區域，你需要把CTA安放在綠色區域才不會給正在交互的用戶造成困擾。
除此之外，按鈕在移動設備上要達到足夠讓胖手指的用戶輕鬆點擊的安全大小（你的手指會遮住按鈕）。你更需要對CTA周圍進行留白排除乾擾。
CTA的優化方法是？
至此，我們講了許多CTA的雷坑也講了一些最佳實踐。那麼CTA究竟如何優化呢？唔呣，當然是A/B測試了。 A/B測試不同的CTA可能是最容易測試的元素了，很容易在Google Optimize這樣的工具中進行。不過你還可以使用鼠標跟踪和眼球跟踪等手段，此時你或許需要專業的團隊來協助。