LPの作り方&基本の手順とは? 成果を出すポイントを制作会社が解説|東京のWEB制作会社・ホームページ制作会社|株式会社GIG

LPの作り方&基本の手順とは? 成果を出すポイントを制作会社が解説

2023-01-14 制作・開発

現代は「広告社会」ともいわれ、1日を通して広告を見ない日はほとんどありません。特にインターネット広告の量が増えたことは、ユーザーの「広告慣れ」につながっており、広告を使って成果を上げることが難しい状況にあります。

そんな状況下では、Webサイトへの訪問者が一番最初に目にする「LP(ランディングページ)」の完成度を高めることが、マーケティング成功の重要なポイントになります。しかし、いざLPの制作を任されても、「どのようにして効果の出るLPを制作すればいいのか分からない……」と悩んでしまう方も多いのではないのでしょうか。

そこで本記事では、LP制作における準備から制作の流れ、そして制作のポイントについて紹介します。

LPとは

LP(Landing Page:ランディングページ)とは、検索結果や広告などによってユーザーが最初にアクセスするページのことです。最初にユーザーが着地(land)することが由来なので、Landing Pageという名前がついており、略してLPと呼ばれています。

LPという言葉本来の意味は、「ユーザーが最初にアクセスするページ」のことなので、検索結果から直接「お問い合わせ」ページにアクセスした際は、このお問い合わせページがLPになります。

しかし、実際にこういった意味で使われることはほぼなく、「LP」と言う場合には専用の「広告をクリックした際に最初に表示される集客用ページ」を指すと考えても構いません。

▲LPの一例(出典:Workship)

LPの基本的な作り方 7ステップ

それではここからは、LPの基本的な作り方について解説を行います。LPの作成手順として、以下の7ステップに大きく分けて解説を進めます。順次確認していきましょう。

1. ゴールや目標を設定する(KGI・KPIの設定)

2. ペルソナを設定する

3. 内容を決める(結 → 起 → 承 → 転)

4. 構成図(ワイヤーフレーム)を作成する

5. 記事や画像などのコンテンツを作成する

6. コーディングする

7. 公開後に効果測定を行う

1. ゴールや目標を設定する(KGI・KPIの設定)

LP作成にあたっては、はじめにゴールと目標を明確に設定するところからがスタートです。

「LPを使って最終的にどのような成果を出したいのか」、つまりLP制作の目的についてしっかりと検討しましょう。

たとえば、自社の英会話教室の利用者を増やしたいと考えたとき、LP制作の目的は当然「英会話教室を利用してもらうこと」になるでしょう。

そして、この目的を深掘りしていき、LPの制作に必要な情報を具体化させていきます。英会話教室の売上はどの程度を見込むのか、見込める売上を出すためにLP制作に予算をいくらかけられるのか、どの業者に外注して制作してもらうのか……。

このように、ゴールや目標がハッキリとなれば、LP制作を行うイメージがしやすくなります。

また、ゴールと目標を決める際に欠かせないものに、「KGI」と「KPI」がそれぞれ存在します。KGI(Key Goal Indicator)では、最終的に達成したい重要目標を、KPI(Key Performance Indicator)では、その過程で達成したい中間目標を決めていきます。これらを上手に活用することで、LP制作の目標などがより明確となり、作業の方向性も定まってくるはずです。

関連記事:KPI分析とは? 必要性・メリット・分析ステップを解説

2. ペルソナを設定する

LP制作の目的が明確になれば、次にペルソナを設定します。ペルソナとは、LPを閲覧する想定ユーザーの人物像のことを指します。

上の例でいうと、英会話教室のLPを訪問するユーザーの人物像をできるだけ詳細に設定していきます。

・28歳、東京都目黒区在住の一人暮らし

・大手日系企業に勤務するが、転職も視野

・ビジネススキルの習得に前向きで、収入もある

・英語の読み書きは普通にできるが、英会話経験はほとんどない

・SNSをよく利用し、ビジネス関係の情報を収集している

こちらはあくまで簡易版ですが、ペルソナは具体的に設定することが大切です。ターゲットとなる人物像がハッキリすることで、LPの内容が決めやすくなるからです。

関連記事:ペルソナ設計とは? 設計の方法から分析、ワークショップ、事例までを徹底紹介

3. 内容を決める(結 → 起 → 承 → 転)

ペルソナが決まれば、次はLPの内容を決めていきます。LP作成で肝となるのが、「ストーリー性」があるかどうかです。LPに関するストーリーは2種類あり、検索に至るまでのストーリーと、LPが実際にユーザーから見られる際のストーリーに分けられます。

ここまで解説した目的とペルソナを組み合わせて考えてみると、ユーザーが検索によってLPにたどりつくまでのストーリーは下記のようなものになるでしょう。

起:外資系企業への転職などを考えたとき、英会話ができないと厳しい……

承:英会話教室で英会話を学んでみよう!

転:なるべく短期間で集中的に英会話をモノにしたい!

結:「英会話教室 1ヶ月」で検索してみよう!

上記のストーリーが想定される場合、LPのなかでユーザーにはじめて伝えるべき情報は「結」の部分です。ユーザーは英会話の必要性を理解しているため、「起」をページ内の上に表示しても、「そんなのもう分かってるよ!」と思われてしまいます。

そのため、LPのなかのストーリーは、「結 → 起 → 承 → 転」という順番にするのが望ましい構成といえます。

4. 構成図(ワイヤーフレーム)を作成する

次にワイヤーフレーム(全体のレイアウトを定めたLPのデザイン構成図)を作成する工程に移ります。ユーザーの興味や関心を惹くデザインにするためには、最初に与える印象がとくに大切です。そのため、以下の要素をファーストビューに盛り込むことを意識してみましょう。

・キャッチコピー:魅力的な言葉でユーザーの注意を引き、サービスや商品の価値を伝える

・メインビジュアル:視覚的に訴求力のある画像や動画で、サービスの特徴や利点を伝える

・権威付け要素:専門家やメディアの評価、受賞歴などを掲載する

・アクション導線(CTA):適切な場所に配置し、CV(成約や問い合わせ)を実現させる

では、「英会話教室」のLPを作成すると仮定して解説を進めます。

・キャッチコピー:たった30日で英会話が身につく!効果実証済みの英会話教室

・メインビジュアル:英会話に強そうなビジネスマンを写した画像

・権威付け要素:2022年英会話教室の顧客満足度第1位

・CTA:「無料トライアル申し込み」ボタンをファーストビューの目立つ場所に設置

こういったメッセージを、自社サービスの強みやユーザーのストーリーを踏まえたうえで作成することが大切です。

5. 記事や画像などのコンテンツを作成する

LPでユーザーが実感できる効果を具体的に伝えるためには、記事や画像などのコンテンツを掲載することはもちろん、以下の要素を含めるとより効果的です。

1. 効果説明:サービス、商品の具体的な利点などを数字や事例で示す

2. 利用者の声:実際にサービスを利用した人の感想や成功事例などを紹介する

3. 流れ(期間、手順):サービスの具体的な利用手順などを紹介する

4. FAQ:よくある質問と回答を掲載し、ユーザーの疑問を解消する

5. フォーム:ユーザーにストレスを与えない設計にする

それでは英会話教室を例にして、以下のようなカタチに落とし込んでみましょう。

1. 効果説明:受講生の95%が英会話力を向上させ、スムーズな英会話ができるように!

2. 利用者の声:このレッスンを受けてから、英語でのコミュニケーションが楽しくなりました! 先生も親切で、自信を持って英語が話せるようになりました

3. 流れ:「無料トライアル申し込み→希望のレッスン日時を選択→専属の英会話講師とオンラインでレッスンがスタート」

4. FAQ:「初心者でも大丈夫ですか?」「初心者向けのカリキュラムも用意しておりますので、安心してご利用いただけます」

5. フォーム:必要最低限の入力項目を設定し、送信後には「送信完了」メッセージを表示

こちらも、自社サービスの強みやユーザーのストーリーを意識しながら作成していきましょう。

6. コーディングする

LPのストーリーやコンテンツが固まったら、いよいよコーディングです。コーディングの工程では、HTMLやCSS、JavaScriptなどを駆使して作業を進めます。

モバイルファーストの考え方を取り入れ、スマートフォンやタブレットなどのデバイスでの表示にも意識しましょう。

また一工夫として、CTAボタンをクリックした際、フォームまで自動でスクロールされるように設定しておくと効果的です。ユーザーがページ内で迷子になることを防ぐのにも役立ち、スムーズなCVにつながるはずです。

7. 公開後に効果測定を行う

LPを公開した後は、コンバージョン率やアクセス解析などのデータをもとに、ユーザーの行動や反応を把握し、必要に応じて改善対応を行っていくことが重要です。

たとえば、「ボタンの色を変更してクリック率を向上させる」「見出しを修正して理解度を高める」などの修正が考えられるでしょう。

LPはリリースすればそれで終了ではありません。最適化を続けることで、効果も最大化されます。そのため、定期的にデータを分析し、ユーザーのニーズに合わせてデザインやコンテンツを改善していくことが求められます。

成果の出るLP制作のポイント・注意点

ここまで、LP制作における具体的な制作の流れについて説明しました。

最後に、LP制作で成果を出すためのポイントや、失敗しないための注意点についても解説を進めます。

ポイント1. ファーストビューにこだわる

一般に、LPに訪れたユーザーの70%~90%は、一度もページをスクロールせずにページを離れるといわれています。つまり、ユーザーに表示される最初の画面(ファーストビュー)の時点でユーザーの心をつかむ必要があるのです。

ユーザーが離れないためにも、LPを開いてすぐに表示される画面(ファーストビュー)には特にこだわるようにしましょう。

具体的には、「商品の強みやメリットが一目でわかるようにする」「キャッチーな画像などを配置する」「洗練されたデザインでユーザーの目をひく」などの対応が考えられます。

ポイント2. テキストを詰め込み過ぎない

ユーザー離れを防ぐためには、ファーストビューにこだわると同時に「テキストを詰め込みすぎない」こともおすすめです。

通常のWebページでも同じですが、スマホなどの普及によって画面に表示される情報量が減ったため、画面を文字で埋め尽くすと「パッと見て何が言いたいかよくわからない」とユーザーが離れてしまう確率が高まります。

商品やサービスへの思い入れから、ついLPにはたくさんのメッセージを込めたくなるもの。しかしテキストの詰め込みすぎは逆効果なので、情報の取捨選択が大切です。

ポイント3. 構成作りではストーリー性を意識する

LPの内容構成では、単に商品やサービスの説明を並べるのではなく、ユーザーにとってのストーリー性を意識し、「結 → 起 → 承 → 転」の流れで作成することが望ましいとされています。

商品の強みを全面に押し出すのではなく、ユーザーの悩みに沿った内容を提示し、安心感を持って購入や問い合わせができるような構成にすることが大切です。

LPには、「共感→ベネフィット→実績・事例→お客様の声→特典による検討強化→クロージング」といった基本的な流れも存在します。

この流れの中で、テキストを詰め込み過ぎるのではなく、図やイメージを使った、視覚的に理解しやすくすることも不可欠です。ストーリー性のある展開で、ユーザーの興味や関心を引き付けていきましょう。

ポイント4. 集客についても計画しておく

LPを作れば、それだけで見込み客が集まってくるわけでは当然ありません。Webページに訪問してもらい、そこから興味・関心を惹くための集客作りも重要となります。

集客方法には、検索エンジンにおける自然検索、検索結果画面に表示させるリスティング広告、SNSによる拡散、SNS広告などが挙げられますが、どのような集客を行うのが、自社にとってベストなのか、あらかじめ計画しておきましょう。

ポイント5. 効果を測定して改善しつづける

繰り返しにはなりますが、LPでは効果測定が特に重要になります。目的やペルソナをきちんと設定し、ファーストビューにこだわったLPでも、公開後の効果測定や改善の状況によって生まれる成果は全く変わってしまいます。

効果測定にあたっては、Google Analyticsなどの解析ツールや、専用のLPOツールを使うのがおすすめ。

ただ、「解析結果の見方が分からない」「結果を見ても修正箇所がわからない」という方は、効果測定のみを外注する、プロのコンサルティングを受けるといった選択肢も考えられます。

LP制作はGIGにおまかせください

今回の記事では、LP制作の準備から具体的な制作の流れ、そして成果を出すためのポイントについて紹介しました。

GIGには、LP制作だけにとどまらないWebマーケティングの豊富な実績があります。そうしたノウハウに基づき、本記事で紹介したLP戦略の立案やLPそのものの制作、LPの改善まで総合的にサポートいたします。

無料相談も承りますので、お気軽にお問い合わせください。


ランディングページ制作・LPO|東京のWEB制作会社・ホームページ制作会社|株式会社GIG

株式会社GIGが提供するランディングページ制作・LPOのページです。東京を拠点に、WEBサイト制作やホームページ制作、メディアサイトの企画・制作・運用、WEBマーケティング、システム開発、体制構築、及び人工知能をかけ合わせたライフスタイル領域のサービスを開発しています。

giginc.co.jp

og_img

WebやDXで困っている方、お気軽にご相談ください

GIG BLOG編集部

株式会社GIGのメンバーによって構成される編集部。GIG社員のインタビューや、GIGで行われたイベントのレポート、その他GIGにかかわるさまざまな情報をお届けします。