ダイナミック・ランディングページとは？（＋WordPressでの作成方法） 

ランディングページが、ユーザーの検索内容に応じて自動的に調整されたらいいなと思ったことはありませんか？

オースティン、ダラス、ヒューストンを対象にGoogle広告を出稿している水道工事業者は、1つのページから、ある訪問者には「オースティンの緊急水道修理」、別の訪問者には「ヒューストンの緊急水道修理」という広告を表示することができます。

このガイドでは、SeedProdを使ってWordPressで動的なランディングページを作成する方法を詳しくご紹介します。

静的ランディングページと動的ランディングページ：その違いとは？

静的ページは、すべての訪問者に同じコンテンツを表示します。動的ページは、閲覧者やそのアクセス経路に応じてコンテンツを切り替えます。

特徴	静的ランディングページ	動的ランディングページ
パーソナライゼーション	すべての訪問者に対して同じコンテンツを表示する	コンテンツは訪問者のデータに基づいて変更されます
スケーリング	オーディエンスセグメントごとに新しいページが必要です	1ページであらゆるセグメントに対応
メンテナンス	更新するページが1つあります	コンテンツが変動する1ページ
SEOに関する考慮事項	重複のリスクがない	デフォルト設定を行わない場合、コンテンツが薄くなるリスクがあります

ほとんどのWordPressサイトにおいて、強力なフォールバック設定を備えた動的ページを採用すれば、数十もの静的バリエーションを管理する手間をかけずに、パーソナライズを実現できます。

動的なランディングページの事例

動的ページがどのように機能するかを理解する最も手っ取り早い方法は、実際の企業がそれらをどのように活用しているかを見ることです。

OptinMonster：広告とランディングページのメッセージの一致

OptinMonsterは、SeedProdのランディングページを活用し、見出しやオファーを有料トラフィックキャンペーンの内容と整合させました。広告で約束した内容とページで提供する内容を一致させることで、顧客獲得単価を47%削減しました。変更したのはメッセージの一致だけでした。

ピーター・ミラー：検索広告における動的キーワード挿入

ピーター・ミラーは、「メンズスポーツシャツ」といったキーワードで検索広告を運用しています。ランディングページの見出しはキーワードと完全に一致しているため、広告をクリックした購入者は、すぐに自分が検索した商品を確認できます。WordStreamは、これを「DKI（キーワード一致）」のシンプルな設定例として紹介しており、訪問者が正しいページにたどり着いたかどうかという疑問を完全に払拭しています。

monday.com：ターゲット層に合わせた見出しの最適化

monday.comは、「スタートアップ向け最高のCRM」という検索クエリをターゲットに、見出しにそのフレーズをそのまま使用したページへ誘導する広告を出稿しています。このページには「チーム」や「エンタープライズ」といった言葉は一切登場せず、スタートアップのみが対象となっています。HawkSEMは、こうした明確な特化こそが、コンバージョン率の高いPPCページと一般的なページを分ける要因であると指摘しています。

WordPressで動的なランディングページを作成する方法

さて、上記のことは一見かなり複雑に聞こえるかもしれない。確かに、検索クエリやGoogle広告のテキスト、その他の要因に基づいて自動的に変化する動的なランディングページを作成するには、専門家の助けを借りる必要があるだろう。

場合によってはそうかもしれない。しかし、もしあなたがWordPressのウェブサイトを持っているなら、動的ページを作成するためのいくつかのソリューションが、そのプロセスを簡単にしてくれる。

WordPressで簡単に動的なランディングページを作成する方法を学ぶには、以下の手順に従ってください。

1.適切なWordPressプラグインを選ぶ

WordPressには、ランディングページのパフォーマンスを向上させる強力なページビルダーが豊富にあります。しかし、動的に挿入されるコンテンツに関しては、SeedProdは最高のソリューションの一つです。

SeedProdは、WordPress向けの最高のドラッグ＆ドロップ式ウェブサイトビルダーです。これを使えば、WordPressサイト向けのあらゆる種類のランディングページを簡単に作成できます。

あらかじめ用意されたレスポンシブ・ランディングページのデザインテンプレートから始め、ビジュアルエディタでカスタマイズすることができます。または、ゼロから作成し、SeedProdsのドラッグアンドドロップコンテンツブロックを使用してページを構築することもできます。

ブロックを使って挿入することができる：

• プレゼント
• お問い合わせフォーム
• ログインフォーム
• 登録フォーム
• ソーシャル・プロフィール
• 画像カルーセル
• 価格表
• グーグルマップ
• カウントダウン・タイマー

...そして、あなたのページにもっとたくさんのことを。

さらに、どの見出しやテキスト要素でも、SeedProdのダイナミックテキストオプションを使用して、個々のユーザーに合わせたページを作成することができます。

そこで、WordPressでダイナミックなランディングページを作りたい場合、SeedProdを使った方法をご紹介します。

2.SeedProdのインストールとアクティベーション

ランディングページを作成するためにSeedProdを選択した後、SeedProdプラグインをインストールして有効化する必要があります。

次に、WordPressウェブサイトにプラグインをアップロードします。この作業で助けが必要な場合は、WordPressプラグインをインストールするためのステップバイステップガイドに従ってください。

SeedProdをインストールすると、ライセンスキーの入力を求めるウェルカムスクリーンが表示されます。ライセンスキーは、SeedProdアカウントにログインし、「ライセンスキー、詳細、およびダウンロードを表示」リンクをクリックすることで確認できます。

キーをコピーし、WordPressサイトのライセンスキーフィールドに貼り付け、Verify Keyボタンをクリックします。

3.ランディングページの作成

次に、ページを下にスクロールし、「最初のページを作成」ボタンをクリックします。

SeedProdのランディングページダッシュボードに移動し、4つの異なるページモードが表示されます：

• 近日公開
• メンテナンス・モード
• 404
• ログイン

SeedProdの各ページモードでは、ワンクリックで特定のランディングページを有効にすることができます。

例えば、カミングスーンモードを有効にして、新しいウェブサイトを紹介するカミングスーンページを追加することができます。また、404ページモードを有効にして、サイトにカスタム404エラーページを追加することもできます。

これの素晴らしいところは、この機能を得るために別のWordPressプラグインをインストールする必要がないことです。SeedProdは、コンパクトな1つのプラグインにすべてを組み込んでいます。

ページモードのセクションの下には、SeedProdで作成した他のページのリストが表示されます。まだ作成していないので、新規ランディングページを作成ボタンをクリックして開始します。

4.ランディングページのテンプレートを選ぶ

新しいランディングページを作成するボタンをクリックすると、SeedProdのランディングページテンプレートが表示されます。

上部のタブをクリックすると、目標や業種ごとにテンプレートを絞り込むことができます：

• 近日公開
• メンテナンス・モード
• 404ページ
• 売上高
• ウェビナー
• リード・スクイーズ
• ありがとう
• ログイン

どのようなテンプレート・デザインでも使用でき、ドラッグ＆ドロップ・エディターで好きなようにカスタマイズできるので、特定のカテゴリーに限定されることはありません。

このガイドでは、「販売」タブにある「自動車販売ページ」を選びます。

テンプレートをインポートするには、テンプレートのサムネイルにマウスカーソルを合わせ、オレンジ色のチェックアイコンをクリックします。

次に、ページの名前とURLを入力するポップアップが表示されます。この設定は後で変更できるので、好きな名前をつけてください。

次に、「保存してページの編集を開始する 」ボタンをクリックして、テンプレートをSeedProdのビジュアルエディタにインポートします。

5.ランディングページをカスタマイズする

テンプレートをインポートした後、ビジュアルドラッグアンドドロップエディタに表示されます。SeedProdのWordPressランディングページビルダーは、シンプルな2パネルレイアウトで構成されています：

1. 左のパネル：ページを構築しカスタマイズするためのページブロックとセクション
2. 右のパネル：ランディングページのデザインをリアルタイムでプレビューできます。

ページへのコンテンツの追加は、左からブロックをドラッグして右の所定の位置にドロップするだけと簡単です。

テンプレートをカスタマイズして変更するには、任意のページ要素をクリックするだけで、左側のパネルにその設定が表示されます。例えば、箇条書きのリスト要素をクリックすると、左側に変更できるオプションが表示されます。

ここでは、箇条書きリストのテキスト、アイコンの色、間隔などを変更できます。また、「詳細設定」タブをクリックすると、フォントやリストレイアウトなどをカスタマイズするためのその他の設定が表示されます。

SeedProdのブロックの大部分は、コードを書かずに簡単にカスタマイズできるように、このような構造になっています。

ランディングページの色、フォント、背景を変更したい場合も、同じように簡単です。歯車のアイコンをクリックするだけで、グローバル設定パネルが表示されます。

そこから各タブを展開すると、グローバルなカスタマイズオプションが表示されます。例えば、「背景」タブをクリックすると、以下のようなさまざまなオプションや背景の変更が表示されます：

• 無地またはグラデーションカラー
• 背景画像
• 背景の幅

ページのフォントや色についても同じことができます。適切なタブを選択し、ボタン、ヘッダー、テキストの色を個別に選択し、ページ上のすべての要素に変更を適用するだけです。

ページが思い通りになるまでカスタマイズを続けましょう。

6.ページに動的コンテンツを追加する

今度は、検索エンジンや広告経由で製品やサービスを探しているユーザー向けにコンテンツをパーソナライズする番だ。

SeedProdは、動的ページを作成する2つの方法を提供します：

1. 日付ベースのダイナミック・テキスト
2. クエリ・パラメータ・ダイナミック・テキスト

日付ベースのダイナミック・テキスト

日付ベースのダイナミックテキストを使うと、ランディングページで日付を動的に作成して表示することができます。例えば、エバーグリーンセールを実施する場合、"セールは[#today :%A]まで "という見出しを作成することができます。 

ユーザーがページにアクセスすると、"Our sale ends Tuesday"（セールは火曜日まで）など、ユーザーにとってその日がどの日であっても、その日の表示に置き換えられます。

クエリ・パラメータ・ダイナミック・テキスト

クエリパラメータのダイナミックテキストを使用すると、さまざまなクエリに基づいてコンテンツをパーソナライズできます。これは、広告キーワードに基づいてランディングページをパーソナライズしたり、誰かの名前でページをカスタマイズしたりする優れた方法です。

例えば、次のような見出しとクエリ・パラメータ・ダイナミック・テキスト・タグを持つページがあるとします："こんにちは [q:fname=there]"。

クエリーパラメーターがなければ、あなたのページはこう言うだけだ：「こんにちは。しかし、誰かの名前にパーソナライズすれば、"Hi John "と表示される。

SeedProdでは、ランディングページに動的テキストを追加するのに約30秒しかかからず、どこにでも配置できます。これには、検索キーワードやユーザーの詳細情報に基づいて自動的に更新される動的な見出しも含まれており、広告文との整合性を高め、関連性を向上させるのに最適です。

見出しとテキスト・ブロックには、ダイナミック・テキストを挿入するボタンがある。

例えば、場所によって異なるテキストを表示するように見出しを編集したい場合、見出しをクリックし、ダイナミックテキストの挿入ボタンを選択します。

そこから、「場所」のようなパラメータ名を入力し、「あなた」のようなデフォルト値を選ぶことができる。

デフォルトでは、見出しは「あなたの近くの運転教習所」と表示されます。しかし、location=FloridaのようにURLパラメータに場所がある場合は、'Driving Instructors Near Florida'と表示されます。

上記のように、SeedProdの見出しやテキストをカスタマイズするには、これらの手順を実行します。しかし、行動喚起ボタンのような他のSeedProdブロックにダイナミックテキストを追加したい場合は、ダイナミックテキストコードをコピーして必要な場所に貼り付けることができます。

次のステップに進む前に、緑色の「保存」ボタンをクリックして変更を保存してください。

関連記事 WordPressにFacebookのイベントを埋め込む方法

7.ランディングページの設定

ダイナミックな変更が完了したところで、SeedProdでコントロールできる他の設定をいくつか見てみましょう。まずはメールマーケティング設定です。

SeedProdを使えば、ランディングページとEメールリストを簡単に結びつけることができます。 

画面上部の「接続」をクリックすると、人気のメールマーケティングサービスが幅広く表示されます。ユーザーにニュースレターの購読を依頼したい場合は、このパネルを使ってメールマーケティングサービスをリンクします。

お好きなプロバイダーを選択し、Eメール統合ドキュメントの手順に従ってセットアップしてください。

同じ画面上で、Zapierを介して何千ものアプリにページをリンクしたり、Google Analyticsでサイトのパフォーマンスをモニターしたり、Recaptchaでスパムからページを保護したりすることができる。

Eメールリストを接続した後、ページ設定タブをクリックして、さらにオプションを追加してください。

設定ページには通常5つのセクションがありますが、これは作成するページのタイプやSeedProdのプランによって異なります。

1. 一般ランディングページの名前やURLを変更したり、公開と下書きを切り替えたりできます。
2. SEO対策： WordPressのSEOプラグインを使って、ランディングページのタイトルタグやメタディスクリプションなどを設定しましょう。
3. アナリティクスお気に入りのGoogle Analyticsプラグインを接続し、ランディングページのパフォーマンスを監視しましょう。
4. スクリプト：トラッキングやクッキーのようなカスタムスクリプトをページのヘッダー、ボディ、フッターに追加します。
5. カスタムドメイン：ランディングページに、既存のウェブサイトとは関係のないカスタムドメインを与えましょう。

設定後、変更を保存し、デザインタブに戻ります。

8.動的ランディングページを公開する

ランディングページを公開する前に、モバイルデバイスでテストする必要があります。モバイル・レスポンシブでなければ、タブレットやスマートフォンのような小さなタッチスクリーンでは、見栄えもパフォーマンスも悪くなります。

幸いなことに、SeedProdにはモバイルプレビューオプションがあり、あなたのページがモバイルフレンドリーかどうかをチェックすることができます。画面の下にあるモバイルアイコンをクリックしてください。

そこから、ダイナミック・ページがモバイルでどのように見えるかを確認し、正しく見えないものや動作しないものを変更することができます。

すべてがうまくいったら、いよいよ公開です。緑色の保存ボタンの隣にある下向き矢印をクリックし、公開をクリックします。

次に、ページが公開されたことを知らせるウィンドウが表示されます。

ライブ・プレビューを見るには、「ライブ・ページを見る」ボタンをクリックしてください。

動的ランディングページのベストプラクティス

設定を完了するには約30分かかります。実際にコンバージョン数を増やすには、もう少し工夫が必要です。

広告の見出しを、動的プレースホルダーのデフォルト設定に合わせてください。フォールバックのデフォルト設定は、URLパラメータがない場合にユーザーに表示される内容です。このデフォルト設定が広告の内容と一致していない場合、パラメータなしでアクセスしたすべてのユーザーに対して、メッセージの一致が失われてしまいます。

ブランド要素は固定にしておきましょう。ロゴ、ナビゲーション、配色は決して変更しないでください。訪問者の検索クエリやアクセス元と直接関連するコンテンツのみを切り替えてください。

すべての動的パラメータに対して、フォールバック用のデフォルト値を設定してください。デフォルト値が設定されていないパラメータが欠落していると、見出しが正しく表示されなくなります。すべてのパラメータには、単独でも機能する適切なデフォルト値が必要です。

ページ全体ではなく、動的な変数に対してA/Bテストを実施してください。パラメータの値を変更し、コンバージョン率を測定します。複数の変数を同時に変更すると、何が変化をもたらしたのかが判別できなくなります。

クローキングは避けてください。クローキングとは、検索エンジンのクローラーとユーザーに異なるコンテンツを表示することを指します。SeedProdのURLパラメータ方式では、クローラーとユーザーの両方に同じページが表示されます。Googleがインデックスに登録するのはこのデフォルトページですので、必ずデフォルトの代替ページを設定してください。

URLパラメータによって個別のページが生成されるわけではないため、重複コンテンツの心配はありません。URLにどのようなパラメータが含まれていても、正規URLは変わりません。

ボーナス：ランディングページからより多くを得る

ランディングページをレベルアップさせる方法をお探しですか？これらのガイドがきっとお役に立ちます：

• WordPressでランディングページのA/Bテスト：簡単ガイド
• コンバージョン率を高めるランディングページの見出しの公式
• ランディングページのURLの例とベストプラクティス
• 良いランディングページのコンバージョン率とは？
• ランディングページがコンバージョンしない？素早く修正するヒント
• ランディングページの解剖学：必須要素
• コンバージョン率を高めるランディングページのベストプラクティス
• ランディングページの直帰率を改善する方法
• ランディングページのコンバージョンを高める方法
• 専門家によるランディングページ最適化のヒント

よくある質問

ダイナミックランディングページとは何ですか？

ダイナミックランディングページとは、訪問者ごとに異なるコンテンツを自動的に表示するウェブページのことです。コンテンツは、検索クエリ、所在地、デバイスの種類、参照元などの訪問者データに基づいて変化します。ターゲット層ごとに個別のページを作成する代わりに、1つのページを用意し、ページ読み込み時にそのページ内でコンテンツを切り替える仕組みです。

動的なランディングページと静的なランディングページの違いは何ですか？

静的なランディングページは、すべての訪問者に同じコンテンツを表示します。一方、動的なランディングページは、訪問者がどのようにサイトにたどり着いたかに基づいて、パーソナライズされたコンテンツを表示します。静的なページは作成が簡単ですが、対象者ごとに個別のページを用意する必要があります。動的なページは、単一のURLからすべての対象者にコンテンツを提供するため、メンテナンスが効率的であり、テストも容易です。

動的なランディングページはPPCキャンペーンに適していますか？

動的なランディングページは、PPC広告において特に効果的です。ランディングページのタイトルが広告文と完全に一致すると、Google広告の品質スコアが向上し、クリック単価の低下や広告の表示順位向上につながります。URLパラメータを使用すれば、広告のキーワードをページのタイトルに直接渡すことができるため、自動的に一致させることができます。

動的なランディングページはSEOに悪影響を及ぼすのでしょうか？

URLパラメータを使用した動的ランディングページは、正しく設定されていればSEOに悪影響を及ぼしません。Googleはパラメータを除いた状態でページをクロールし、デフォルトのコンテンツをインデックスに登録します。重要なのは、すべての動的要素に対して、信頼性の高いデフォルトの代替コンテンツを設定することです。クローラーとユーザーで異なるコンテンツを表示する「クローキング」は避けてください。これが動的ページにおける主なSEO上のリスクとなります。

コーディングなしで動的なランディングページを作成することはできますか？

はい。SeedProdの動的テキスト機能を使えば、コードを一切変更することなく、見出しやテキストブロックにURLパラメータを追加できます。「動的テキストを挿入」ボタンをクリックし、パラメータ名を入力して、デフォルト値を設定するだけです。訪問者がそのパラメータを含むURLでページにアクセスすると、ページは自動的にその値を反映します。

これで、ダイナミックランディングページとは何か、そしてSeedProdを使ってWordPressで作成する方法がわかったと思います。SeedProdのビジュアルエディタが、パーソナライゼーションを自動的に処理してくれます。

独自のダイナミックなランディングページを作成したいとお考えなら、SeedProdにお任せください。コーディングや複雑な設定は一切不要です。

この記事を気に入っていただけたなら、ぜひTwitterや Facebookをフォローして、ビジネスの成長に役立つコンテンツをお楽しみください。