見逃せない20のランディングページの例

ランディングページは、ユーザーが検索結果、オンライン広告、Webサイト上のリンク、ソーシャルメディア、または電子メールキャンペーンをクリックしてアクセスするWebページです。 最適なランディングページを設計するのに役立つように、さまざまな企業の20のランディングページの例を示します。

ランディングページは、特定のまたは単一のコンバージョン目標のために、1つのビジネス目標を念頭に置いて作成されています。 たとえば、公開した電子書籍の見込み客を獲得するためのランディングページを作成する場合、主な目標は訪問者にフォームへの記入を促すことであり、電子書籍のダウンロードは彼らのひたむきな目的にすぎません。 さらに、ナビゲーションオプションを削除すると、ユーザーの注意をそらさずにコンバージョンを増やし、放棄率を最小限に抑えることができます。

1. Google Cloud Platform

上記で使用されているGoogleCloudPlatformのランディングページタイプは、ユーザーに無料でサービスを試すように求めるクリックスルーページです。

彼らが素晴らしいことをしたのは次のとおりです。

• 青い色は快適さと信頼を伝えます。
• 見出しは短く、要点を述べ、行動を呼びかけています。
• 「60日間の無料トライアル」というオファーは魅力的です。
• サブヘッドラインは明確なメリットを伝え、訪問者がプラットフォームを使用した場合に何を受け取るかを示します。
• アイテムが目盛り付きでリストされる方法は、聴衆にツールを試すように促します。
• 緑色のCTAボタンはページ上で目立ち、「無料」という単語が含まれています。これは、主に見出しに記載されている内容を視聴者に確認するものでもあります。
• Angry Birdsゲームの人気と成功を活用して、メーカーからの推薦状を掲載することで、会社の信頼性を高めています。
• ユーザーがまだ試してみる準備ができていない場合は、営業担当者に連絡するか、よくある質問を確認するオプションがあります。

2. Airbnb

Airbnbのページは、見込み客にホストになるよう依頼することを主な目的としたランディングページとしてのホームページです。

以下は、強調する価値のあるポイントです。

• 見出しには、明確で有望な最終的なメリットが含まれています。
• 女性が笑っている様子を示す画像は、受け入れと最終的な利益の視覚的表現を作成します。
• 赤のCTAボタンはページ内で目立ち、ユーザーにコンバージョンを促します。
• ユーザーの地理的位置に合わせてページタイトルをパーソナライズするための条件付き書式。
• ユーザーの入力に基づいて動的な利益計算機を使用してカスタマイズされたエクスペリエンス。

3. Shopify

Shopifyのランディングページタイプはリードキャプチャページであり、その主な目的は、14日間のトライアルの恩恵を受けるためにユーザーに電子メールを入力するように求めることです。

このページに適用されたグッドプラクティスは次のとおりです。

• モダンな紫と白の色は、視聴者の目に快適です。
• ユーザーが大きなCTAボタンを使用して入力できるフィールドは1つだけです。これにより、ユーザーエクスペリエンスが向上し、コンバージョン率が向上します。
• 行動を促すフレーズはほんの一言であり、明確なメリットを伝えています。
• 「世界中の400000以上の企業から信頼されている」という小見出しの社会的証明は、会社の信頼性を強調しています。
• この画像は、例を通して最終製品と複数のデバイスでの応答性を示しています。
• サブスクリプション後にリスクがないことを保証することで、ユーザーの変換に対する自信が高まります。
• 製品の利点は、役立つアイコン、関連するタイトル、短く説明的な段落で明確に強調されています。

このページでは、ロゴがホームページにハイパーリンクされている場合を除いて、考慮すべき重大な問題はないと考えています。これにより、訪問者の逃げ道として機能する可能性があります。

4. WebProfits

Webprofitsランディングページは、ターゲットオーディエンスに製品とそのために何ができるかを教育するインフォマーシャルページです。

以下は彼らが行った良い戦術です：

• このページには、Webサイトの原色が含まれており、折り目の上の曲線の下部が訪問者の注意を引き付けます。
• 同じ方向を笑顔で見ている人のイメージは、サービスを利用すれば良い結果が得られるという印象をユーザーに与えてくれます。
• 暗くした画像は、ターゲットオーディエンスを反映しており、見出しを反映しながら、ビジネス環境に関連しています。
• 「成長への包括的なアプローチを取る」という見出しは、ターゲットオーディエンスにアピールする価値提案を提供します。
• 質問文の使用は、興味をそそり、読み続けるためにユーザーを会話に引き込むための賢い方法です。
• ラップトップの画像は、動作中のプラットフォームを示しています。
• 赤いCTAボタンは、背景の他の要素から目立ちます。
• 最初のCTAボタン「TELLMEMORE」は好奇心を刺激し、ユーザーが下にスクロールしてコンテンツを読むように促します。
• 最初のボタンの一人称代名詞「ME」は、ユーザーの意図を刺激し、ユーザーの視点から話すことでユーザーを巻き込みます。
• 2番目のCTAボタン「LET'STALK」は、プロセスをはるかに簡単にするために、チャットを介してスタッフに連絡するようにユーザーに求めます。 このボタンは短く、アクション駆動型であり、ユーザーのみを参照する最初のCTAとは異なり、「私」と「あなた」を含む「私たち」のために双方向通信をマークします。

このページで再検討する必要があるのは、「成長への包括的なアプローチを取る」という見出しのフォントサイズを大きくすることだけです。

5.モズ

Mozによるこのランディングページはクリックスルーページであり、その主な目的は、ユーザーを30日間の試用版にサインアップするようにリダイレクトすることです。

彼らが大いに行ったことは次のとおりです。

• 色とテーマは、ブランディングの一貫性を反映したWebサイトと同じです。
• 見出しの左側の画像は、実際のソフトウェアを視覚的に表したものです。
• バリュープロポジションはスマートな方法で提示されます。 Mozは、支払いを依頼する前に、まずユーザーの信頼を獲得したいと考えています。
• 黄色のCTAボタンとそのコピーがページ上で目立ちます。 最初の代名詞「My」は、ユーザーが意思決定をより選択的に行うことを示しています。
• 「35000人以上の顧客がMozを使用している」という裏付けとなる証拠要素と、このページに示されている有名なブランドは、信頼性を強調しています。
• 機能は単純化されており、通常見られるものとは異なる独自のアイコンで視覚的に表現されています。

6.どんぐり

どんぐりのランディングページは、ユーザーにサービスの使用を開始するように求めるクリックスルーページのもう1つの例です。

彼らがうまくやったことは次のとおりです。

• 見出しは、行動の呼びかけ、最終的な利益、および切迫感を伝えます。
• 小見出しは、聴衆が何を得るかを短い文章で述べることによって、価値提案を示しています。
• 緑のCTAボタンは、ページ上の他の色と互換性があり、行動の呼びかけと切迫感が含まれています。
• この画像は製品の表現を示しており、モバイル対応であることを示しています。
• 画像に掲載されている例は、訪問者の注意と関心を引く多数を示しています。

ただし、ページの右上にナビゲーションオプションをドロップしている、再検討できる領域があります。

7.アップワーク

上記のUpworkのページのタイプは、見込み客に適切なフリーランサーを見つけてもらうことを主な目的とするランディングページとしてのホームページです。 以下は、リストする価値のあるポイントです。

• 見出し、CTA、マグカップ、コピーブック、ペーパークリップの色はロゴと同じであり、ブランドの一貫性を示しています。
• ランディングページのコンテンツとその背景画像は、調和のとれた方法で提示された一致する色で紹介されています。
• 最初の画像のCTAボタン「PostYourJob」がページ上で目立ちます。
• コピーは、最終的なメリットを含めることにより、特定のターゲットオーディエンスを対象としています。
• スティッキーヘッダーのCTAボタン「BecomeaFreelancer」は、このページに誤ってアクセスして離れないようにする可能性のあるフリーランサーにパスを提供します。

8. UBER

UBERのランディングページは、ユーザーにドライバーになるように求めるリードキャプチャページです。

彼らが適用した効果的な実践は次のとおりです。

• 見出しは、ドライバーに明確なメリットを伝えます。
• 白い背景を使用することで、見た目が快適になり、柔軟性が反映されます。
• 「車が必要ですか？」という質問Uberは、スキルはあるがツールを見逃しているユーザーを獲得するのに役立ちます。
• 「RidewithUber」は、ライダーにUBERで乗るためのセグメンテーションオプションを提供します。 これは、誤ってこのページにアクセスした場合に潜在的なライダーセグメントを失わないようにするための優れたナビゲーションオプションです。
• フォームの下のプライバシーポリシーは、会社がページ訪問者のプライバシーを気にかけていることを示しています。
• フォームの下のCTAボタンは、ページ内の他の要素とは一線を画すように見える白いフォントの緑の背景色で使用されます。
• この画像は、ターゲットオーディエンス（ドライバーとライダー）に視覚的なプレゼンテーションを明確に提供し、提供されるサービスのダイナミクスをステージングします。

興味深いことに、制作チーム全体がこの画像のいくつかの要素に対処しようとしました。

• ドライバーの笑顔は、見込み客がUberと一緒に仕事をすることに満足していることを示しています。
• シートベルトを着用している運転手は、UBERが法を遵守する会社であり、安全運転とセキュリティ対策を奨励していることを示しています。
• 車の後ろの角に座っている乗客は、サービスのコンテキストを設定します。
• 助手席が後ろでぼやけている様子は、ドライバーの役割を強調し、このランディングページのヒーローとしてのドライバーに焦点を当てる優れた制作手法です。
• 運転手は45歳以上のようで、彼の民族性はやや中立的です。 これにより、UBERは誰でもドライバーになることができることを示すことができます。

9.ペイパル

上記のPaypalのページタイプは、主にユーザーにアプリをダウンロードして使用するように求めるランディングページとしてのホームページです。

彼らがうまくやったことは次のとおりです。

• 濃い青色のCTAボタンと、選択すると明るい色で表示される下の列の機能は、関連性のある強力なブランディングを示します。
• グレーの色は現代性とハイテクを映し出しています。
• 見出しと小見出しはシンプルで、最終的なメリットがあります。
• ビデオには、訪問者が知っておく必要のあるすべての詳細と技術が含まれており、ページを利用してサービスについて詳しく知るように促しています。 また、説明を多く含めることなく、ページをシンプルにします。
• メインのCTAボタン「GetPayPalHere」はページ上で目立ち、「どこでも支払いを受ける」という見出しの主張をサポートします。
• この画像は、動作中のアプリを示しています。
• カードリーダーは、訪問者がモバイルデバイスを使用してクレジットカードをスワイプする方法を示します。 この画像は、見出しの「どこでも」の主張を証明し、PayPalからのこの特定のサービスのモビリティをサポートしています。
• 機能は単純化されており、通常見られるものとは異なる独自のアイコンで視覚的に表現されています。
• ヘッダーで使用されているものと同じフッターの灰色は、同様のランディングページを作成します。

10.ストライプ

Stripeのページタイプは、訪問者にアカウントの作成を依頼することを主な目的とするランディングページとしてのホームページです。

以下は彼らが行ったグッドプラクティスです：

• 同社は、訪問者に彼らが立ち上げた新機能を知らせることから始めます。 これにより、彼らは自分たちの製品に取り組み、さまざまなオプションで変換するようになります。 「新しい」という言葉は小さいですが、強調表示されています。
• 見出しは大きなフォントで強調表示され、「新規」は、会社がターゲットオーディエンスの関心を満たす変化するトレンドに定期的に対応していることを示します。
• 小見出しは、会社が何であるかを明確に説明しています。
• CTAボタンはページ上で目立ち、色を合わせるために使用されます。

右側の画像は、次のことを販売者に明らかにすることで、訪問者の注意を引き付けます。

• 同社は有名なeコマースソフトウェアと統合しています。
• 顧客は、Stripeからクレジットカードを受け入れながら、Shopifyを使用してオンラインストアを作成できます。

再訪する必要があるのは、訪問者をページから引き離す可能性があるため、テキストの下にある2番目のCTAボタン「ContactSales」を削除することだけです。

11. LinkedIn

LinkedInのランディングページは、チャンネルのインメールサービスを使用してターゲットオーディエンスと交流するようユーザーに求めるリードキャプチャページです。

彼らがうまくやったことは次のとおりです。

• 「洗練された」と「最初の」という言葉は、ターゲットオーディエンスのエゴで演奏し、独占感を駆り立てます。
• ページの色はLinkedInのロゴとよく合います。
• 画像は、提供されているサービスを明確に示しています。
• 説明は、訪問者がサービスを使用した場合に得られるメリットとともに、ページの内容を示しています。
• フォームの上にある召喚状の見出しは、見込み客がフォームに記入する必要がある理由を明確に示しています。
• フォームの下にある3つのオプションは、ターゲットオーディエンスのニーズに対応し、コンバージョンを促進します。

ただし、リードキャプチャフォームを短くしてより多くの読者にフォームへの入力を促したり、混乱を避けるためにフォームの下にCTAボタンを配置したりするなど、いくつかの要素を再確認する必要があります。 また、テキストを減らすことができます。

12. GEICO

GEICOのランディングページは、郵便番号を提供するだけでなく、無料の保険見積もりを取得するようにユーザーに求めるリードキャプチャページです。

言及する価値のあるポイントは次のとおりです。

• 見出しとビジュアルが支配的であり、すぐにユーザーの注意を引き付けます。
• 見出しは好奇心を生み出します。
• リードキャプチャフォームには、入力するフィールドが1つしかないため、コンバージョン率が向上します。
• CTAボタン「見積もりの​​開始」は、オファーに合わせて特別に調整されています。
• ヘッダーまたはフッターにナビゲーションオプションはありません。

このページで再検討する必要があるのは、実際のメリットを示していない見出しだけです。 また、「Enter Zip」フィールド内のプレースホルダーテキストは、クリック可能なボタンと混同しないように、明るい灰色にする必要があります。

13.ジェフ・ブラス

Jeff Bullasによって作成されたこのランディングページは、訪問者に彼の電子ブックをダウンロードするように求めるクリックスルーランディングページです。

以下は、彼がこのページで実行することに成功したグッドプラクティスです。

• 電子ブックカバーの似顔絵スタイルは、訪問者の注目を集めます。
• 見出しは明確な利点を提供し、「無料」で始まり、ユーザーが電子書籍を入手するように促すために別の色で強調表示されます。
• 小見出しは、わずか「4時間」で「4年」と長い時間を要したことを学ぶことができ、ターゲットオーディエンスがコンバージョンを促進することを示しています。
• CTAボタンには、さまざまな要素が含まれています。「ここをクリック」は行動の呼びかけを示し、「取得するには」はメリットを強調し、「今すぐ」は即時性を示します。
• ナビゲーション要素がない。

それにもかかわらず、このページで再検討できることはほとんどありません。 まず、紹介文はJeffBullasによって作成されました。 信頼性を高め、ページにより多くの価値を追加する、ユーザーまたはインフルエンサーによって書かれた社会的証明を紹介する方がよいでしょう。 または、引用符で囲まずに、上記の小見出しが何であるかを明確にする方法で直接記述することもできます。 次に、CTAボタンを折り目の上に配置できます。

14. Fabletics

Fableticsのランディングページタイプは、オンライン買い物客に服を購入するように求めるクリックスルーページです。

彼らがうまくやったことは次のとおりです。

• 赤い見出し「FashionThatPerforms」がページ上で目立ち、訪問者の注目を集めています。
• 価格は透明性を示しており、VIPメンバーになると約31ドル節約できることを示しています。
• CTAボタンの赤い色は、見出しの色と同じです。
• 追加のナビゲーション要素がないため、コンバージョン率が向上します。
• すでにアカウントを作成しているユーザーが同じページからサインインするためのオプションがあります。 これにより、このページに誤ってアクセスした他のターゲットオーディエンスを失うことを回避できます。

フォントスタイルを統一したり、訪問者が読みやすくするために見出し、コピー、CTAボタンの間隔を広げたりするなど、再検討する必要のあることがいくつかあります。 赤いCTAボタンの下にあるリンクは、本来あるべきよりも太字であり、訪問者を主な目的である「はじめに」からそらす可能性があります。

15.オリビ

Oribiのランディングページは、Facebookにはない高度な分析にアクセスするためにユーザーにサインインするように求めるクリックスルーページです。

以下は、彼らがページに実装した成功したポイントです。

• 見出しは彼らが提供するものを明確に説明し、SEO、コピーライティング、そして彼らのブランディングに有益なキーワード「FacebookAds」を含みます。
• この画像は、サービスが動作していることを示しており、ユーザーに最適な適切な時間をアドバイスすることでユーザーの注意を引き付けます。 また、ユーザーフレンドリーでスマートな手書きの方法で表示されます。
• シンプルさと間隔により、ページは見やすくなっています。

再検討する必要がある主な考慮事項は、「無料」という単語をより大きなフォントサイズで表示して、見やすくすることです。 また、ページの右上にある「About us」と「Blog」のCTAを削除すると、ユーザーのナビゲーションが回避されます。

16.アーバンエアシップ

アーバンエアシップのページは、リードキャプチャのランディングページです。 このページの主な目的は、対象読者をウェビナーに登録するように招待することです。

彼らがうまくやったことは次のとおりです。

• 見出しは明らかな利点を提供します。
• 太字で強調表示されている小見出しは、訪問者がすぐに出席する時間がない場合に備えて、レコーディングを取得するために登録できることを訪問者に通知します。
• このコンテンツは、登録の利点を明確に詳しく説明し、ユーザーがこのウェビナーから得られるものをリストアップしています
• フォームの上部にあるCTA「今すぐ登録」は、訪問者にサインアップするように促します。

時には、見出しを太くして注目を集める、各スピーカーにヘッドショットを追加する、[今すぐ登録]や[Take me to]などのボタンでより説得力のあるCTAリクエストを使用するなど、再考できる要素はほとんどないと考えています。ウェビナー」、「そしてそれを際立たせるためにその色を変える。

17.ウォークミー

WalkMeのランディングページは、訪問者にサービスを試すように求めるクリックスルーページです。

以下は、彼らが実行した成功事例です。

• 有名なブランド「Salesforce」の存在は、ページにさらに価値を追加します。
• Salesforce CRMの使用は、コピーとSEOの両方に適しています。
• 「R」マークの使用は信頼性を与え、またブランド侵害から彼らを保護します。
• 青で強調表示されている見出しは、訪問者の注意を引き、明確なメリットを伝えます。
• サブヘッドラインは、ヘッドラインで以前に述べられたことを補完し、Salesforceが提供するサービスに関連する洞察に触れます。
• CTAボタンは目立ち、訪問者にコンバージョンを促します。
• ソフトウェアを示す背景画像は、その前の見出しを明確に示すために暗くされています。

再検討する必要があると考える唯一のことは、ロゴとテキスト、およびテキストとCTAボタンの間にスペースを追加することです。

18.マスタークラス

MasterClassは、音楽、絵画、ライティング、料理、その他の芸術など、さまざまな分野のすべてのスキルレベルの学生向けに作成されたさまざまなオンラインクラスを提供しています。

これが私たちが分析した彼らのランディングページの1つです：

このページのタイプは、さまざまな要素を含むランディングページとしてのホームページです。 このページの主な目的は、訪問者に有名なシェフによるビデオを視聴するように促すことです。

以下のポイントはリストする価値があります：

• ビデオは、訪問者にそれを見ることを奨励する有名なシェフのサムネイルを示しています。
• 赤い「ALL-ACCESSPASS」のCTAボタンがページ上で目立ちます。
• 利点は、関連するアイコンで明確に示されます。
• 価格設定「$180/年」は、透明性を示しています。

一方、ページの右下にあるCTAボタンのコピーを変更して、実行可能なリクエストを含めるなど、一部の要素を改善できることがわかります。 第二に、価格設定は小さなフォントサイズで使用されます。 それを大きくすると、自信が浮かび上がります。

19.インクリング

Inklingのランディングページは、訪問者に電子書籍をダウンロードするように求めるリードキャプチャページです。

以下は、適用された効果的な方法です。

• 見出しとコンテンツが連携して、強力な価値提案を作成します。
• 営業チームに連絡を要求するオプションは、高い関心と質の高いリードを獲得するための賢い方法です。
• 青い背景色は、「リモートワーカー」の側面を反映した家庭環境のコンピューターを示しています。 また、見出し、本文、フォームを表示するために暗くなります。
• CTAボタンのオレンジ色は独特に見え、ユーザーをコンバージョンに駆り立てる即時性を示しています。
• 箇条書きを含むセクション全体は、読者がこの電子ブックから何を学ぶかを知るように促します。
• 右側の画像は、電子書籍のトピックを視覚的に表したものです。

ただし、より多くの訪問者を登録するように誘うため、フォームを短くするなど、一部の領域を強化できると考えています。 また、ソーシャルメディアボタンを削除したり、ページの後半に追加したりすることで、ユーザーがフォームに入力する前に特に折り畳み上のセクションでボタンを放棄するのを防ぐことができます。 さらに、訪問者を混乱させないために、最後の2つのドロップダウンフォームフィールドにラベルを付ける必要があります。

20. Microsoft Power BI

Microsoft Power BIのランディングページは、データ分析とビジネスインテリジェンスでキャリアを向上させるためにユーザーに連絡先情報を提供するように求めるリードキャプチャページです。

以下は、彼らが実施した効果的な実践です。

• 見出しは明確な利点を伝えています。
• イントロダクションには、ページの内容についての明確な説明が含まれています。
• 箇条書きの利点は透明性のある方法でリストされており、訪問者がフォームに記入して完全な利点を見つけるための好奇心を生み出します。
• フォームの上のCTAリクエスト「今すぐダウンロード」は簡潔で要領を得ています。
• オレンジ色のCTAボタンは、今すぐサービスをダウンロードする緊急性を高めます。
• 太字の文字は、重要な文にユーザーの注意を引き付けます。
• 左下のフッターのリンクは強調表示されていません。これは、ユーザーを別のページにリダイレクトしないようにするために重要です。

ただし、コピーとフォームは少し長いと思います。 それらを短くすると、コンバージョン率が上がります。

ランディングページは、マーケティングキャンペーンの不可欠な部分です。 それはあなたの他のマーケティングイニシアチブを結びつけ、それらと統合してあなたのカスタマージャーニーの明確でひたむきなポイントとして機能します。

ランディングページの作成方法を知ることは、高いコンバージョン率とキャンペーンの成功を確実にするための鍵です。 この記事で示した例が、アイデアの提供に役立つことを願っています。 ただし、もちろん、目的とニーズに最適な方法でランディングページを作成して調整する必要があります。 最終的には、ランディングページ分析を常に測定して、ビジネスに最適なものを把握し、最良の結果を得るために最適化する必要があります。