HubSpotでランディングページを作成したいけれど、どこから始めればいいか分からない...
B2B企業のマーケティング担当者の多くが、「ホワイトペーパーのダウンロードページを作りたい」「ウェビナー集客用のLPが必要」と考えながらも、「コーディングができない」「デザイナーに依頼する予算がない」といった理由で躊躇しています。
この記事では、HubSpotを使ってランディングページ（LP）を作成する具体的な手順を、初心者にも分かりやすく解説します。コーディング知識は一切不要で、ドラッグ＆ドロップの直感的な操作だけでプロフェッショナルなLPを作成できます。
この記事のポイント:
- HubSpotのLP作成機能は無料プランから利用可能（テンプレートの種類はプランにより異なる）
- ドラッグ＆ドロップで誰でも簡単に作成でき、自動的にモバイル対応になる
- コンバージョン率を高めるには「CTAを1つに絞る」「フォーム項目は3つが理想」などの設計原則がある
- A/Bテストで最大5つのバリエーションを比較し、効果測定も可能
- HubSpot以外のLP作成ツール（Unbounce、ペライチ等）との比較も公平に提示
1. HubSpotでランディングページを作成する前に知っておくべきこと
HubSpotでLPを作成する前に、基礎知識を押さえておきましょう。
(1) ランディングページ（LP）とは何か
ランディングページ（LP）とは、特定の目的を達成するために設計された単独のWebページです。通常のWebサイトとは異なり、以下の特徴があります:
- 1つの明確な目的: 資料ダウンロード、問い合わせ、ウェビナー申込など、単一のアクションに特化
- ナビゲーションメニューを排除: 訪問者が他のページに離脱しないよう、リンクを最小限に
- 強力なCTA: ユーザーを目的のアクションへ誘導するボタンやフォーム
(2) なぜB2B企業にランディングページが必要なのか
B2B企業がLPを作成する主なメリット:
- リード獲得の効率化: ホワイトペーパー、事例集、セミナーなどのオファーと引き換えに見込み客情報を取得できる
- コンバージョン率の向上: 通常のWebサイトよりも高いコンバージョン率（2〜3％が平均、検索広告からの流入で約3％、指名キーワードで約10％）を達成できる
- 効果測定が容易: 訪問者数、コンバージョン数、CVRなどの指標を明確に把握できる
国内のMAツール導入率は1.5%（上場企業では14.6%）とまだ低いものの、コロナ前と比較して導入企業数は2倍に増加しており、LP作成機能への需要も高まっています（出典: 株式会社Nexal「2023年5月国内63万社のMAツール実装調査」）。
(3) HubSpotを使うメリット：他のLP作成ツールとの比較
LP作成ツールには複数の選択肢があります。代表的なツールを公平に比較すると:
| ツール | 特徴 | 料金目安 | 向いている企業 |
|---|---|---|---|
| HubSpot | MAツールと一体化、リード管理・メール配信との連携が強力 | 無料プラン〜月額数万円（プランにより異なる） | マーケティング全体を自動化したい中小〜中堅企業 |
| Unbounce | LP作成に特化、柔軟なデザインカスタマイズが可能 | 月額1万円程度〜 | 広告運用とLPを連携させたい企業 |
| ペライチ | 国内サービス、初心者向けの簡単な操作性 | 月額1,500円〜 | とにかく簡単にLPを作りたい小規模企業 |
| Ferret One | B2Bマーケティングに特化、国内サポートが充実 | 月額5万円程度〜 | 国内B2B企業、手厚いサポートが欲しい企業 |
HubSpotの強み:
- リード情報が自動的にMAツールに蓄積され、その後のメール配信やスコアリングに活用できる
- ドラッグ＆ドロップで誰でも作成できる（コーディング不要）
- 自動的にレスポンシブデザイン対応（PC・スマホ・タブレット）
- A/Bテスト機能で効果測定が可能（最大5つのバリエーション）
HubSpotの弱み:
- LP作成「だけ」に特化したツールと比べると、デザインの柔軟性は劣る
- 高度な機能（Breeze、A/Bテスト等）は有料プラン（Professional/Enterprise）が必要
※ツール選定時は、最新の料金・機能を各社公式サイトで確認してください（この記事は2024-2025年時点の情報です）。
2. HubSpotのランディングページ作成機能の基礎知識
HubSpotのLP作成機能の全体像を理解しておきましょう。
(1) HubSpotのプラン別LP作成機能の違い
HubSpotのLP作成機能は無料プランから利用できますが、プランによって使える機能が異なります:
無料プラン:
- 基本的なLP作成機能
- 利用可能なテンプレートの種類が制限される
- A/Bテスト機能なし
Professional/Enterpriseプラン:
- すべてのテンプレートが利用可能
- A/Bテスト機能（最大5つのバリエーション）
- Breeze（AI自動生成機能）が利用可能
- 詳細な分析・レポート機能
※プランの詳細や料金は変更される可能性があるため、HubSpot公式サイトで最新情報をご確認ください。
(2) 利用可能なテンプレートの種類（スターター・テーマ・カスタム）
HubSpotには3種類のテンプレートが用意されています:
スターターテンプレート:
- HubSpotが提供する基本的なデザイン
- すぐに使える汎用的なレイアウト
- 初心者に最適
テーマテンプレート:
- マーケットプレイスから購入できる高度なデザイン
- 業界やデザインスタイル別に選択可能
- より洗練されたデザインが必要な場合に
カスタムテンプレート:
- 開発者が独自に作成したテンプレート
- 企業のブランドガイドラインに完全に準拠させたい場合に
最初はスターターテンプレートで十分です。慣れてきたら、テーマテンプレートやカスタムテンプレートを検討すると良いでしょう。
(3) Breeze（AI自動生成機能）とは
Breezeは、HubSpotが提供する生成AI機能です。プロンプトを入力するだけでランディングページを自動生成できます。
利用条件:
- Content Hub ProfessionalまたはEnterpriseのサブスクリプションが必要
使い方:
- LP作成画面でBreezeを選択
- 「ホワイトペーパーのダウンロードページ」などの目的を入力
- AIが自動的にレイアウト・コピー・画像を生成
- 微調整して公開
Breezeを使うことで、LP作成の時間を大幅に短縮できます。ただし、生成されたコンテンツは必ず確認・修正してから公開しましょう。
(4) レスポンシブデザインとモバイル対応
HubSpotで作成したLPは、自動的にレスポンシブデザイン対応となります。PC、スマートフォン、タブレットなど、あらゆるデバイスで適切に表示されるため、個別に設定する必要はありません。
一般的に、モバイル最適化されていないLPも多く存在すると言われていますが、HubSpotでは標準でレスポンシブ対応しているため、この点は心配不要です。
3. HubSpotでランディングページを作成する具体的な手順
ここからは、実際にLPを作成する手順を6ステップで解説します。
(1) ステップ1：［コンテンツ］＞［ランディングページ］から作成開始
HubSpotにログインし、以下の手順で進めます:
- 左メニューから［コンテンツ］を選択
- ［ランディングページ］をクリック
- 右上の［作成］ボタンをクリック
これでLP作成画面が開きます。
(2) ステップ2：テンプレートを選択する
テンプレート選択画面が表示されるので、目的に合ったテンプレートを選びます。
選び方のポイント:
- ホワイトペーパー/資料ダウンロード: フォームが中央に配置されたシンプルなレイアウト
- ウェビナー/セミナー申込: 日時・内容が目立つデザイン
- 問い合わせ/相談予約: 企業の信頼性を伝える要素（実績、導入事例等）が含まれるレイアウト
初めての場合は、スターターテンプレートの中から選ぶのが無難です。
(3) ステップ3：ドラッグ＆ドロップエディタでカスタマイズ
テンプレートを選ぶと、ドラッグ＆ドロップエディタが開きます。
基本操作:
- テキスト編集: テキスト部分をクリックして直接編集
- 画像変更: 画像をクリックして差し替え
- 要素の追加: 左側のメニューから「テキスト」「画像」「ボタン」等をドラッグして配置
- レイアウト調整: 要素をドラッグして位置を変更
コーディング知識は一切不要で、直感的に操作できます。
(4) ステップ4：フォームとCTAを設定する
LPの核となるフォームとCTA（Call To Action）を設定します。
フォームの設定:
- フォーム要素をドラッグして配置
- 取得したい項目（名前、メールアドレス、会社名等）を選択
- 重要: フォーム項目は3つが理想（平均コンバージョン率10%を記録）。項目が増えるほど入力ハードルが上がります
CTAの設定:
- ボタンのテキストは具体的に（「資料をダウンロード」「無料で試す」等）
- 色は目立つ色を選択（周囲とのコントラストを意識）
- 1ページに1つのCTAのみ設置（複数あると訪問者が迷います）
ナビゲーションメニューの排除: LPでは、訪問者を目的のアクションへ集中させるため、ヘッダーのナビゲーションメニューや他ページへのリンクを極力排除します。これによりコンバージョン率が向上します。
(5) ステップ5：SEO設定（メタタグ、OGP）とドメイン設定
LPを検索エンジンやSNSで見つけてもらうため、SEO設定を行います。
メタタグの設定:
- 右上の［設定］ボタンをクリック
- ［SEO］タブを選択
- メタタイトル: 30-35文字で主要キーワードを前方配置（例: 「HubSpotでLP作成｜初心者向け完全ガイド」）
- メタディスクリプション: 90-120文字で記事要約（例: 「HubSpotでランディングページを作成する具体的な手順を解説。ドラッグ＆ドロップで誰でも簡単に作成でき、コンバージョン率を高める設計原則も紹介します。」）
OGP設定（SNSシェア時の表示）:
- OGP画像を設定（推奨サイズ: 1200x630px）
- SNSでシェアされた際に魅力的に見えるようにする
ドメイン設定:
- HubSpotの無料プランではサブドメイン（例: yourcompany.hs-sites.com）を使用
- 有料プランでは独自ドメイン（例: lp.yourcompany.com）を設定可能
(6) ステップ6：公開とプレビュー確認
公開前に必ずプレビュー確認を行いましょう。
プレビュー確認のポイント:
- PC・スマホ・タブレットそれぞれでの表示を確認
- フォームが正しく動作するかテスト送信
- リンクが正しく設定されているか確認
- 誤字脱字のチェック
問題がなければ、右上の［公開］ボタンをクリックして公開完了です。
4. コンバージョン率を高めるLP設計のポイント
LPを作成しただけでは成果は出ません。コンバージョン率を高めるための設計原則を押さえておきましょう。
(1) ファーストビューで価値提案を明確にする
ファーストビュー（ページを開いた瞬間に見える範囲）で、訪問者に「このページは自分に役立つ」と理解してもらう必要があります。
明確にすべき要素:
- 何が手に入るのか: 「業界別MA導入事例集（30ページ）」など具体的に
- 誰向けか: 「B2B企業のマーケティング担当者向け」など明示
- なぜ今必要か: 「2025年最新のトレンドを反映」など鮮度を伝える
ファーストビューで価値提案を数秒以内に理解できるようにすることが、コンバージョン率向上の第一歩です。
(2) CTAを1つに絞る（ナビゲーションメニューは排除）
LPは1つの明確な目的を持つべきです。複数のCTAやリンクがあると、訪問者が迷って離脱する原因になります。
ベストプラクティス:
- CTAボタンは1種類のみ（「資料ダウンロード」など）
- ヘッダーのナビゲーションメニューを非表示に
- フッターのリンクも最小限に（プライバシーポリシー程度）
訪問者の選択肢を減らし、目的のアクションに集中させることで、コンバージョン率が向上します。
(3) フォームフィールド数を最適化する（3項目が理想）
フォームの入力項目数は、コンバージョン率に直接影響します。
統計データ:
- 3項目: 平均コンバージョン率10%（最も高い）
- 5項目以上: コンバージョン率が低下する傾向
推奨する項目数:
- 最低限の場合: 名前、メールアドレスの2項目
- 理想的な場合: 名前、メールアドレス、会社名の3項目
- B2B企業の場合: 部署名や役職を追加したい場合もあるが、項目が増えるほど離脱率が上がることを認識する
必要最低限の情報のみ取得し、追加情報は後から（ナーチャリングメールやインサイドセールスで）取得する戦略が有効です。
(4) ページの読み込み速度を改善する
ページの読み込みが遅いと、訪問者が離脱してコンバージョン率が低下します。
改善方法:
- 画像を圧縮: 高解像度の画像はファイルサイズを削減（TinyPNG等のツールを活用）
- 重いスクリプトを避ける: 不要なJavaScriptやトラッキングタグを削除
- 動画の埋め込みを最適化: YouTube等の埋め込みは遅延読み込みを設定
HubSpotは標準でページ速度最適化機能を持っていますが、画像圧縮など基本的な対策は自分で行う必要があります。
5. A/Bテストと効果測定でLPを改善する方法
LPは作って終わりではありません。継続的に改善することで、コンバージョン率を向上させることができます。
(1) HubSpotでのA/Bテスト設定方法（最大5バリエーション）
A/Bテストは、複数のバリエーション（デザイン、コピー等）を作成し、どちらがより高いコンバージョン率を達成するかをテストする手法です。
HubSpotでのA/Bテスト:
- 1ページにつき最大5つのバリエーションをテスト可能
- 最も効果の高いバリエーションを自動的に抽出できる
- ProfessionalまたはEnterpriseプランで利用可能
テストすべき要素:
- ヘッドラインのコピー: 価値提案の表現を変える
- CTAボタンの色・テキスト: 「無料でダウンロード」vs「今すぐ入手」など
- フォームの配置: 右側 vs 中央 vs 左側
- 画像: 人物写真 vs イラスト vs 製品画像
A/Bテストは一度に1つの要素のみ変更するのが基本です（複数変更すると、どの要素が効果をもたらしたか分からなくなります）。
(2) 測定すべき指標：訪問者数・コンバージョン数・CVR
HubSpotのダッシュボードでは、以下の指標を確認できます:
主要指標:
- 訪問者数: LPを訪れた人の数
- コンバージョン数: フォームを送信した人の数
- CVR（コンバージョン率）: コンバージョン数 ÷ 訪問者数 × 100（%）
追加で見るべき指標:
- 流入元: 検索エンジン、SNS、メール、広告など、どこから訪問したか
- デバイス: PC、スマホ、タブレットの比率
- 直帰率: LPを見て何もせずに離脱した割合
これらの指標を定期的にチェックし、改善点を見つけましょう。
(3) コンバージョン率の目安と業界平均
LPのコンバージョン率は、業界や商材、流入元によって大きく異なりますが、目安を把握しておくことは重要です。
一般的な目安:
- 平均: 2〜3%
- 検索広告からの流入: 約3%
- 指名キーワード: 約10%
- 優良なLP: 5%以上
※これらはあくまで目安です。自社のデータで継続的に測定し、改善することが最も重要です。
コンバージョン率が低い場合は、以下を見直しましょう:
- ファーストビューの価値提案が不明確
- フォーム項目数が多すぎる
- CTAが複数ある（訪問者が迷う）
- ページの読み込み速度が遅い
6. まとめ：HubSpotのLP作成で成果を出すために
HubSpotを使えば、コーディング知識がなくてもプロフェッショナルなランディングページを作成できます。ドラッグ＆ドロップの直感的な操作で、誰でも簡単に始められます。
成果を出すための重要ポイント:
- LP作成は「作って終わり」ではなく、継続的な改善が必要
- コンバージョン率を高めるには、CTAを1つに絞り、フォーム項目は3つが理想
- A/Bテストで複数のバリエーションを試し、データに基づいて改善する
- HubSpotはMAツールと一体化しているため、リード管理・メール配信との連携が強力
次のアクション:
- HubSpotの無料プランまたは有料プランを確認し、必要な機能を整理する
- 最初のLPを作成してみる（ホワイトペーパーやウェビナーなど、既存のオファーでOK）
- 公開後、訪問者数・コンバージョン数・CVRを定期的に測定する
- A/Bテストで改善を繰り返し、コンバージョン率を向上させる
まずは1つLPを作成し、データを見ながら改善していくことで、マーケティング活動の効率化とリード獲得の最大化を実現しましょう。