ランディングページの作り方｜5ステップ・構成例・公開前チェック【2026年版】

この記事の監修者

齊藤 真也

株式会社ファーストネットジャパン 代表取締役

1998 年創業時からアプリ開発・Web マーケティング・フルリモート SES・ホームページ制作・翻訳・グラフィックデザインなど幅広い IT／クリエイティブ領域を手がけ、4,000 件超のプロジェクトを統括。セキュリティ対策・SEO・システム開発から中小企業のWeb戦略支援まで、技術とデザインの両面でクライアントの課題解決を27年以上にわたり支援してきた。
大阪本社・東京オフィスの2拠点体制で、全国の企業のデジタル化をサポート。
高松市出身。座右の銘は「圧倒的努力」。

ランディングページは、目的を一つ決め、読者の疑問に答える構成を作り、原稿・画像・フォームを整えて公開する順番で制作します。デザインから始めるより、「誰が、何を判断し、どの行動へ進むか」を先に書くと構成を決めやすくなります。

基本の5ステップは目的とCV → 読者と比較項目 → 構成 → コピー・デザイン・実装 → 計測と改善です。自作ツールの利用料と、原稿・撮影・フォーム・計測を含む制作費は分けて考えてください。

FNJのランディングページ制作は20〜50万円が目安で、要件・規模や原稿・撮影などの範囲によって変動します。1998年創業・4,000件超の制作実績をもとに、5ステップの手順、記入できる制作メモ、構成例、公開前のチェックを解説します。

ホームページの新規制作・リニューアルを検討されていますか？

ファーストネットジャパンでは、1998年の創業から培ってきた知見・経験を基に、ホームページ作成・集客のお手伝いなど総合的にWebのお困りごとをサポートしています。
Webに関することならまずは当社にお問い合わせください。

実績豊富な
ホームページ制作会社なら
こちらをクリック

ランディングページとは｜ホームページとの違い

ランディングページとは、特定の商品やサービスについて説明し、問い合わせ、資料請求、購入、予約などのコンバージョン（CV）につなげることを目的としたWebページです。一般的には縦長の1ページ構成で制作し、一つの目的へ向けて情報を順番に伝えます。

ホームページが会社情報、サービス、採用情報、ブログなど複数の情報を掲載するのに対し、ランディングページは特定の商品やサービスに絞って訴求する点が大きな違いです。

ランディングページ・ホームページ・ECサイトの違い

ランディングページが向いているケース

• 特定の商品やサービスへの問い合わせを増やしたい
• リスティング広告やSNS広告の受け皿を作りたい
• 新商品や新サービスを集中的に訴求したい
• セミナーや資料請求の申し込みを増やしたい
• ターゲット別に訴求内容を変えて検証したい

一方、会社全体の信頼形成や複数サービスの紹介が目的なら、ホームページの方が適しています。ホームページとランディングページはどちらか一方を選ぶものではなく、ホームページを土台にして、重点サービスにランディングページを追加する方法も一般的です。

ランディングページを作る前に埋める6項目

この6項目が書ければ、見出しとフォームで尋ねる内容を決めやすくなります。まだ決まっていない項目は推測で埋めず、営業担当や事業責任者へ確認してください。

初心者向け｜ランディングページの作り方5ステップ

ランディングページ制作でよくある失敗は、最初にデザインを考えてしまうことです。デザインに入る前に目的、ターゲット、構成を決めることで、ページ全体の訴求がぶれにくくなります。

STEP1：目的とCVを決める

最初に「このランディングページで何を達成するのか」を決めます。CVには、問い合わせ、資料請求、見積もり、予約、購入、セミナー申込などがあります。

基本的には、一つのランディングページにつき中心となるCVを一つ決めます。「商品を売りたい」「資料請求も増やしたい」「採用応募も欲しい」と目的を増やしすぎると、訪問者が何をすればよいのかわかりにくくなります。

広告を利用する場合は、CVだけでなく、目標CPA（1件のCVを獲得するために使える広告費）も決めておくと、公開後の改善判断がしやすくなります。

STEP2：ターゲットと競合を整理する

次に、誰に向けてページを作るのかを整理します。年齢や性別だけではなく、どのような課題を抱え、何を比較し、問い合わせ前に何を不安に感じるのかまで考えることが重要です。

BtoBであれば、業種、会社規模、担当者の役職、検討時期、予算、現在利用しているサービスなども確認します。既存顧客へのヒアリングや営業担当者がよく受ける質問は、ターゲットを考えるうえで有効な情報です。

競合ページについては、デザインだけを見るのではなく、次の項目を比較します。

• 誰をターゲットにしているか
• ファーストビューで何を訴求しているか
• 料金をどこまで公開しているか
• どのような実績や事例を掲載しているか
• 問い合わせ前の不安にどう答えているか
• どのようなCTAを使っているか

競合と同じ内容を増やすのではなく、「競合では十分に説明されていないが、自社では説明できる情報」を見つけることが差別化につながります。

STEP3：構成・ワイヤーフレームを作る

ターゲットと訴求内容を整理したら、ページ全体の構成を作ります。ワイヤーフレームとは、見出し、文章、画像、CTAなどをどの順番で配置するかを決める設計図です。

初心者の場合は、最初からFigmaなどの専門ツールを使う必要はありません。PowerPoint、Googleスライド、紙のラフでも構いません。重要なのは、デザイン前に情報の順番を決めることです。

基本的な流れは次のようになります。

1. ファーストビュー
2. ユーザーの悩み・課題
3. 商品・サービスによる解決方法
4. 選ばれる理由・特徴
5. 実績・導入事例・お客様の声
6. サービス内容・料金
7. 利用・導入の流れ
8. よくある質問
9. CTA・問い合わせフォーム

すべての商品でこの順番にする必要はありません。価格が重要なサービスなら料金を前に出し、実績が重要なサービスなら事例を早い段階に配置するなど、ターゲットが知りたい順番に調整します。

STEP4：コピー・デザイン・ページを作る

ワイヤーフレームが決まったら、コピー、画像、デザインを作ります。文章は「自社が伝えたいこと」から書くのではなく、「訪問者が知りたいこと」の順番で作るのがポイントです。

例えば「高品質なサービスです」という抽象的な表現だけでは、競合との違いが伝わりません。「専任担当者が対応するため窓口が変わらない」「公開後もアクセス解析を行う」といった具体的な内容に落とし込みます。

デザインでは、装飾を増やすことよりも、次の情報が一目でわかることを優先します。

• 誰向けの商品・サービスなのか
• どのような課題を解決できるのか
• 他社との違いは何か
• 料金や利用条件はどうなっているか
• 次に何をすればよいのか

ページを実装したら、PCだけでなくスマートフォンでも確認します。文字サイズ、ボタンの押しやすさ、表の見やすさ、フォーム入力などを実際の端末で確認してください。

STEP5：公開して計測・改善する

ランディングページは公開して終わりではありません。公開後のデータを確認し、どこでユーザーが離脱しているのか、どのCTAが押されているのか、フォームまで到達しているのかを分析します。

最低限確認したい項目は次のとおりです。

• アクセス数
• 流入元
• CTAクリック数・クリック率
• フォーム到達数
• フォーム送信数
• CV率
• 広告を利用する場合はCPA

Googleアナリティクス（GA4）や広告管理画面を使って計測し、問題のある箇所から順番に改善します。複数の場所を一度に変更すると効果の原因がわからなくなるため、一つずつ仮説を立てて改善することが重要です。

初心者が失敗しやすいポイント

• 目的を増やしすぎる：問い合わせ、購入、採用など複数のゴールを同じ強さで置かない
• デザインから始める：ターゲットと構成を決めてからデザインへ進む
• 自社の説明ばかりになる：ユーザーの課題から話を始める
• 実績の根拠が弱い：抽象的な「高品質」「豊富な実績」だけで終わらせない
• 公開後に放置する：アクセスとCVを確認し、継続的に改善する

成果につながるランディングページの構成

成果につながるランディングページは、単に情報を縦に並べたものではありません。訪問者が持つ「自分に関係があるのか」「本当に信頼できるのか」「費用や進め方は問題ないか」という疑問を、上から順番に解消する構成にします。

ファーストビューで「自分向け」と理解してもらう

ファーストビューは、ページを開いたとき最初に見える部分です。ここではキャッチコピーを格好よくすることより、誰向けのサービスで、何を解決できるのかをわかりやすく伝えることを優先します。

基本的には次の要素を検討します。

• ターゲットがわかる言葉
• 解決できる課題や得られる価値
• 商品・サービスの内容
• 実績などの信頼材料
• 問い合わせ・資料請求などのCTA

広告から流入させる場合は、広告文とファーストビューの内容を一致させます。広告では「費用」を訴求しているのに、ページを開いても料金が見つからない、といった状態は避けます。

課題→解決方法→根拠の順番で説明する

サービスの機能や特徴をいきなり並べるより、「このようなことで困っていませんか」という課題から始め、その課題を商品・サービスがどのように解決するのかを説明すると理解されやすくなります。

そのうえで、実績、導入事例、お客様の声、担当者紹介などを掲載し、「本当に任せて大丈夫なのか」という不安を減らします。実績を掲載するときは、存在しない数字や成果を作らず、確認できる事実だけを使います。

料金と導入の流れで問い合わせ前の不安を減らす

料金を固定できないサービスでも、「20万円～」「要件によって個別見積もり」のように目安を示すことで、問い合わせの心理的ハードルを下げられます。

また、問い合わせ後に何が起きるかわからないことも離脱要因になります。「ヒアリング→見積もり→契約→制作→公開」のように、その後の流れを示しておくことが大切です。

CTAはユーザーが行動しやすい場所に置く

CTAは、問い合わせや資料請求など次の行動を促すボタンやリンクです。ファーストビュー、サービスのメリットを理解した後、ページ末尾など、ユーザーが「もう少し詳しく知りたい」と感じる位置に設置します。

「お問い合わせはこちら」だけでなく、「費用と納期を相談する」「無料で相談する」など、クリックした後に何ができるのかがわかる文言を検討します。

内容を踏まえて、自社で対応する範囲と依頼する範囲を整理して相談できます。

ホームページの新規制作・リニューアルを検討されていますか？

ファーストネットジャパンでは、1998年の創業から培ってきた知見・経験を基に、ホームページ作成・集客のお手伝いなど総合的にWebのお困りごとをサポートしています。
Webに関することならまずは当社にお問い合わせください。

実績豊富な
ホームページ制作会社なら
こちらをクリック

初心者向けのランディングページ構成例

以下は相談申込みを目的にするBtoBサービスの想定例です。実績や成果は自社で確認できるものだけを使い、商材に合わせて順番を調整します。

コピーは抽象的な強みを具体的な説明へ置き換える

「高品質」「安心」だけでは判断材料が不足します。どの工程を担当するか、どの資料を使うか、公開後に何を確認するかへ落とし込みます。数字の実績は対象と期間を確認し、想定効果を達成済みの実績として載せないでください。

Canvaなどを使ってランディングページを自分で作る方法

ランディングページは、HTMLやCSSを書かなくても作成できます。Canva、Studio、ペライチ、Wixなどのサービスを利用すれば、テンプレートをもとに自分でページを作ることが可能です。

ただし、ツールを選ぶときは見た目だけでなく、独自ドメイン、フォーム、アクセス解析、広告計測タグ、デザイン自由度などを確認します。

代表的なランディングページ作成ツール

各サービスの料金や機能は変更されるため、利用前に公式サイトで最新情報を確認してください。

自作が向いているケース

• まず小さく試してみたい
• 社内イベントや短期キャンペーンに使いたい
• ページの原稿や画像を自社で用意できる
• 複雑なフォームや外部システム連携が不要
• 社内で更新や改善を継続できる

制作会社への依頼が向いているケース

• 広告を継続的に運用する
• 問い合わせや売上につなげることを重視する
• 構成やコピーから相談したい
• オリジナルのデザインが必要
• フォームやCRMなど外部システムと連携したい
• 公開後のアクセス解析や改善も依頼したい

自作か制作会社かは、予算だけで判断する必要はありません。例えば、構成とデザインだけ外注して更新は自社で行う、デザインを自社で用意してコーディングだけ依頼するといった方法もあります。

企画や構成からまとめて外注したい場合は、LP制作代行・外注の費用相場と依頼先の選び方も参考にしてください。

ランディングページ制作の費用相場

ランディングページ制作の費用は、誰が作るか、どこまで依頼するかによって変わります。単純にページの長さだけではなく、構成、原稿、写真、デザイン、フォーム、広告計測なども費用に影響します。

ファーストネットジャパンのランディングページ制作も、基本的には20万円～50万円程度が目安です。実際の費用はページの長さ、原稿作成、撮影、フォーム、システム連携などの要件によって変動します。

制作費に影響する主な項目

• ヒアリング・企画
• 競合調査・ターゲット整理
• 構成・ワイヤーフレーム
• コピーライティング
• 写真撮影・画像制作
• デザイン
• コーディング
• フォーム
• GA4・広告計測設定
• 公開後の改善

見積もりを比較する場合は、総額だけで判断せず、原稿作成、スマートフォン対応、フォーム、修正回数、計測設定、公開後のサポートなどが含まれているか確認してください。

公開前に実際に操作して確認する項目

1. 広告やリンクの訴求と最初の画面の内容が一致している
2. スマートフォンで料金と対応範囲を読める
3. CTAから目的のフォームへ進める
4. 必須項目とエラー表示が分かり、送信できる
5. 管理者通知と自動返信が届き、案内が一致している
6. CTAクリックと送信完了の計測を区別して確認する

送信ボタンのクリックを問い合わせ完了として数えると、エラーで送れなかった操作まで含む場合があります。送信成功後の画面やイベントを確認し、二重計測がないか点検しましょう。公開後は訪問、CTA操作、フォーム到達、送信を段階に分けて改善します。

ランディングページのCVを改善するポイント

ランディングページのCV率は、業種、価格、流入元、広告キーワード、CVの内容によって大きく変わります。そのため「平均CV率は何％だから成功」という見方ではなく、自社ページのデータを継続して比較することが重要です。

ファーストビューを見直す

流入直後の離脱が多い場合は、最初にファーストビューを確認します。広告や検索結果で期待した内容と、ページを開いたときの内容が一致しているかを見直してください。

特に、誰向けなのか、何ができるのか、他社との違いは何かが一目で伝わるかを確認します。

ページの途中で離脱している場所を探す

ヒートマップなどを使えば、どこまでスクロールされているかを確認できます。重要な情報より前で離脱が多い場合は、文章量、情報の順番、見出し、図表などを見直します。

情報を削るだけでなく、ユーザーが知りたい情報を前へ移動することも有効です。

CTAの文言と位置を見直す

CTAがクリックされていない場合は、ボタンの色だけではなく、CTAの直前に十分な判断材料があるかを確認します。

例えば料金を知りたいユーザーに対して、料金説明がないまま「お問い合わせ」と表示しても行動しにくくなります。「費用と納期を相談する」のように、次の行動がわかる文言も検討します。

フォームの離脱を減らす

CTAはクリックされているのにフォーム送信が少ない場合は、フォームを確認します。不要な入力項目、わかりにくい必須表示、入力エラー、スマートフォンでの操作性などが原因になることがあります。

項目数は少なければよいとは限りません。営業に必要な情報を残しながら、問い合わせ前に不要な項目を減らします。

一度にすべてを変更しない

改善では、ファーストビュー、CTA、フォームなどを同時に大きく変更しないことも重要です。複数箇所を一度に変えると、どの変更が成果につながったのかわからなくなります。

データから仮説を立て、優先順位の高い箇所から一つずつ検証します。

BtoBのランディングページで意識したい3つのポイント

BtoBのランディングページでは、ページを見た一人の担当者だけで契約を決められないことがあります。担当者が社内で比較・説明することを前提に情報を設計する必要があります。

1. 担当者と決裁者の両方が判断できる情報を載せる

実務担当者は機能や進め方を知りたい一方で、決裁者は費用、導入効果、実績、リスクなどを確認します。どちらか一方だけではなく、社内検討に必要な情報をまとめておくことが重要です。

2. 問い合わせ以外の行動も検討する

高額なBtoBサービスでは、初回訪問から見積もり依頼まで進まないこともあります。サービス資料や事例など、検討初期でも利用しやすい情報を用意する方法があります。

ただし、一つのページにCTAを増やしすぎると目的が分散します。中心となるCVを決めたうえで補助導線を設計してください。

3. 会社の信頼性を具体的に伝える

BtoBでは「この会社に任せて大丈夫か」という確認も重要です。会社概要、所在地、創業年、制作実績、担当体制、事例など、確認できる事実を掲載します。

ファーストネットジャパンのランディングページ制作

ファーストネットジャパンは、1998年創業・大阪市中央区に拠点を置くWeb制作会社です。4,000件超の制作実績をもとに、ホームページやランディングページの企画・設計・デザイン・コーディングから、公開後のWebマーケティングまで一貫して対応しています。

ランディングページ制作では、最初にデザインを決めるのではなく、ターゲット、CV、商品・サービスの強みを整理したうえで構成を作ります。原稿が固まっていない場合も、ヒアリングをもとに必要な情報を整理するところからご相談いただけます。

また、公開後もアクセス解析や広告運用を行い、ランディングページを改善していくことが可能です。「新しくランディングページを作りたい」「既存ページから問い合わせが増えない」といった段階でも構いません。まずはお気軽にご相談ください。

会社概要

【関連記事】
ランディングページ制作を外注する費用と依頼範囲
CTAの文言・位置と改善方法
問い合わせを増やす改善手順

よくある質問

Q. 初心者はランディングページを何から作ればよいですか？

対象読者、悩み、判断してほしいこと、根拠、最優先の行動、問い合わせ前の不安の6項目を整理します。その後に構成と原稿を作り、デザイン、実装、公開前確認へ進みます。

Q. ランディングページの作り方はどの順番ですか？

目的とCVを決める、読者と比較項目を整理する、構成を作る、コピー・デザイン・実装を行う、公開して計測する、の5ステップです。デザイン前に読者の判断順を決めてください。

Q. ランディングページの構成に何を載せますか？

対象読者と課題、対応内容、確認できる根拠、費用条件、導入の流れ、質問への回答、申込み方法を載せます。商材によって順番は変えられますが、中心の行動を一つ決めることが基本です。

Q. ランディングページ制作の費用はいくらですか？

FNJでは20〜50万円を目安とし、要件・規模、原稿、撮影、フォーム、計測などの範囲によって変動します。自作ツールの利用料と、企画・制作・公開確認の作業費を分けて比較してください。

Q. 自作と制作会社への依頼はどう選びますか？

試験的な案内で自社に制作と確認の時間があれば自作を検討できます。広告運用、独自フォーム、計測、専門的な原稿・デザインまで必要なら、作業範囲を整理して制作会社へ相談します。

Q. 公開後は何を見て改善しますか？

流入元、訪問、CTA操作、フォーム到達、送信完了を段階に分けて確認します。ボタンクリックだけを問い合わせ完了として扱わず、一つの仮説に沿って変更と計測を記録してください。

まとめ｜ランディングページは5ステップで作り、公開後も改善する

ランディングページの作り方は、「目的とCVを決める→ターゲットと競合を整理する→構成を作る→コピーとデザインを作る→公開して改善する」という5ステップが基本です。

成果を出すために特に重要なのは、デザインから始めないことです。誰に何を伝え、どの行動をしてもらうかを決めてから構成を作ることで、ページ全体の訴求がぶれにくくなります。

Canvaなどを利用すれば自分で作ることもできますが、本格的に広告を運用する場合や、問い合わせ・売上を重視する場合は、構成やコピーを含めて制作会社へ相談する方法もあります。

ファーストネットジャパンでは、1998年創業・4,000件超の制作実績をもとに、ランディングページの企画・構成・デザイン・コーディングから公開後の改善まで対応しています。「何から準備すればよいかわからない」という段階でも、お気軽にご相談ください。

ホームページの新規制作・リニューアルを検討されていますか？

ファーストネットジャパンでは、1998年の創業から培ってきた知見・経験を基に、ホームページ作成・集客のお手伝いなど総合的にWebのお困りごとをサポートしています。
Webに関することならまずは当社にお問い合わせください。

実績豊富な
ホームページ制作会社なら
こちらをクリック

• #LP
• #WEB制作
• #ホームページ制作

この記事の監修者

齊藤 真也

株式会社ファーストネットジャパン 代表取締役

1998 年創業時からアプリ開発・Web マーケティング・フルリモート SES・ホームページ制作・翻訳・グラフィックデザインなど幅広い IT／クリエイティブ領域を手がけ、4,000 件超のプロジェクトを統括。セキュリティ対策・SEO・システム開発から中小企業のWeb戦略支援まで、技術とデザインの両面でクライアントの課題解決を27年以上にわたり支援してきた。
大阪本社・東京オフィスの2拠点体制で、全国の企業のデジタル化をサポート。
高松市出身。座右の銘は「圧倒的努力」。