CTA 設計 – 一點小細節,大不同

已發表: 2023-01-19

CTA 設計 – 一點小細節,大不同

你集思廣益。 你有完美的設計。 您的廣告成功地吸引了合適客戶的注意力。 但是他們看到它並滾動過去而沒有點擊廣告。 你喜歡嗎? 明顯不是! 但是是什麼讓您的客戶忽略了廣告? 是調色板還是副本? 你可能會想到很多原因。 但是您仔細檢查了 CTA 設計嗎? 可能不會。 這可能是您檢查的最後一件事,但理想情況下,它應該是第一件事!

是的,您不希望僅僅因為設計不當或 CTA 薄弱而浪費完美的廣告。 事實上,如果 CTA 沒有達到目的,你甚至不能稱其為“完美廣告”。

但是 CTA 中的內容對嗎? 大多數時候,您只會看到一個簡單的“單擊此處”或“了解更多”。 我們聽到你了。 但是,不管你信不信,從 CTA 按鈕的位置到你選擇的顏色、你使用的副本以及其中的字體樣式,一切都會直接或間接地影響它對觀眾的影響。 很好奇嗎? 那就做好準備吧。 我們今天要討論的是 CTA 設計。

  • CTA 設計——那麼,為什麼它很重要?
    • 1. CTA 讓你的廣告目標明確
    • 2.幫助客戶做決定
    • 3.幫助提高轉化率
  • CTA 設計:使其具有點擊價值的技巧
    • 1. 對文案稍作調整大有幫助
    • 2. 讓你的 CTA 看起來像一個按鈕
    • 3. 為您的 CTA 選擇正確的顏色
    • 4.注意CTA設計的不透明度
    • 5.利用負空間來發揮你的優勢
    • 6. 不要添加太多 CTA
    • 7.但是當有多個方向時,保持一致性
  • 使用 Kimp 創建值得點擊的 CTA 設計

CTA 設計——那麼,為什麼它很重要?

號召性用語或 CTA 必須是您廣告中的亮點。 讓我們來看看為什麼 CTA 成為大多數營銷圖形中最關鍵的組成部分的一些原因。

1. CTA 讓你的廣告目標明確

要定義 CTA,您需要知道廣告的目標是什麼。 例如,對於您在各種平台上的所有活動,您不希望客戶訪問您的網站主頁。 對於其中一些廣告,您希望客戶下載您的應用程序。 有些人應該將他們帶到潛在客戶捕獲頁面,以便您可以收集他們的詳細聯繫信息,以用於未來的潛在客戶培育工作。 而其他人可能必須將客戶帶到銷售頁面或產品頁面,以幫助他們將商品添加到購物車並儘快進行購買。

因此,您的 CTA 有助於根據您為活動、特定廣告或營銷設計設定的目標將流量引導至預期方向。

2.幫助客戶做決定

客戶知道他們在尋找什麼,但無論您相信與否,大多數消費者都希望在做出購買決定時得到一點幫助。 大多數廣告、登陸頁面和其他營銷設計都有一個或兩個 CTA。 在電子郵件中,當涉及一組產品類別或購物指南電子郵件時,您可能會有多個。 無論哪種方式,添加 CTA 都能確保客戶克服決策疲勞並更有信心地進行下一步。

3.幫助提高轉化率

有時,客戶不會繼續進行您的潛在客戶漏斗中的下一步,僅僅是因為他們不知道下一步該去哪裡。 添加 CTA 可以讓他們更容易理解這一點。

讓我們舉個例子來更好地理解這一點。 下面的滑塊出現在 Apple 網站上。

來源

好吧,那麼路易斯·阿姆斯特朗 (Louis Armstrong) 的黑與藍調呢? 為什麼客戶會在 Apple 網站上看到這個? 也許底部的 Apple TV 標誌表明這部紀錄片在 Apple TV 上可用。 但那又怎樣? 如果不是 CTA“Stream Now”,上面的大部分答案都沒有答案。 困惑的客戶可能只是滾動瀏覽了它。 但由於 CTA 按鈕,訪問者知道單擊它會毫不費力地把他們帶到 Apple TV 上的流媒體頁面。 這會促使他們點擊滑塊。 在那裡,轉換剛剛發生!

這是實現轉化最直接的方法是添加清晰易懂的 CTA 的示例。

確定了 CTA 在設計中的重要性這一事實後,我們現在來談談一些 CTA 設計技巧。

CTA 設計:使其具有點擊價值的技巧

您的 CTA 應該是設計中明顯可區分的細節。 但與此同時,它不應分散客戶對前面的基本信息的注意力。 您的視覺效果、文案和 CTA 一起應該清楚地呈現信息,並告訴客戶為什麼他們應該點擊 CTA 以及當他們點擊時會發生什麼。 為了實現這一切,這裡有一些技巧可以讓您的 CTA 有利於您的設計。

1. 對文案稍作調整大有幫助

您應該知道,閱讀廣告或網頁標題的用戶中有 90% 也會閱讀 CTA 文案。 所以,是的,副本確實很重要。

在下面的 CTA 中,一個簡單的“下載”CTA 就足夠了。 但是添加“免費”一詞可以讓客戶放心,他們目前無需支付任何費用,但仍然可以下載內容。

空白的
來源

據估計,個性化 CTA 的性能比簡單 CTA 高 202%。 所以,花足夠的時間在副本上。 確定聽起來最有說服力且與上下文最相關的最佳詞語。

個性化的 CTA 是讓客戶知道單擊按鈕時會發生什麼的輕鬆方式。 例如,在下面的電子郵件中,服裝會立即了解到單擊“保留您的位置”按鈕會將他們帶到預訂頁面。 因此,只有當他們真正有興趣進行預訂或了解更多信息時,他們才會點擊該按鈕。

空白的
Kimp 的電子郵件設計

因此,如果您有個性化的 CTA,您可以確定只有真正感興趣的潛在客戶才能進一步沿著渠道向下移動。 這些是最有可能轉化的線索。 如果他們不這樣做,您就會知道他們是重新定位的潛在客戶。

Kimp 提示:為了讓您的 CTA 文案發揮最大的影響力,請選擇一種簡單易讀的字體。 遠離花哨的字體和裝飾風格。 號召性用語應該易於閱讀。

在不使用太多字體的情況下組合正確的字體感覺像是一項艱鉅的任務? 專業的設計師來處理。

2. 讓你的 CTA 看起來像一個按鈕

如果號召性用語看起來像文案的其餘部分,客戶如何知道他們可以點擊那裡進入下一步? 因此,讓您的 CTA 看起來與副本的其餘部分不同。

像讓 CTA 看起來像一個按鈕這樣簡單的事情就可以將點擊次數顯著提高 45%。 當然,根據設計其餘部分的視覺風格和您品牌的視覺標識,您始終可以根據需要使用平面按鈕或擬物化(三維)按鈕。 但只要它作為一個按鈕很容易被感知,訪問者點擊它的機會就更大。

3. 為您的 CTA 選擇正確的顏色

您是否知道只需更改 CTA 設計的顏色就可以極大地改變 CTA 的外觀和效果? 事實上,SAP 注意到橙色的 CTA 按鈕將他們的轉化率提高了 32.5%。

當然,其他一些顏色可能更適合您的品牌。 您可以通過進行 A/B 測試來解決這個問題。 一種方法是創建同一設計的兩個不同版本,保留除 CTA 之外的所有內容。 在這兩種設計中使用不同顏色的 CTA 設計,看看哪一種轉換效果更好。 如果你在網頁上測試這個想法,你還可以使用熱圖和其他跟踪工具來了解訪問者的行為並對你的設計進行進一步的調整。

選擇顏色後,請確保您的 CTA 從背景中脫穎而出。 CTA 和背景不能使用相同的顏色。 CTA 設計的顏色與背景顏色和整體調色板之間應該有很好的對比。 如果 CTA 不容易被識別,即使是最好看的 CTA 設計和最好的副本也沒有用。

空白的
由 Kimp 設計的網頁橫幅

在上面的示例中,紅色 CTA 從深色背景中脫穎而出。 因此,不存在用戶沒有註意到 CTA 的風險。

Kimp 提示:顏色和顏色對比以棘手的方式發揮作用。 有時,具有最大對比度的顏色放在一起時可能會造成很大的視覺疲勞。 要了解有關配色方案以及如何選擇對比色的更多信息,請查看我們關於色輪和配色方案的博客。

4.注意CTA設計的不透明度

您的 CTA 設計不易識別的另一個原因可能是背景圖案和 CTA 設計的不透明度。 透明或半透明的 CTA 可能會在擁擠的背景中迷失。 在這種情況下,不透明的按鈕會使 CTA 彈出。 或者,您也可以在下面的設計中添加細微的細節,例如圍繞 CTA 的突出顯示。 這些細節進一步增強了 CTA 的外觀並引起了人們的注意。

空白的
由 Kimp 設計的網頁橫幅

想要為您的數字營銷活動製作如此醒目的橫幅嗎? 立即聯繫Kimp 團隊。

5.利用負空間來發揮你的優勢

在 CTA 周圍添加負空間可以將轉化率提高約 230%。 這是因為有效地使用負空間可以減少 CTA 周圍的所有混亂,並將注意力引向它。

空白的
Kimp的著陸頁設計

在上面的著陸頁中,CTA 下方的所有空間使 CTA 很容易被注意到。吸引您眼球的 CTA 是最有可能被點擊的。 因此,為確保客戶不會因為沒有註意到頁面上的 CTA 而離開,請在其周圍添加大量的負空間。

6. 不要添加太多 CTA

理想情況下,您應該為您的營銷設計明確定義一個方向。 選擇的目標和選項的提供處於早期階段。 您需要明確定義潛在客戶類別,並且您的廣告應該準確定位。 當您的廣告被隔離時,定義您的 CTA 變得更加容易。 我們會給你幾個例子。

  • 如果您的目標是潛​​在的潛在客戶,您可能會有介紹您的品牌或說服他們訪問您的網站的內容。 在這種情況下,CTA 最有可能將他們帶到網站或您的社交媒體頁面以收集更多信息。
  • 您登陸您的網站或社交媒體頁面的潛在客戶已表現出第一層次的興趣。 接下來是用正確的策略說服他們。 在這裡,您可能會使用帶有下載按鈕的鉛磁鐵或帶有訂閱按鈕的鉛捕獲頁面。
  • 對於現有客戶,當您發送有關他們願望清單中的商品或他們一直在瀏覽的商品的相關報價時,您的 CTA 會將他們帶到產品頁面。
  • 如果是一封電子郵件地址是購物車放棄,CTA 會將客戶帶到他們的購物車以繼續下訂單。

您需要更好地了解買家的旅程,以了解他們正在尋找什麼以及他們接下來應該去哪裡。 在所有這些情況下,擁有一個 CTA 最有意義。

對於處於潛在客戶漏斗早期階段的潛在客戶,太多的選擇可能會導致混亂,而困惑的潛在客戶可能不會做出決定。

空白的
來源
7.但是當有多個方向時,保持一致性

對於簡單的營銷設計,單個 CTA 可以避免混淆並提高轉化率。 但在某些地方,您需要多個 CTA 才能產生最大影響。 這是長格式設計的情況,例如登錄頁面和一些電子郵件。

當內容很長時,經常中斷並在每個部分添加 CTA 將比希望客戶一直閱讀到頁面底部並在那裡找到 CTA 要好得多。

或者,如果著陸頁或電子郵件採用購物指南的格式,客戶可以在其中看到一組要購買的產品選項,那麼每個選項的不同 CTA 將最有意義。

在所有這些你有多個 CTA 的情況下,在它們之間建立視覺上的一致性。 如果每個 CTA 設計看起來彼此不同,它會使整體設計看起來笨拙。 要保留的幾件事是:

  • CTA 按鈕的形狀和顏色
  • CTA 副本中使用的字體
  • 在按鈕內對齊 CTA 副本
  • CTA 按鈕的方向

下面的著陸頁每個部分都有不同的 CTA,但 CTA 設計看起來都是一致的。 它使頁面看起來更有條理。 從可用性的角度來看,一旦客戶看到幾個這樣的 CTA,只要他們在網站上看到類似的綠色按鈕,他們就會知道這是一個指向另一個步驟的可點擊鏈接。

空白的
Kimp的著陸頁設計

使用 Kimp 創建值得點擊的 CTA 設計

CTA 通過將客戶帶到預期的方向,使大多數營銷設計感覺完整。 因此,不要忘記將 CTA 添加到您的電子郵件、登錄頁面、橫幅廣告和所有其他與 CTA 相關的營銷設計中。 CTA 也出現在平面廣告中,在這裡它們主要是網站地址或企業的聯繫信息。 但是,它們仍然需要從設計的其餘部分中脫穎而出,以便客戶採取您希望他們採取的行動。 如果添加 CTA 沒有弄亂設計結構,或者如果理解在哪裡使用 CTA 以及如何使用 CTA 似乎讓您感到困惑,請將其留給您的設計師。 選擇 Kimp 訂閱。 立即註冊免費試用。