通過(guò)簡(jiǎn)單的案例和分析，說(shuō)明了“行動(dòng)召喚”對(duì)轉(zhuǎn)化率的重要價(jià)值，以及如何將其價(jià)值最大化。

數(shù)字產(chǎn)品都在努力爭(zhēng)取用戶們有限的注意力，現(xiàn)代經(jīng)濟(jì)越來(lái)越多地圍繞人類的注意力范圍而展開(kāi)，一個(gè)單一要素就能發(fā)揮完全不同的作用。

因此，行動(dòng)召喚按鈕在每個(gè)用戶界面中都起著至關(guān)重要的作用。

對(duì)于不熟悉市場(chǎng)營(yíng)銷術(shù)語(yǔ)的任何人，以下是來(lái)自Investopedia的簡(jiǎn)要介紹：

行動(dòng)召喚（CTA）是一種營(yíng)銷術(shù)語(yǔ)，是指營(yíng)銷人員希望其受眾或讀者采取的下一行動(dòng)。行動(dòng)召喚可以直接將用戶引導(dǎo)至購(gòu)買。

簡(jiǎn)而言之，行動(dòng)召喚是您希望網(wǎng)站訪問(wèn)者采取的下一步行動(dòng)。

讓我們通過(guò)一些技巧來(lái)克服最常見(jiàn)的陷阱，以及一些描述性的示例來(lái)分析注意力是如何工作的。

一、引人注目的文本

Brian Clark在他的Blog中充分地說(shuō)明了文字的力量，社會(huì)心理學(xué)家艾倫·蘭格（Ellen Langer）要求在復(fù)印機(jī)前插隊(duì)，她嘗試了三種不同的詢問(wèn)方式：

1. 對(duì)不起，我有五頁(yè)要復(fù)印。我可以先使用復(fù)印機(jī)嗎？——60％的人同意了請(qǐng)求。
2. 對(duì)不起，我有五頁(yè)要復(fù)印。因?yàn)槲液苤保梢韵仁褂脧?fù)印機(jī)嗎？——94％的人同意了請(qǐng)求。
3. 對(duì)不起，因?yàn)槲矣形屙?yè)不得不復(fù)印。可以先使用復(fù)印機(jī)嗎？——93％的人同意了請(qǐng)求。

觸發(fā)詞“因?yàn)椤笔侨绱藦?qiáng)大，以至于您提供的“原因”似乎并不重要，即便是從一個(gè)四歲孩子的口中說(shuō)出來(lái)。

突出的結(jié)果是，某些詞語(yǔ)比其他詞語(yǔ)更能有效地說(shuō)服人們。專家們表示，通過(guò)在簡(jiǎn)歷中加入一些涉及情感的特定詞匯，可以增強(qiáng)簡(jiǎn)歷的說(shuō)服力。

如圖所示，Slack利用了free這個(gè)詞的雙重含義，不僅代表了免費(fèi)，而且行動(dòng)自由和選擇自由都會(huì)影響潛意識(shí)的用戶行為。

許多網(wǎng)站在他們的行動(dòng)召喚用語(yǔ)中使用的另一種策略，是其消息的語(yǔ)氣。關(guān)于操作的動(dòng)詞引入了一種直接的、面向操作的方法，它會(huì)觸發(fā)用戶采取特定的操作，因?yàn)樗鼈兓卮鹆艘粋€(gè)基本問(wèn)題“為什么我應(yīng)該點(diǎn)擊這個(gè)按鈕？”。

大多數(shù)成功的公司都使用了“免費(fèi)試用”、“了解更多”、“搶先體驗(yàn)”、“入門”等階段，并通過(guò)在行動(dòng)召喚的文案中增加價(jià)值來(lái)提升轉(zhuǎn)化率。

二、最容易被識(shí)別的對(duì)比色

行為召喚按鈕是馮·雷斯托夫效應(yīng)（Von Restorff effect）的最佳范例。

馮·雷斯托夫效應(yīng)也稱為“隔離效應(yīng)”，它指出了當(dāng)存在多個(gè)相似物體時(shí)，與其他物體都不同的那個(gè)最可能被記住。

這是為什么必須要讓“行為召喚”按鈕彈出，并在其他按鈕中脫穎而出的最重要原因。

由VisualEyes生成的眼動(dòng)熱力圖

顏色是影響按鈕隔離效果的首要因素，應(yīng)該始終嘗試通過(guò)使用對(duì)比色來(lái)吸引用戶注意，使主要操作按鈕更加突出。

首先，應(yīng)該確保按鈕的顏色、視覺(jué)效果和排版能夠和諧的構(gòu)成一個(gè)控件元素?？勺x性，易讀性和對(duì)比度非常重要，您應(yīng)該事先對(duì)其進(jìn)行測(cè)試。

Stark插件是一個(gè)在設(shè)計(jì)時(shí)幫助您進(jìn)行對(duì)比度檢查的好工具。

通過(guò)Stark插件，可以看出黑色按鈕的對(duì)比度最佳

此外，關(guān)于對(duì)比度的方法不僅適用于按鈕元素本身。一個(gè)行動(dòng)召喚按鈕應(yīng)具有足夠的對(duì)比度，并且與整個(gè)界面相比要格外突出。

Sketch的首頁(yè)是一個(gè)完美的示例，它說(shuō)明了行動(dòng)召喚與頁(yè)面內(nèi)容對(duì)比度的重要性。它不僅遵循產(chǎn)品的品牌色，而且創(chuàng)建了一個(gè)醒目的“行動(dòng)召喚”按鈕，吸引了絕大多數(shù)訪問(wèn)者的注意力。

一句話概括，就是讓人覺(jué)得“我不能不點(diǎn)這個(gè)按鈕！”

由VisualEyes生成的眼動(dòng)熱力圖

三、合適的尺寸很重要

尺寸和位置在行動(dòng)召喚中的可視性和可達(dá)性中起著至關(guān)重要的作用，相當(dāng)多的變量定義了按鈕的適當(dāng)大小。

在對(duì)按鈕大小和間距的研究中，發(fā)現(xiàn)了一種適用于大多數(shù)用戶（包括老年人）的標(biāo)準(zhǔn)。

研究表明，使用42-72像素之間的按鈕可以達(dá)到最高的準(zhǔn)確性；也就是說(shuō)，最適合用戶的最小按鈕尺寸是42像素，最大按鈕尺寸是72像素。

太大的按鈕會(huì)吸引絕大多數(shù)用戶的注意力，使用戶無(wú)法了解該服務(wù)所提供的其他內(nèi)容，這對(duì)頁(yè)面內(nèi)容的理解有重要影響。而將按鈕設(shè)置得太小會(huì)嚴(yán)重影響其可訪問(wèn)性，沒(méi)有什么比按鈕太小到無(wú)法點(diǎn)擊而令人沮喪的了。

移動(dòng)端界面有著另一個(gè)常見(jiàn)問(wèn)題：“為拇指設(shè)計(jì)”這個(gè)術(shù)語(yǔ)是由Scott Hurff提出的，應(yīng)得到高度的重視。這意味著在我們應(yīng)當(dāng)在拇指自然的弧形范圍內(nèi)，構(gòu)建最舒適使用的界面。

部分iPhone型號(hào)對(duì)比，綠色區(qū)域代表了移動(dòng)設(shè)備上最舒適的自然觸碰區(qū)域

顯然，行動(dòng)召喚按鈕應(yīng)該很容易觸及。

因此，考慮到“拇指區(qū)”的熱圖，設(shè)計(jì)人員可以輕松地為行動(dòng)召喚按鈕選擇最合適的位置。在應(yīng)用程序的自然舒適區(qū)域內(nèi)，用戶按下按鈕的幾率可以成倍增加。

四、遵循用戶的視線路徑

用戶在使用頁(yè)面內(nèi)容時(shí)遵循的直接路徑非常重要，通過(guò)自然閱讀的方式來(lái)排列文案和按鈕，您可以直接將訪問(wèn)者召喚至下一步行動(dòng)。

上述內(nèi)容符合菲特定律（Fitt‘s Law），獲取目標(biāo)的時(shí)間取決于目標(biāo)的距離和大小。因此，通過(guò)將行動(dòng)召喚放置在用戶流程的末尾，您可以減少轉(zhuǎn)化所需的用戶認(rèn)知和物理操作。

由VisualEyes生成的眼動(dòng)熱力圖

通過(guò)觀察注意力熱度圖，您會(huì)發(fā)現(xiàn)最常見(jiàn)的眼睛掃描模式是F形。最近的眼動(dòng)研究表明，無(wú)論是在臺(tái)式機(jī)還是在移動(dòng)設(shè)備上，F(xiàn)形掃描模式在當(dāng)今世界都是最為常見(jiàn)的。

這種引人入勝的閱讀模式，更多地取決于人類的行為而不是技術(shù)，它說(shuō)明了“搜索”的行動(dòng)召喚按鈕可以被放在左下角。

Airbnb的設(shè)計(jì)師采用了一種不同的方法，他們利用了Z型布局和Gutenberg圖，將行動(dòng)召喚按鈕放置在末端位置，以便消除視覺(jué)干擾并鼓勵(lì)用戶行動(dòng)。

1. 主要視覺(jué)區(qū)域；
2. 強(qiáng)非活躍區(qū)域；
3. 弱非活躍區(qū)域；
4. 末端區(qū)域：箭頭代表用戶閱讀視線的慣性引力。

當(dāng)用戶視線到底表單右下角時(shí)，閱讀或“視線掃描”過(guò)程被中斷，此時(shí)用戶需要進(jìn)行下一步行動(dòng)，因此是插入行動(dòng)召喚元素的最佳位置。

小結(jié)

通常，行動(dòng)召喚元素會(huì)對(duì)轉(zhuǎn)化率產(chǎn)生巨大影響，并且被視為界面中最重要的元素。

通過(guò)牢記一些基本的設(shè)計(jì)原則，您可以使行動(dòng)召喚按鈕脫穎而出，并抓住它所需的關(guān)鍵注意力。

重新發(fā)明輪子并沒(méi)有必要，有時(shí)候，真正擅長(zhǎng)某些事情的最佳方法是向行業(yè)領(lǐng)袖學(xué)習(xí)。

仔細(xì)研究最成功的互聯(lián)網(wǎng)公司以及它們?nèi)绾螄@行動(dòng)召喚來(lái)組織內(nèi)容，這將幫助您找出最有效的基本模式。

本文譯自Raptis Dimitris的Call to Action: The Ultimate Survival guide

原文地址：https://medium.muz.li/call-to-action-an-extensive-guide-140fef523b08

本文由 @海外設(shè)計(jì)參考 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來(lái)自 Unsplash，基于 CC0 協(xié)議