最佳登陸頁面:50 個示例

已發表: 2021-07-13

在本文中,我將討論從一般最佳實踐到獨特功能的優秀著陸頁的要素

最佳著陸頁示例

你會學到什麼:

  • 著陸頁最佳做法:
    • 7秒測試
    • 高分辨率圖像
    • 號召性用語
    • 利用折疊下方的空間
  • 本地登陸頁面
    • GMB 至關重要
    • 顧客評論
    • 本地 CTA
    • 位置圖
  • 電子商務登陸頁面
    • 產品規格
    • 高分辨率產品圖片
    • 回答提問
    • 相關博客和文章
    • 相關產品促銷
    • 用戶評論
    • 推廣忠誠度計劃
  • 使用博客文章轉換流量
    • 包括側邊欄
    • 促進鉛磁鐵
    • 相關文章鏈接
    • 突出資源

著陸頁最佳實踐:什麼才是好的著陸頁?

著陸頁可以採用多種不同的形式,用於宣傳從消費品到 B2B 電子書、本地商店和訂閱服務的所有內容。

然而,雖然著陸頁有很多變化,但有一些最佳實踐可以保持一致。

例如,一個好的登陸頁面總是從一個引人注目的標題、一些支持性的副本和一個強化“詢問”的設計開始。 號召性用語 (CTA) 應始終脫穎而出。

著陸頁基礎知識

它必須通過 7 秒測試

七秒測試是評估登錄頁面功能的快速過程。 這個想法很簡單; 當訪問者到達著陸頁時,他們應該能夠在 7 秒或更短的時間內回答以下問題:

  • 這是什麼網站呢?
  • 我應該做些什麼?
  • 核心價值主張是什麼?
  • 這是我可以信賴的品牌嗎?
  • 我為什麼要在乎?

從本質上講,你需要能夠解釋你是誰,你解決了什麼問題,以及你與競爭對手的不同之處。

請記住,這裡少即是多。 人們為了解您提供的產品而需要做的思考越少越好。

1.購物

shopify登陸頁面

Shopify 的登陸頁面一直都很好,這個也不例外。 標題立即告訴訪問者他們的全部內容,通過承認他們龐大的客戶群來建立信任,並用高分辨率圖像支持它,展示他們的移動響應網站主題。

用戶可以輕鬆掌握預期內容,他們只需輸入電子郵件即可開始使用。

另外,如果您有任何猶豫,細則會聲明他們提供 14 天的試用期,並且在您確定要承諾之前不會要求您提供信用卡。

2. 對講機

對講登陸頁面

Intercom 的登錄頁面也能在幾秒鐘內切入正題——它們提供旨在提供積極客戶體驗的聊天機器人。

標題不是很清楚,但與超直接子標題和右側的示例交互配對 - 毫無疑問該產品應該做什麼以及它如何使網站所有者受益。

而且,正如我們在 Shopify 中看到的那樣,Intercom 還使開始試用變得非常容易。

3. 指南

指南著陸頁

來源

在這個例子中,Guideline 使用空格和簡單的好處來宣傳它的 401k 程序。 表格很短,不會讓用戶提供不必要的信息,而且所有的副本都超級清晰。

高分辨率圖像

無論您銷售什麼產品,所有著陸頁都依賴於高質量的視覺效果,讓消費者採取下一步行動。

圖片不僅可以幫助您在 7 秒的時間範圍內傳達您的觀點,還可以幫助用戶與您的品牌建立聯繫。

4. 黑色禮服

blktux 登陸頁面

在這裡,BLK TUX 通過幾乎完全專注於圖像來銷售他們的服務來推廣他們的禮服租賃服務。 這些活動針對的是現代消費者,他們通常會將晚禮服租賃與舞會聯繫起來。 這些在傳達訪客情緒方面做得很好——只要他們瞄準了正確的受眾,就可以推動他們想要的行動。

5. ZenDesk

Zendesk 登陸頁面

Zendesk 的圖像只佔著陸頁的一小部分,留出更多的白色(或藍色)空間供觀眾評估副本並決定是否要採取行動。

留白與藍白配色相結合,有一種鎮定的效果——這表明這種解決方案將為觀眾的痛點提供一個簡單的答案。

6. 波美洛

Pomerleau 登陸頁面

另一個使用圖像優先方法的例子,Pomerleau 使用照片中的線條將觀看者的眼睛引導到 CTA。

CTA

理想情況下,您的 CTA 應該充當訪問者成為客戶或潛在客戶的點。

CTA 應始終放在折疊上方,並提出明確的下一步。

無論是關注社交渠道、選擇訂閱時事通訊還是進行購買,您都需要確保您的 CTA 準確地告訴您的讀者該做什麼。

這裡有一些例子:

7. 鬆弛

鬆弛著陸頁

Slack 的 CTA 大膽而醒目,因為那小小的流行色將視線從右側的圖形中拉回來。 “詢問”很簡單,您可以“免費試用”以換取分享您的電子郵件。

8. 帆布

帆布登陸頁面

Canva 為用戶提供了使用 Google 或 Facebook 登錄的選項,從而消除了註冊過程中的摩擦。 這使它們能夠更快地啟動和運行,刪除額外的步驟(以及需要創建新密碼的步驟)。

9. 轉換實驗室

轉換實驗室登陸頁面

轉換實驗室讓事情變得簡單,藍色背景、白色邊框和最少的副本——這使得橙色按鈕非常流行。 標題立即獲得好處——登陸頁面的轉化率更高——並將“獲得登陸頁面幫助”按鈕貼在價值道具的正下方。

10. 得到回應

獲取響應登陸頁面

然後是 GetResponse。 誠然,這不是我最喜歡的設計,但它們在這裡做得非常好。

綠色按鈕在黑色和灰色背景下非常醒目,而箭頭將注意力重新集中在採取行動上,如果眼球滾落到一邊。

此外,該品牌在消除與註冊相關的風險方面做得很好——30 天免費試用,無需信用卡。 他們相信用戶會看到價值並決定長期堅持下去。

為您的報價提供理由

在幕後,您正在轉換一些齒輪並與可能處於決策過程早期階段的人交談。 雖然這個群體可能與那些在抵達時採取行動的人有著相同的目標和痛點,但他們可能需要更多信息。

雖然與頁面頂部相比,您在設計和復制方面具有更大的靈活性,但您可以將一些基本元素添加到任何頁面,以便在訪問者滾動以了解更多信息時與他們建立信任。

推薦、評論、功能、行業獎項、媒體提及和常見問題解答都可以在這裡提供幫助。 讓我們看幾個不同品牌的例子:

11. 大師班

大師班登陸頁面

雖然 Masterclass 在此頁面上做了很多工作,但頁面上的元素可以很好地協同工作。 該頁面以明確定義的價值主張和視頻引導,有助於建立用戶期望的感覺。

當您向下移動頁面時,您可以查看示例課程計劃、閱讀評論和推薦,以及查看相關課程。

12. 代碼學院

代碼學院登陸頁面

CodeAcademy 的這個登陸頁面讓事情變得非常簡單。 雖然他們已經立即切入了核心價值支柱,但潛在客戶在註冊之前可能需要更多詳細信息。

在這裡,該品牌使用視頻推薦來強調該解決方案的價值。

13. 彈跳

跳出著陸頁

Unbounce 的這個例子通過突出顯示一長串媒體提及來建立可信度。 如果您曾出現在任何知名出版物中,添加這些圖標可為您的受眾提供一個快速的視覺提示,即您的品牌是合法的。

14. 網絡利潤

網絡利潤登陸頁面

WebProfits 以稍微不同的方式建立信譽。 他們將副本保持在最低限度,專注於核心利益,推動增長。 想更多地了解他們如何獲得結果? 下一節將用幾個簡短的段落解釋他們的過程,讓訪問者更好地了解他們已經找到了問題的解決方案。

15. Munchery

munchcherry 登陸頁面

Munchery 的登錄頁面使用品牌 TrustPilot 帳戶中的客戶評分來建立信任,從而為他們的服務提供支持。

社交證明的附加元素,再加上頁面引人注目的圖片、簡單的註冊和 20 美元的折扣,為讀者提供了很多理由來嘗試這個品牌。

本地登陸頁面

本地登陸頁面與傳統登陸頁面有很多共同之處。 您仍然需要考慮七秒測試,包括社會證明,並確保您的標題、文案和圖片對您的目標受眾有吸引力。

也就是說,有一些設計本地頁面的獨特之處,我將在這裡快速介紹。

本地架構和優化的 Google 我的商家頁面至關重要

在執行任何其他操作之前,您需要確保您的“Google 我的商家”資料完整且包含準確的商家信息。

設置 GMB 頁面後,您需要將本地架構應用於頁面,以便為搜索引擎提供有關此位置的更多信息,例如姓名、地址、營業時間、服務等。

結合 Yelp、TripAdvisor、Facebook 等網站上的第三方列表,本地搜索者可以在不離開 SERP 的情況下找到他們需要的一切。

顧客評論

對於本地企業來說,評論就是一切。 不相信我? 考慮一下您在沒有評論的餐廳用餐的可能性有多大? 如果不了解其他患者的經驗,就去看新牙醫會怎樣?

評論和星級評分可以包含在您的著陸頁上,並使用結構化數據進行標記。 這裡的好處是,只要有人輸入相關的本地查詢,這些評級就會顯示在 SERP 中。

16. Carisma 餐廳

carisma 餐廳登陸頁面

來源

在此示例中,Carisma Restaurant 將來自多個平台的評論聚合到一個登錄頁面中。 外賣 - 無論平台如何,人們都非常喜歡這個地方。 意思是,可以肯定的是,食物很好吃。

本地 CTA

本地登陸頁面 CTA 通常使用比其他類型登陸頁面更通用的語言——想想“獲取路線”或“電話”。

在這裡,首要任務是讓移動用戶盡可能輕鬆地聯繫或訪問您的企業。

17. 耶魯電器

耶魯電器登陸頁面

Yale 設備允許用戶通過一系列簡單的指令來安排參觀展廳——選擇約會類型、時間、地點,僅此而已。

18. 布萊頓種植診所

布萊頓影響診所登陸頁面

Brighton Implant Clinic 使用本地廣告來增加流量,以向新患者宣傳特別優惠。 雖然該優惠適用於所有地點,但訪客可以通過選中該框來指明他們想要預約的地點。

位置圖

本地排名由三個關鍵因素決定 - 顯著性、鄰近性和相關性,這意味著 Google 地圖、您的 Google 我的商家資料和本地架構共同幫助您的受眾找到您的商家,並獲得他們可以信任的一些保證你。

19. 宗教學

Pieology 登陸頁面

來源

Pielogy 將流量從其本地 SERP 列表引導到帶有嵌入式地圖的特定位置頁面。 這告訴用戶他們在正確的地方,然後可以通過下訂單採取行動。

20. Hy's Steakhouse

Hy's Steakhouse 登陸頁面

Hy's Steakhouse 遵循類似的原則,只是這次 CTA 會引導訪客進行預訂或查看菜單。

電子商務登陸頁面的最佳實踐

產品頁面需要與本地或以潛在客戶為中心的登錄頁面略有不同的方法。 您需要包含更多細節——考慮規格、尺寸和社會證明,同時更加強調視覺效果。

以下是一些需要重點關注的關鍵領域:

包括每個產品的規格

21. 離開

離開登陸頁面

Away 提供詳細的產品規格,以及單擊“我應該得到哪個”的選項,以比較不同尺寸和样式。

22. 重磅炸彈

轟炸登陸頁面

Bombfell 提供訂閱服務,允許顧客試穿衣服並退回他們沒有保留的東西。

雖然這種模式已被多個品牌(​​最著名的是 StitchFix)所接受,但它並不像以“傳統”方式購買產品那麼簡單。

這個登陸頁面的好處在於,它以某人打開盒子的圖像開頭,宣布您將“只為您保留的東西付費”,然後開始對服務的運作方式進行簡單的細分。

在折疊上方,圖像和副線很好地配合,立即激發了遊客的興趣。

也就是說,我希望看到一個更具描述性的標題來真正推動這個價值支柱回家。

23. 偉人

偉大的登陸頁面

運動鞋品牌 Greats 使用他們的登陸頁面來幫助客戶了解在購買豪華運動鞋時要尋找什麼。

該頁面以一些一般性優勢開頭,然後突出顯示展示所用材料質量的特定功能。

24. 巔峰設計

巔峰設計登陸頁面

雖然可以分解產品描述以獲得更好的視覺體驗,但 Peak Design 包括多個產品照片、視頻鏈接、比較圖表,甚至在頁面頂部的媒體提及。

高分辨率產品照片和視頻

雖然高分辨率照片是任何登陸頁面的重要組成部分,但它們是您銷售服裝、家居裝飾或其他消費品時的主要焦點。

您需要包含多張圖片,讓用戶可以清楚地了解該產品的外觀。 這將有助於確保客戶滿意度(您已達到預期)並降低退貨的可能性。

25. 俏皮話

Quip 登陸頁面

26.尼康

尼康登陸頁面

尼康帶領觀眾參觀產品,以比典型規格表更具吸引力的方式展示主要功能和優勢。

當您銷售具有多項技術功能的複雜產品時,這尤其有用。 營銷人員可以專注於向觀眾展示,而不是告訴他們產品可以做什麼。

27. 全鳥

Allbirds 登陸頁面 Allbirds 使用視頻來展示運動中的產品,讓用戶更好地了解鞋子的外觀。

28. 寓言

寓言登陸頁面

Fabletics 以稍微不同的方式使用視頻——展示不同的產品來推廣其緊身褲訂閱服務。

29. 土著聯盟

Native Union 登陸頁面

來源

Native Union 提供了一種更“DIY”的方法,但值得注意的是,這是一種向消費者展示產品如何特別適合他們現有習慣的有效方式。

在頁面上回答問題

30. 每日收穫

每日收穫登陸頁面

Daily Harvest 的登錄頁面解決了消費者可能對其產品提出的問題。 該頁麵包含幾個可擴展的部分,涵蓋成分、營養信息和說明。

相關博客和文章

31. 柯達

柯達登陸頁面

柯達的產品頁面通過鏈接到與產品相關的幾個視頻演練提供了更多信息。 這不僅讓用戶更好地了解這款相機的功能,還鼓勵訪問者觀看該品牌提供的其他視頻。

推廣相關產品

您在這裡要做的另一件事是推廣相關產品,以鼓勵訪問者瀏覽您的網站並進行購買。

幾個例子:

32.REI

REI登陸頁面

33. 布魯克林

布魯克林登陸頁面

34. Made.com

made.com 登陸頁面

35. 阿索斯

Asos登陸頁面

用戶評論

用戶評論對於任何登陸頁面都是必不可少的,但是,

36. Consulting.com

Consulting.com 登陸頁面

Consulting.com 超越了典型的書面評論,並以過去客戶的視頻推薦為特色,以展示其服務的價值。 這樣做的好處是,訪問者可以聽到真實客戶用他們自己的話解釋主要好處,這會立即在新人之間建立信任感。

37. 兩葉

TwoLeaves 登陸頁面

38. 埃塞爾烘焙公司

Ethels Baking Co. 登陸頁面

39. 光澤度

更有光澤的登陸頁面

Glossier 的產品頁面通過並排顯示最受歡迎的正面和負面評論來建立信任,並允許用戶應用年齡、皮膚類型和膚色等過濾器,以了解有關該品牌產品可能如何為他們服務的更多信息。

推廣您的忠誠度計劃

產生潛在客戶的一個好方法是為用戶提供一些福利以換取訪問者的電子郵件地址。

40. Urban Outfitters

Urban Outfitters 登陸頁面

如何使用博客文章轉換更多流量

博客文章與我瀏覽過的其他類別略有不同。 核心重點是提供信息,而不是推動轉化。

也就是說,未能包括讓客戶朝著下一步前進的機會就是錯失的機會。

您需要以一種鼓勵用戶進一步瀏覽您的網站、註冊新聞通訊或下載資源的方式來組織您的帖子。 這裡有一些想法

博客應包含側邊欄

在您的博客中添加側邊欄可以確保所有訪問者都能收到有關您品牌的一些信息。 在 Ignite Visibility 博客上,我喜歡將側邊欄視為品牌的“電梯宣傳”。

這樣,即使訪客離開,他們也會留下我們是誰以及我們做什麼的印象。

41. 文案博主

Copyblogger 登陸頁面

來源

Copyblogger 遵循與 Ignite 博客類似的結構,使用側邊欄突出顯示熱門帖子並鼓勵選擇加入電子郵件。

42. 瘋狂蛋

CrazyEgg 登陸頁面

來源

Crazy Egg 使用側邊欄作為推動時事通訊註冊的機會。

推廣鉛磁鐵

從您的博客中生成潛在客戶的最佳方法之一是推廣一種需要讀者輸入電子郵件才能訪問的資源。

一般來說,你的磁鐵應該與博客文章中的內容相關。 例如,如果您的博客文章是關於設計登錄頁面的,您可以使用 100 個免費登錄頁面模板來宣傳下載。

請記住,下載需要對您的讀者有價值,與他們在購買者旅程中的位置相關,並提供某種類型的“速贏”。

43. 甲骨文

Oracle 登陸頁面

Oracle 的登錄頁面是一個可靠的下載示例,您可能會在此過程中向買家提供下載。

此下載提供了更深入的了解,消除了營銷自動化的常見神話——如果他們正在積極研究解決方案,人們可能想知道這一點。

這種類型的內容在早期效果不佳,因為新手可能會試圖弄清楚營銷自動化到底是什麼。

44. 諾托

登陸頁面

另一個有力的例子來自 Nauto。 此頁面設計精良,在 CTA 上方帶有“書”的圖像。

他們很好地解釋了讀者將學到的內容,並且通過將表單字段保持在最低限度,使下載此資源變得容易。

此外,社交分享按鈕允許用戶一鍵與他們的網絡分享此資源,進一步增加頁面的潛在客戶。

45. 漂移

漂移著陸頁

Drift 通過在每個頁面上嵌入聊天機器人,採用完全不同的方法來生成潛在客戶。 當訪問者閱讀網站內容時,Driftbot 始終可以引導用戶實現正確的目標。

內置聊天機器人從用戶那裡收集信息,這些信息以後可以用於未來的營銷活動,同時消除了依賴表單帶來的一些摩擦。

鏈接到相關文章和熱門類別

在每篇博文的底部包含相關文章可以鼓勵讀者在您的網站上花費更多時間,同時也鼓勵用戶點擊內部鏈接,這可以提高您網站的可用性。

另一個技巧是鏈接到頂級類別,因為它有助於改善內部鏈接,並使讀者更容易找到相關內容。

46. 活動監視器

活動監視器登陸頁面

來源

47. Hubspot

Hubspot 登陸頁面

來源

Hubspot 的想法相同,儘管他們使用了不同的設計。 這個例子的好處是,標題是粗體和清晰的,每篇文章都帶有描述,告訴用戶點擊後他們會找到什麼。

48. 庫諾創意

Kuno 創意登陸頁面

Kuno Creative 遵循與 Hubspot 類似的方法,但是,它們使訪問者可以輕鬆地按類別對內容進行排序。

突出其他有價值的資源

除了突出顯示相關文章之外,我還喜歡在 Ignite 網站上做的另一件事是推薦其他有價值的資源,例如您的視頻庫、播客或專注於特定主題的內容集。

這是將流量吸引到網站其他部分的另一個機會,同時幫助您將自己確立為受眾的首選來源。

49.石蕊

石蕊登陸頁面

Litmus 在這裡做了一些有趣的事情。 他們的登陸頁面旨在通過證明他們會向您的收件箱提供有價值的信息以及指向以前的時事通訊的鏈接來吸引時事通訊訂閱者。

50. 社交媒體審查員

社交媒體審查員登陸頁面

來源

您可能在此處使用的另一種方法是將博客讀者定向到資源庫。 此示例使用圖形元素來確保每個指南都能脫穎而出,讓用戶可以找到他們最感興趣的資源。