メール配信ツールで メールマーケティングを シンプルに
ランディングページを作成して公開する
公開日: · 最終更新日: · 著者 Marcus Biel
この記事のポイント
Maildroppaでランディングページを作成・公開する方法を解説します。テンプレート、独自ドメイン、SEO設定、法的情報、SNS共有時のプレビュー、公開リンクの設定を紹介します。
Maildroppaのランディングページは、登録フォームを中心に構成された独立したページです。既存のウェブサイトがなくても利用できます。
Maildroppaでページを公開し、公開リンクを広告、SNSの投稿、QRコード、メール、メッセージアプリでの会話、別のウェブサイトのボタンなどで共有できます。ランディングページ用の独自ドメインを接続している場合は、そのドメインでもページを公開できます。
このガイドでは、ランディングページ固有の機能を説明します。共通機能であるレイアウト、コンテンツブロック、テキスト編集、フォームの入力項目、タグ、デザイン設定、レイヤー、登録フローについては、登録フォームビルダーガイドでまとめて説明しています。
ランディングページを作成する
「Signup Forms」を開き、「Create Form」をクリックして「Landing Page」を選択します。管理用のわかりやすい名前を入力し、ビルダーに進みます。
既存のランディングページは、登録フォーム一覧で名前をクリックするか、アクションメニューから「Edit Form」を選択して開くこともできます。
この名前は、Maildroppa内でページを識別するためのものです。公開ページのメイン見出しにはなりません。また、後から名前を変更しても、既存の公開アドレスは自動では変わりません。
ランディングページのテンプレートを選ぶ
ランディングページビルダーには、作成の出発点となる5つのテンプレートがあります。
Blank Page — 白紙のキャンバスから、自由にデザインを作成できます。
Newsletter Signup — メールマガジンの読者を増やすための汎用的なページです。
Lead Magnet — ダウンロード資料などの登録特典を中心に構成されたページです。
Webinar Signup — ウェビナー、ライブ研修、オンラインイベントの登録ページです。
Waitlist — 商品やサービスの提供開始、イベントの開催前に、関心のある人の登録を受け付けるページです。
目的に最も近い構成のテンプレートを選んでください。テンプレートの内容はすべて編集できます。テキストや画像の差し替え、デザインの変更、セクションの並べ替え、不要な要素の削除が可能です。
セクションでページを組み立てる
ランディングページでは、他の登録フォームと同じレイアウトとコンテンツブロックを利用できます。さらに、「Layout」には、再利用できる完成済みのセクションも用意されています。
Hero with signup form — 提案内容を目立たせ、メインメッセージの近くに登録フォームを配置する冒頭のセクションです。
Benefit cards — 主なメリットや得られる成果を説明するための3つのカードです。
Image/text split — 画像と説明文を組み合わせる2列のセクションです。
Testimonial — 顧客の声やコメントの引用など、信頼性を裏付ける情報を掲載するセクションです。
FAQ — 登録前によくある疑問や不安を解消するための、質問と回答のセクションです。
セクションをクリックすると、現在の挿入位置に追加されます。キャンバスにドラッグして追加することもできます。各セクションは通常のボックス、列、テキスト、画像、リストなどのブロックで構成されているため、追加後は各部分を個別に編集できます。
セクションを使って、次のようなわかりやすい流れを作りましょう。
- 提案内容を説明する。
- その価値を伝える。
- 想定される質問に答える、または裏付けを示す。
- 訪問者に登録を促す。
すべてのセクションを使う必要はありません。1つの明確な提案に絞ったページのほうが、関連のない情報を含む長いページよりも、内容が伝わりやすいことがよくあります。
登録フォームを追加する
ランディングページには、登録フォームブロックが1つ必要です。このブロックで訪問者のメールアドレスと、追加で選択した購読者情報の項目を収集します。
ほとんどのテンプレートには、あらかじめ登録フォームが含まれています。白紙のページから作成する場合は、「Content」を開いて「Signup form」を追加します。登録フォームを配置すると、2つ目の登録フォームブロックは追加できなくなります。
ブロックを選択すると、入力項目、非表示タグ、進行状況インジケーター、購読者数カウンター、入力欄のデザイン、送信ボタンを設定できます。これらの共通設定については、登録フォームの設定で説明しています。
フォームの上、下、横には、補足コンテンツを配置できます。登録すると何を受け取れるのかが、メイン見出しとボタンで明確に伝わるようにしてください。
画像・動画・補足コンテンツを使う
ランディングページには、テキスト、画像、動画、リスト、ボタン、SNSリンク、購読者数カウンター、スペーサー、区切り線を配置できます。
画像はURLを指定するか、アップロードするか、Maildroppaのメディアライブラリから選択して追加できます。画像が重要な情報を伝えている場合は、その内容がわかる代替テキストを追加してください。サイズ、縦横比、トリミング、焦点の位置、リンク、回転、画面サイズに応じた表示も設定できます。
動画ブロックは、YouTube、Vimeo、埋め込みURL、動画ファイルの直接指定に対応しています。プレビュー画像と再生ボタンのスタイルは個別に設定できます。
ボタンは、商品ページを開く、別の資料へ移動するといった補助的なアクションに便利です。購読者情報をMaildroppaに送信する役割は、登録フォームの送信ボタンが担います。
購読者数をページのコンテンツの一部として表示する場合は、独立した購読者数カウンターを使います。送信エリアのすぐ隣に表示する場合は、登録フォームの設定内にある購読者数カウンターを使ってください。
ページのデザインを設定する
右側のサイドバーで「Page settings」を開き、ページ全体のデザインを設定します。
ページの背景色や背景画像、背景の位置とサイズ、ページの最大幅、標準のフォントと色、見出しやリンクのスタイル、ボタンの標準設定、ボックスのスタイル、モバイル表示時の余白を設定できます。複数列のレイアウトを、小さい画面で縦並びに切り替えるタイミングも選べます。
これらの標準設定を使うと、ページ全体に統一感を持たせられます。個々のセクション、列、コンテンツブロックを選択し、色、余白、枠線、文字のスタイルを個別に変更することもできます。
編集中はこまめに「Preview」で確認してください。スクロールする前に登録のメリットが伝わるか、ボタンを見つけやすいか、画像が目立ちすぎてフォームが埋もれていないかを確認します。
ランディングページを下書き保存する
ランディングページは、公開せずに下書きとして保存できます。
作業中は、上部バーに現在の保存状態が表示されます。現在のバージョンを手動で保存するには、「Save draft」を使います。下書きのプレビューや編集はできますが、公開するまでは、訪問者が公開リンクから開くことはできません。
すでに公開中のページを編集しても、デザインの変更が公開版にすぐ反映されることはありません。Maildroppaでは、これらは未公開の変更として表示されます。そのため、訪問者に表示される内容を変えずに、編集とプレビューを続けられます。新しいバージョンの準備ができたら、「Publish changes」を使って反映してください。
公開設定を開く
最初のバージョンの準備ができたら、「Publish」をクリックします。すでに公開中のページでは、ボタンが「Publish changes」または「Manage publication」と表示される場合があります。
公開設定ウィンドウには、ランディングページの公開に必要な情報がまとめられています。
- 公開状態
- 公開アドレス
- 登録フローと購読者への影響
- 検索結果のプレビュー
- SNS共有用画像
- ファビコン
- ホストされるページの法的情報
- 公開準備状況
Maildroppaは、公開前にこれらの設定を確認します。必須情報が不足している場合は、「Ready to publish」セクションに対応が必要な内容が表示され、可能な場合は、対応するための操作も提示されます。
公開アドレスを選ぶ
公開するランディングページには、それぞれ一意の公開アドレスが必要です。
Maildroppaでは、アカウント用の標準ランディングページアドレスを提供できます。ランディングページ用の独自ドメインを1つ以上接続している場合は、利用準備が整ったドメインを選択し、ページのパスを設定できます。
たとえば、独自ドメインのアドレスには、/newsletter、/webinar、/summer-guideなどのパスを使えます。
Maildroppaは、選択したアドレスが利用可能かどうかを確認します。パスがすでに使われている場合は、公開設定に重複が表示され、代わりのパスが提案されることがあります。独自ドメインでページを公開するには、接続が完了し、利用準備が整っている必要があります。
公開済みページのアドレスを変更すると、次回の公開後は、新しいアドレスでページが表示されるようになります。特に古いリンクをすでに共有している場合は、変更を公開する前に、アドレスに関する警告をよく確認してください。
独自ドメインの接続、検証、トラブルシューティングについては、ランディングページ用の独自ドメインを接続・検証するを参照してください。独自ドメインの検証中も、Maildroppaの標準アドレスで公開を続けられます。ドメインの準備ができたら、そのドメインを選択し、一意のパスを設定して、ページを再度公開してください。
登録フローを確認する
公開設定ウィンドウには、そのランディングページで使用する登録フローと、訪問者がたどる手順の概要が表示されます。
フォーム送信後の動作、送信されるダブルオプトインの確認メール、登録確認後の動作を確認してください。フローが未完成、または現在のページに適していない場合は、「Signup flow settings」を開き、フローの選択、作成、編集を行います。
共有の登録フローは、複数のフォームで使用できます。そのため、編集すると他のフォームの登録手順や表示内容も変わる可能性があります。ランディングページ専用の確認テキスト、メール、登録確認後のアクションが必要な場合は、別のフローを作成してください。
検索結果のプレビューを設定する
「Search Preview」セクションでは、検索エンジンに伝えるページ情報を設定します。
ページの内容を正確に表すSEOタイトルとSEO説明文を入力します。ページの言語を選び、検索結果に表示するかどうかを決めます。
限定キャンペーンや一時的な登録ページなど、直接リンクを受け取った人だけにページを案内したい場合は、「Show in search」を無効にします。この設定は、検索エンジンにページをインデックスしないよう指示するものです。リンク自体を非公開にしたり、ページをパスワードで保護したりするものではありません。
管理用のフォーム名をそのまま使うのではなく、内容が伝わるタイトルを付けてください。SEO説明文には、提案内容とページを訪れるメリットを簡潔に記載します。
SNS共有用画像を追加する
「Social Sharing Preview」セクションでは、リンクプレビューに対応するサービスでランディングページのリンクを共有したときに表示する画像を設定できます。
画像URLを入力するか、画像をアップロードします。小さなプレビューでも内容がわかる、シンプルな画像を選んでください。画像内にテキストを入れる場合は、読みやすい大きさにします。
ファビコンを追加する
ファビコンは、ブラウザのタブなどに表示される小さなアイコンです。
「Favicon Branding」セクションで、ファビコンのURLを入力するか、画像をアップロードします。小さく表示されるため、通常は正方形のシンプルなブランドマークが適しています。
ホストされるページの法的情報を入力する
Maildroppaがランディングページをホストして公開するため、公開設定にはページの法的情報を登録する項目があります。
ここでは、アカウントに保存されている郵送先住所を使用し、ページの提供者を特定して連絡するために必要な情報を入力します。組織の形態によって、次のような情報が必要です。
- 提供者の種別
- 公開する連絡先メールアドレス
- 追加の連絡手段（任意）
- 提供者情報または法的通知のURL（必要な場合）
- プライバシーに関するURL（必要な場合）
- ページのコンテンツと法的情報に責任を負うことの確認
個人事業主・フリーランサー、会社・パートナーシップ、団体・非営利組織、公的機関、その他の組織など、実態に合った提供者の種別を選んでください。
郵送先住所が未入力、または正しくない場合は、このセクションのリンクからアカウント設定を開いて更新します。Maildroppaには、公開前に対応が必要な法的要件が表示されます。
この機能は、ページに必要な情報を掲載するためのものです。事業や国に適用される要件についての法的助言に代わるものではありません。
ページを公開する
公開設定ウィンドウの下部にある「Ready to publish」セクションを確認します。表示された問題をすべて解決してから、「Publish」をクリックしてください。
Maildroppaは、現在の下書きと公開設定を保存してからページを公開します。公開が完了すると、次の操作ができます。
- 公開中のページを開く
- 公開リンクをコピーする
- エディターに戻る
公開中のページを一度開き、登録の流れを最初から最後まで自分でテストしてください。公開アドレス、レイアウト、入力項目、入力内容のチェック、送信後の応答、ダブルオプトインの確認メール、登録確認後の結果を確認します。
公開済みページを管理する
公開後は、ビルダーの「Manage publication」または登録フォーム一覧のアクションを使います。
Publish changes — 公開中のバージョンを、現在保存されている下書きに置き換えます。
View live page — 公開中のページを新しいブラウザタブで開きます。
Copy link — 現在の公開アドレスをコピーします。
Unpublish — アカウントからランディングページを削除せずに、公開を停止します。引き続き編集でき、後から再公開することもできます。
登録フォーム一覧では、ランディングページが下書き、公開済み、非公開のいずれの状態かを確認でき、その状態に応じた共有・管理操作を利用できます。
メール配信を、もっと効果的にしませんか？
機能過多のツールや割高なプランに振り回されるのは、もう終わりにしませんか。Maildroppaなら、個別のサポート、プライバシーに配慮した管理機能、充実したメールマーケティング機能を利用できます。永年無料のプランから始められます。
クレジットカード情報の入力は不要です。利用期限もありません。