ランディングページとは、インターネット広告で集客した見込み顧客を上手く口説き落として目的のゴール(商品購入や会員登録など)へ導くためのWebページです。ランディングページとはWeb業界では主に、本サイトとは違う1枚完結型ウェブページを指します。
狙ったターゲットユーザを口説き落とすことに特化したページであるため、ポイントをしっかり押さえて作ればWebマーケティングの成果を上げるための重要な施策となるでしょう。ここで、ランディングページを作る際に押えるべきポイントと秀逸な実例サンプルを紹介していきたいと思います。
(関連記事:5分でわかる! コンテンツマーケティングを学びましょう)
![](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,w_20,q_auto/blog_service/2021-05-15-hdzqthmvb26pfvbct3dqtg.jpeg)
![ランディングページの作り方 ランディングページの作り方](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,h_400,w_600,q_auto/blog_service/2021-05-15-hdzqthmvb26pfvbct3dqtg.jpeg 600w 400h, https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/blog_service/2021-05-15-hdzqthmvb26pfvbct3dqtg.jpeg 1200w)
- ランディングページとは?それのメリットは?
- ランディングページのデザインに押さえるべきポイントは何か?
- Strikinglyを使ったランディングページの制作について
1.ランディングページとは
ランディングページのランディング(landing)とは「着地する」という意味。つまり、ユーザーが最初に着地する、訪問するページのことをランディングページと言います。外部リンクやSNS、QRコードなどから遷移して最初に訪問するページのことです。
ランディングページは、ユーザーの知りたい情報をストーリー展開を意識して制作します。そのため、基本的には商品紹介や口コミ、問い合わせ、資料請求、購入ボタンなどがすべて1つのページに収まっています。ページを見たユーザーは、商品のキャッチコピーから商品説明、口コミ、効果など順を追って見ていくことになり、さまざまな不安を一つ一つ解消しながら読み進めることができるため、接客販売されているかのような気持ちで閲覧することができ、コンバージョン率を高められます。
(関連記事:基本的な操作まだわからないなら、こちらの記事をご覧ください)
2.ランディングページのデザインに押さえるべきポイントは何か?
- レイヤー感を出す
ログインインターフェイスをデザインするときは、さまざまな色、レベル、さまざまなセクションのコントラストを使用して、優れた視覚効果を実現できます。たとえば、ランディングページのボタンを黒にデザインし、背景を次のようにデザインできます。黒と対照的な白。これにより、ユーザーはWebページのコンテンツを簡単に確認でき、ユーザーはさまざまなセクションを簡単に行き来することができます。
![](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,w_20,q_auto/blog_service/2021-05-15-qctcawl2u_wyj8iapytqtw.jpeg)
![レイヤー感を出すデザイン レイヤー感を出すデザイン](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,h_400,w_600,q_auto/blog_service/2021-05-15-qctcawl2u_wyj8iapytqtw.jpeg 600w 400h, https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/blog_service/2021-05-15-qctcawl2u_wyj8iapytqtw.jpeg 1200w)
Strikinglyのユーザーから受けた画像
また、写真ブログを始めようと思っている方、こちらの記事もお役に立てるかも。
- 簡潔なデザイン
初めてのウェブページにたどり着いて、ランディングページにある煩雑なほどさまざまなコンテンツをみたユーザーはさぞ億劫な気持ちでしょう。必要以上の説明は往々にして逆効果でしかありません。ランディングページのメイン画像や商品紹介に使われるキャッチコピーなどの目的は、「一瞬で閲覧者に興味を抱かせる」ことです。シンプルで魅力的なキャッチコピーで注意を惹き、競合他社と差をつけましょう。
![](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,w_20,q_auto/blog_service/2021-05-15-7g1jy_zsvchevmunvlscvq.jpeg)
![簡潔なデザイン 簡潔なデザイン](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,h_400,w_600,q_auto/blog_service/2021-05-15-7g1jy_zsvchevmunvlscvq.jpeg 600w 400h, https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/blog_service/2021-05-15-7g1jy_zsvchevmunvlscvq.jpeg 1200w)
Strikinglyのユーザーから受けた画像
- 必要のないリンクを減らそう
顧客のさまざまなニーズを満たすために、多くのリンクを追加したくなりますよね。ユーザーはこれらのリンクから必要な情報を見つける場合もありますが 、不本意に間違ってページを離れる場合もあります。ストレスなくサイトを閲覧していただくには、ページのリンクを本当に必要な分だけにとどめておきましょう。
慣れてきたら、Strikingly ブログの方でWebサイトを彩る様々なノウハウもチェックしましょう。
![](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,w_20,q_auto/blog_service/2021-05-15-2odm1hjlrcqw1760yeln9w.jpeg)
![リンク数を抑える リンク数を抑える](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,h_400,w_600,q_auto/blog_service/2021-05-15-2odm1hjlrcqw1760yeln9w.jpeg 600w 400h, https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/blog_service/2021-05-15-2odm1hjlrcqw1760yeln9w.jpeg 1200w)
Webサイト表示速度の高速化
ビジネスや趣味に多忙な現代人にとって、閲覧しているWebサイトが速く立ち上がれば、時間の節約になります。特に外でスマホを使って検索している時などは、ページの読み込みが遅いとすぐに他のサイトに移動してしまうこともあるでしょう。これらから分かるように、Webサイトにとって表示速度は大変重要です。
ここでは、プロクオリティにも対応する無料のWebサイト制作ツールStrikinglyをお勧めします。シンプルな操作でより短い時間、より少ない労力でWebサイト制作が可能です。プログラミングの知識がゼロでもかまいません。
また、StrikinglyのWebサイト最適化機能は、Webサイト表示速度の高速化に対応するので、ユーザーに快適なWebブラウンジンぐを提供できます。
最新のWebデザインのトレンドが気になるなら、ここをクリックしてチェックしましょう。
3.Strikinglyを使ったランディングページの制作について
初めての方は、StrikinglyのHPに登録のフォームがありますので、メールアドレスからすぐおつくりになれます。また、Facebookのアカウントをお持ちならば、そのままStrikinglyにログインできます。
![](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,w_20,q_auto/blog_service/2021-05-15-vjlgpwhjgrwzrksw-q8ksw.jpeg)
![null null](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,h_400,w_600,q_auto/blog_service/2021-05-15-vjlgpwhjgrwzrksw-q8ksw.jpeg 600w 400h, https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/blog_service/2021-05-15-vjlgpwhjgrwzrksw-q8ksw.jpeg 1200w)
Strikinglyの商品から受けた画像
ランディングページに限らず、新しいページを作成したいなら、最初はイメージに近いテンプレートを選びましょう。Strikinglyのテンプレートライブラリーは多様なテンプレートが用意されておりますので、通販サイトやポートフォリオサイト、そして企業HPなど対応できます。
![](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,w_20,q_auto/blog_service/2021-05-15-qm3aejip8dz4nbn4u8twfa.jpeg)
![テンプレートライブラリー テンプレートライブラリー](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,h_400,w_600,q_auto/blog_service/2021-05-15-qm3aejip8dz4nbn4u8twfa.jpeg 600w 400h, https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/blog_service/2021-05-15-qm3aejip8dz4nbn4u8twfa.jpeg 1200w)
Strikinglyの商品から受けた画像
テンプレートを選びましたら、各セクションをカスタマイズしたり、追加・削除したりすることで、目標のデザインに仕上げて行きましょう。また、Strikinglyはドラッグ&ドロップで編集できますので、直観的にサイトのレイアウトを調整することも簡単にできます。
![](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,w_20,q_auto/blog_service/2021-05-15-pncjow2upiomzdvo5wy9zw.jpeg)
![セッションの追加・削除 セッションの追加・削除](https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/c_limit,f_auto,fl_lossy,h_400,w_600,q_auto/blog_service/2021-05-15-pncjow2upiomzdvo5wy9zw.jpeg 600w 400h, https://user-images.strikinglycdn.com/res/hrscywv4p/image/upload/blog_service/2021-05-15-pncjow2upiomzdvo5wy9zw.jpeg 1200w)
Strikinglyの商品から受けた画像
以上は、ランディングページの制作について簡単に説明しました。お役に立てば幸いです。今、Strikinglyにメンバー登録すれば、14日間の無料トライアルがお試しできます。ぜひ、お試しください。
アプリに着陸ページが必要なのはなぜですか?この記事が答えを教えてあげる。
ご質問などございましたら、support@strikingly.comの方までお問い合わせください。