如何設計萬無一失的鏈接和 CTA

您是否曾經查看過您的網站統計數據並想知道：“為什麼人們不去我希望他們去的地方？”

他們為什麼不訪問您的產品頁面？ 他們為什麼不進行任何購買？

在這篇文章中，我將分享一些專家提示，可以幫助您控制訪問者在您的網站上的進度。

確定問題

首先，我們需要確定問題可能是什麼。 有用的工具（例如 Google Analytics）可以為您提供有關您網站的大量統計信息，但我發現更多的可視化工具，例如 Crazy Egg、Heatmap.com 和 Inspectlet，確實可以幫助您準確定位您網站中的問題所在。網站謊言。

擁有像熱圖這樣的視覺參考框架可以立即向您展示吸引觀眾注意力的內容。 當與滾動圖結合使用時，它特別有用，它可以告訴您頁面訪問者正在看多遠！ 有時，問題可以快速而容易地糾正，但有時並不那麼清楚。 希望這些提示將幫助您改進網站並實現更多目標。

解決方案

明晰

儘管聽起來很愚蠢，但有時問題可能很簡單，因為客戶一目了然不知道什麼是鏈接，什麼不是。 雖然這對您自己和其他人來說似乎很明顯，但我們必須記住，每個人的運作方式都不同，他們可能會以不同的方式查看您的網站。

例如，您網站上的宣傳圖片可能會使您難以確定訪問者應該點擊的位置。 這是 downloads.cnet 和 filehippo.com 等網站上非常常見的問題：

在這方面，Download.cnet.com 和 filehippo 一樣糟糕。 您是否首先看到了下載鏈接或頁面頂部明亮的橙色和藍色大橫幅？ 在這種情況下，它只會將您帶到該公司的網站，但另一個網站可能會將您帶到任何地方。

他們怎麼能解決這個問題？ 簡單的說清楚就可以立即解決這個問題。 他們需要將他們的鏈接與試圖誤導人們的廣告分開。 一種方法是在標題和隨後的下載鏈接周圍添加一個明顯的大邊框，甚至是完整的背景顏色和間距以進一步強調標題和下載鏈接。 即使像指向下載鏈接的箭頭這樣簡單的東西也會產生奇蹟！ 任何能讓他們的鏈接快速從其他鏈接中脫穎而出的東西，從而減少任何“錯過的點擊”。

風格

另一個問題可能是您的鏈接和 CTA 的樣式。 現在，在造型方面沒有對錯之分。 這一切都取決於什麼適合您的設計和網站，您覺得什麼看起來最好，以及什麼最適合您的觀眾。

話雖如此，您可能已經註意到，在過去幾年裡，在“空白”的廣闊海洋中，大而明亮的按鈕大量湧現。 這種趨勢有很好的理由。 研究和統計數據表明，訪問者更有可能參與這些類型的鏈接，可能比其他變體更多：

但這是為什麼呢？ 為什麼作為用戶，我們被吸引到很少有交互元素的網站，而不是有很多途徑和鏈接可供探索的網站？

很簡單：這不僅消除了任何混亂，而且樣式使可點擊和不可點擊變得非常簡單明了。 CTA 和註冊/登錄按鈕引起我們的注意並邀請我們點擊它們。

但這是否意味著我們所有的鏈接都應該是明亮的大按鈕？

一點也不。 我們只想突出我們的“號召性用語”，即我們希望訪問者參與的鏈接——我們認為，這將以某種方式使他們和我們受益，例如促銷銷售頁面或最新消息故事。

回到 PayPal 的例子，可以將純文本鏈接用於更標准或不太重要的鏈接，只要它們仍然是指向某物的非常明確的鏈接。 在過去，它總是用帶下劃線的文字表示，今天我們仍然可以使用它，只要它適合設計——儘管有些人覺得帶下劃線的鏈接在現代設計中幾乎沒有地位。

例如，查看 PayPal“了解更多”鏈接下方的文字，“不是 PayPal 客戶？ 開始。 ” 通過簡單地強調最後兩個詞，吸引了參觀者的注意力，並巧妙地鼓勵他們進行互動。 “這段文字是不同的，”他們認為。 “有東西嗎？ 為什麼那一點是粗體的，而其餘的不是？” 這會邀請用戶將鼠標懸停在它上面並發現它是一個鏈接！

這是一個簡單的區別，但在一個我們必須為用戶的每一秒注意力而戰的世界中，這是一個可以導致點擊的差異，而且它可以很容易實現。 看看什麼最適合您的網站和您的客戶。

屏幕上的位置

用戶幾乎沒有時間在網站上搜索鏈接，而浪費的時間越多，就會導致更多人離開您的網站。 那麼我們怎樣才能避免這種情況呢？ 同樣，我們只是讓用戶可以盡可能輕鬆地識別鏈接。

滾動圖在這裡可以提供巨大的幫助。 根據我的經驗，幾乎所有頁面的訪問者都會看到頁面的最頂部，但只有不到 20% 的人會一直滾動到底部——對於更長的頁面，甚至更低。 然而，超過 80% 的人會看到頁面的前 50%。

除了屏幕分辨率和設備尺寸之外，屏幕尺寸在這方面發揮著重要作用。 但是，這確實意味著您的訪問者可能看不到顯示器底部下方的任何內容。 因此，理想情況下，我們希望確保我們寶貴的 CTA 位於頁面的高處。 問題解決了對吧？

這對於經驗法則來說是一件好事，尤其適用於單一產品和促銷活動。 但是，例如，當您比較產品的搜索結果時呢？ 您將有許多對象爭奪訪問者的注意力。

在這裡，您需要在設計中將三件事結合在一起：清晰度、風格和位置。 要記住的關鍵是，如果屏幕上的信息太多，用戶會很快失去興趣。 如果你有很多產品要展示，你想給他們提供你能負擔得起的最少信息——最好是標題、價格和“更多信息/立即購買”CTA。

由您決定還包括哪些內容。 但是對於設計的好例子，看看像 Tesco 這樣的大型超市網站：

簡單搜索“麵包”會產生數百種不同的產品，但 Tesco 為所有產品提供了足夠的空間，並將購物過程簡化為“數量？” 和“添加”。

您可能還會注意到按鈕遵循所有規則：它們很清晰，它們的間距和样式都很吸引人，並且它們邏輯地出現在網格上、產品下方以及它可能具有的任何描述上。

四處搜索其他示例，看看大型電子商務網站在展示多個 CTA 時會做什麼，您可能會對所發現的內容感到驚訝！

概括

希望這篇博客能讓您深入了解可以真正幫助提高網站成功率的簡單技巧。 總之，在創建鏈接和 CTA 時您需要記住的是：

• 清晰度。 確保您的 CTA 從頁面上的任何其他內容中脫穎而出，尤其是當其他鏈接和按鈕可能會引起混淆時。 您應該能夠立即區分真假。

• 風格。 人們被明亮的大按鈕所吸引，而我們被吸引我們注意力的大文本字段所吸引。 用戶識別鏈接或按鈕所需的努力越少，他或她點擊它們的可能性就越大。 這適用於較小的、不太重要的鏈接——您永遠不想丟失文本或圖像中的鏈接，因此就如何設計鏈接和 CTA 設置嚴格的指導方針。 使用粗體、不同顏色或其他東西來突出顯示和區分您的可點擊和不可點擊。 只要確保它們被一致地使用。 同樣，除非您有充分的理由，否則請確保您的所有圖像都沒有包含這些元素。

• 位置，位置，位置。 您放置鏈接和 CTA 的位置很重要。 如果您非常有價值和重要的“立即購買”鏈接沒有顯示在某人的首屏上方，那麼客戶點擊它的可能性不到 50%，因為只有不到 50% 的用戶會向下滾動到這裡。

我希望這個建議有幫助！ 不要忘記總是四處搜索，看看其他人正在做什麼來解決這個問題，並將他們的網站與您的網站進行比較，看看您的網站在哪里以及如何進一步改進。