fbpx

ランディングページ(LP)のデザインする時の5つのコツ

友だち追加
読みにくい場合でも、音声で聞いてみると意外とわかりやすいかもしれません。
  1. ランディングページで案内したい商品・サービスがある
  2. けど、デザイン経験も知識もない
  3. だから、簡単にデザインのコツを知りたい

今回はこのような悩みを抱えている方に向けて紹介しています。

  • 前半は「ランディングページのデザインのコツとは」
  • 後半は「実際にランディングページを作成できるWebツール」

をご紹介します。

デザイン経験のない方でも、すぐに実践できるような工夫です。

「デザインって、センスや経験が必要じゃないの?」

デザインと聞くと、こんなことを考える方も多いです。

確かに、ウェブデザイナーという職業があるくらいですから、

  1. 人々を感動させて魅了したり、
  2. 芸術的なデザインだったり、
  3. ゴージャスなデザインは、

デザイン経験のない、知識不足の私たちには不可能ですが、
文章を読みやすくすることはできます。

つまり、可読性を上げる工夫は、コツさえ知っていれば、経験がなくてもできてしまいます。

こういった工夫も、一種のデザインといえます。
必ずしも、優れたデザインである必要はありません。

具体的には、以下の工夫になります。(コピーライティングのNot Read対策)

1)適度な改行を入れる

もしも、小説の改行が1つもなかったとしたら…
いくら村上春樹さんや、東野圭吾さんが書いた小説でも読みたい気持ちになりませんね。

これは、ランディングページでも同じです。

いくら素晴らしいコピーライティングを書いたとしても読みにくいのは、普通にもったいないです。
文章は1段落2〜3行に収めて適度に改行をいれましょう。
適度な改行で文章を見た時に、きれいな印象を与えます。

すると、読み手の負担も減りますよ。人の脳は、理解しにくい文章は排除するという機能があります。

2)強調箇所は太字にする

どの文章にも「ここは声を大にして言いたい」という自分なりの思い入れのある文章・単語があります。

その文章・単語を、太字にして強調しまししょう。
ただし、太字にしすぎるのは避けましょう。

強調箇所が流し読みでも目立つように、あくまで最低限にです。

3)イメージ画像を配置する

文章をイメージしたような画像を配置すると見栄えがよくなります。

また、理解度も変わります。

無料でも、ダウンロードできるサイトはたくさんありますので、イメージ画像を適度に配置しましょう。

商用利用可能な素材サイトを活用しましょう。(例えば、Adobe Stock

4)自分もしくは自社の雰囲気が伝わる画像を配置

先程のイメージ画像とは別で、自分の雰囲気が伝わるような画像をプロフィール文と共に配置した方がいいです。

特にウェブなので、この要素は絶対に必要です。

例えば、講師の雰囲気がわからないのに、セミナーに申し込むのは、少し怖いですよね?

  1. だれがやっているセミナーなのか?
  2. どんな雰囲気の人なのか?

は、気にする要素です。

プロフィール画像の他にも、組織であれば雰囲気がひと目で伝わる画像も良いです。

特に料理教室やパン教室は、この「雰囲気」が伝わらなければ応募につながらないかもしれません。

私の場合だと、イベントページを固定ページで作成します

「金魚写真アート展」を開催させていただいているのですが、イベントページの一番上、ヘッダーに、過去に開催した会場の写真を使用しています。作成したら、このイベントページを告知するだけなので、それほど難しくはありません。

新宿マルイ本館地下一階で開催

5)申し込みを迷わせない工夫

「申し込み」はランディングページの一番の目的です。

なので、重要なのは言うまでもないですね。

この申し込みを迷わせない工夫が大事です。

例えば、申し込みフォームへ移動させるボタンを

  1. ヘッダー画像のちょうど下
  2. 追伸要素
  3. 価格要素

といった各要素に配置するなどですね。

ボタンの要素例(リンクはありません)

以上、5つの工夫でした。

すぐにでも実践できるので、ご参考にしてください。

後半は、ランディングページ制作のWebサービスをご紹介いたします。

前半では、デザインの工夫点・コツをご紹介しました。

ランディングページ全体のデザインは、これからご紹介するWebサービスでデザインすると大変効率的です。

これらのWebサービスには、あらかじめテンプレートやデザインの要素が用意されています。

テンプレートを開発しているのは、いずれもプロのWebデザイナーであることがほとんど。
なので、一からデザインする必要がありません。

もちろんスマホ表示も対応していますから、余計な心配も必要なしです。
コンテンツに集中できる点がメリットですね。

以下、ランディングページ制作の方法になります。

ペライチ

ペライチhttps://peraichi.com/

ランディングページ作成ツールとして有名なのがこの「ペライチ」というツールです。

こちらもデザインテンプレートが豊富なのと、決済機能といった機能面も豊富です。日本のツールなので安心して使えるツールです。

初心者でも使いやすいツールですので、ぜひ利用してみてほしいです。

試しに1ヶ月間無料で利用できますよ。

Colorfulテーマ

カラフルhttps://lptemp.com/

Webマーケッターがよく使うColorfulテーマです。

マーケティングに有効なカウントダウン機能があり、期限内での申し込みを促すことが可能です。

他、ページ作成の上限はなく、量産させることが可能です。

有料ですが、買い切りなので、効果的にウェブマーケティングを実践する為の投資だと思ってください。

注意点として、初心者向けではありません。

中級者〜上級者向けで、画像編集やHTML・CSSの知識がある方向けです。

WordPressの固定ページ(クラシックエディタの場合)

WordPressの固定ページでもランディングページは作成できます。

現在では、ショートコードというデザインを簡易的にできるコード(クラシックエディタの場合)があります。

そのショートコードでは予めデザインされた要素を使用する事ができます。

ショートコードは、有料テーマで使えることが多いです。

また、有料テーマは(取扱説明書)情報量も多いので、編集方法もみなさんが思っている以上に、簡単にわかりますよ。

それぞれのテーマの公式サイトやマニュアルをチェックしてみてください。

WordPressの固定ページ(ブロックエディタの場合)

最近のWordPressはブロックエディタがデフォルトです。

その為、ブロックエディタでの編集を考えて作られたWordPressテーマも多いです。

テーマ依存になりますが、このブロックエディタでのデザインがかなり豊富になっています。

なので、ブロックエディタを活用したランディングページ作成も非常におすすめですよ。

まとめ

今回は「ランディングページでデザインをするポイント」についてお伝えさせて頂きました。

「シンプル・イズ・ベスト」という言葉がありますが、ランディングページもやりすぎない程度のシンプルなデザインが一番です。

ちなみに、前半の5つポイントはランディングページのみに限らずにWebサイトやブログにも当てはまりますよ。

今回のは割と初心者向けな内容でまとめてみました。

いわさきじゅん

スクエアシンク・インターナショナル株式会社代表。主にひとり経営者のために、ウェブ広告を使った自動化戦略の構築をサポートしています。

友だち追加

関連記事