記事LPのデザイン事例一覧とデザインで気をつけるべきことを紹介

記事LPには通常のLPとは違ったデザインセンスが求められます。

デザインに拘っていなかったり、通常のLPと同じノウハウでデザインをしたりすると、うまく成果に繋がりません。

そこで今回は、記事LPのデザイン事例4つと記事LPのデザインにこだわるべき理由、記事LPのデザインで気をつけるべき7つのことについてまとめました。

初心者の方でも分かりやすいように、専門用語は極力使用せずに解説しています。

記事を最後までチェックすれば、記事LPのデザインに関することがひと通り分かり、記事LP制作を一歩前進させられますよ。

「そもそも記事LPと通常のLPって何が違うの？」という方は以下の記事からご覧ください。

関連記事：記事LPとは？成功事例や勝ちパターン、テンプレートを初心者向けに解説

記事LPのデザイン事例一覧

ここでは、以下4つの記事LPのデザイン事例を紹介します。

• Kirei.news
• BODYMAKE
• 限定おかし情報局
• 百光 別誂

どんなデザインでどんな工夫が為されているのかなどを詳しく見てみましょう。なお「ここはこうした方が良い」という改善点についても記載していきます。

Kirei.news

こちらは、毛穴ケア用化粧品の記事LPです。

よくある一般の記事のように、毛穴の原因や対策方法について解説をした後、記事の末尾で毛穴ケア用化粧品を訴求しています。売り込み感が少なく、自然と商品を紹介する流れを作れている点が本記事LPの素晴らしい点です。

また、画像・イラスト・箇条書きを文章の間に挟むことで、ユーザーがスムーズに記事LPを読み進められるようになっています。

また本来フリー画像は使用しない方が良いのですが(理由は記事後半で解説)、記事の内容とフリー画像が綺麗にマッチしているため、問題ないでしょう。

BODYMAKE

こちらは、補正下着に関する記事LPです。

30歳を過ぎて体型が気になり出した女性に対して、冒頭から補正下着を訴求しています。

本記事LPは、体験記事形式となっており、自然と読み進めやすくなっている点がポイントです。また、オリジナルの画像が豊富に使われているなど、ユーザーに納得感を高める工夫が凝らされています。

しかし黄色のマーカーで装飾されている文章が多過ぎて、どこが大事な箇所なのかがわからなくなってしまっている点が惜しいです。マーカーを引く際は、大切な箇所にのみ装飾を施すとより効果的です。

限定おかし情報局

こちらは、最高級ポテトチップスに関する記事LPです。

「限定お菓子情報局」というお菓子に特化したメディアが、最高級ポテトチップスがどんな商品なのかについて、画像や具体的な数字を使って解説しています。

記事LPでも通常のLPでも、抽象的な表現ではなく具体的な数字を使うことは大切です。数字を使うことで商品の魅力を正確に伝えられます。

また「今金男しゃく 予約サイトはコチラ」のCTAボタン付近に「⚪︎日まで」のような期限を記載することで「今予約しなきゃ」という心理が働き、コンバージョン数のアップが期待できます。

百光 別誂

こちらは、日本酒に関する記事LPです。

商品のパンフレットをそのまま記事LPに落とし込んだような語り口で、高級感を演出しています。

また、限定500本で24時間以内に完売したことや数々の賞を受賞歴を記載することで、商品の希少性や権威性をアピールしている点も特徴です。

記事LPのデザインにこだわるメリット

記事LPでは、ライティングのみならず、デザインにもこだわることが大切です。

記事LP制作のデザインにこだわることによって得られるメリットは以下の2つです。

• 離脱率の低下に繋がる
• 読了率が上がる

それぞれ詳しく見てみましょう。

離脱率の低下に繋がる

記事LPのデザインにこだわることで、ユーザーに「面白そうな記事だな」「知りたいことが書いてありそうだな」と思ってもらえれば、ユーザーがLPを読み進めてくれるため、離脱率の低下に繋がります。

ユーザーは記事LPに、Web広告等を通じてアクセスします。そしてWeb広告は、クリックされたり表示されたりするたびに広告費用が発生しますよね。

例えばリスティング広告経由で記事LPにアクセスをしたユーザーが「なんだこのLP、セールス感満載のページだな」と感じて離脱をしたとしましょう。その場合、そのユーザーがリスティング広告をクリックしたことによって発生する広告費は無駄になってしまいます。

記事LPのデザインを整えることで、離脱率を低下させることができます。

読了率が上がる

記事LPのデザインにこだわることで、ユーザーの読了率が上がります。つまりユーザーが記事LPを最後まで読んでくれるようになります。

記事LPは通常LPへ遷移させる役割があるため、ここでユーザーの興味や期待感を高められることで、最終的な商品・サービスの購入率が上がります。

反対に、デザインに怪しさや不信感があると、商品・サービスを知ってもらうことすらできない、もしくはイメージががた落ちしてしまう可能性があるため注意が必要です。

例えば文字ばかりの記事LPだったり、フリー素材のような画像しか使われていない記事LPであれば、ユーザーは不信感を抱き、途中で離脱してしまうでしょう。

そうならないように、デザインにこだわることが大切です。

記事LPをデザインする際に気をつけるべきこと

記事LPのデザインは、通常のLPと比べて質素なものになりやすいです。だからこそ、記事LP制作時にはデザインに注意を払う必要があります。

記事LPをデザインする際に気をつけるべきことは以下の7つです。

• 色は統一感を持たせる
• 文章はできるだけ短くする
• 太字やマーカーを使う
• イラスト・画像・図表を多用する
• 画像は素人感を出す
• 適度に改行をする
• CTAボタンとマイクロコピーは特にこだわる

それぞれ詳しく見てみましょう。

色は統一感を持たせる

記事LPに使用する色には、統一感を持たせましょう。また商品・サービスのイメージに合わせたり、色の相性を考えたりといった工夫も必要です。

色がバラバラに使われていると「見づらいから最後まで読みたくない」「なんか怪しいから他のものを探そうかな」といった印象をユーザーに与えてしまいます。

人気のある商品やサービスの記事LPを見た際に「色の統一感があって読み進めやすいな」という印象を抱いた方も多いのではないでしょうか。反対に赤・青・緑とさまざまな色が使われたLPや記事LPを見て「悪徳業者っぽいな」のようなマイナスイメージを抱いた方もいるはずです。

記事LPの配色に自信が無い場合は、初期設定の色から大きな変更を加えないようにしましょう。

文章はできるだけ短くする

記事LPでは、ブログ記事のように文章量が多くなります。長い文章をユーザーにスムーズに読み進めてもらうために欠かせないのが、文章の短さです。

長い文章はユーザーにストレスを与え、離脱の原因になります。「この記事LPちょっと読みづらいな」と思われるだけで、簡単に離脱をされてしまいますからね。

以下、長くて読みづらい文章の例です。

最新のトレーニング機器やプロのトレーナーが揃っており、充実したフィットネスプログラムが用意されている、是非一度お試しいただきたいスポーツジムがございます。

上記文章を短く区切ると以下のようになります。

〇〇ジムには最新のトレーニング機器やプロのトレーナーが揃っています。また充実したフィットネスプログラムもございます。ぜひ一度〇〇ジムをお試しください。

例えば自己啓発本は、誰もが読みやすいように極端に文章の長さが短くなっているものも多いです。

文章はできるだけ短くしましょう。「、」を「。」にして文章を分けられないか、文章ではなく箇条書きや図表にできないかなどを考えてみてください。

具体的な文字数としては、一文を40〜60文字に抑えることで、ユーザーにスムーズに文章を読んでもらいやすくなります。

太字やマーカーを使う

記事LPにて数千文字単位のライティングを行っても、ユーザーが端から端まで文章を読んでくれることはほとんどありません。

ユーザーの大半は、文章を流し読みします。

太字やマーカーは、文章を流し読みしているユーザーに大切な箇所を伝える際に役立ちます。極端な話、太字やマーカー部分だけを読んでも記事LPの要点が掴めるような状態を目指しましょう。

以下、マーカーを引いていない文章とマーカーを引いた文章の比較です。

• 商品Aの最大の魅力は、場所を問わずどこでも使用できる点です。
• 商品Aの最大の魅力は、場所を問わずどこでも使用できる点です。

マーカーを引いた文章の方が、要点が分かりやすいですよね。

しかしマーカーの色を何色も使ったりすると、何が何だか分からない、まとまりのない記事LPが出来上がってしまいます。

おすすめは、太字とマーカーの1〜2色による装飾です。例えば本記事でも、大事な箇所は太字、特に大事な箇所は黄色のマーカー、大事かつマイナスの情報は赤字で装飾をしています。

また太字やマーカーを多用しすぎると、どこが大事なのか分からなくなってしまいます。よって本記事のように「太字とマーカーは見出しにつき1つずつ」のようなルールを設けると良いでしょう。

イラスト・画像・図表を多用する

記事LPには、イラスト・画像・図表のような文字以外のコンテンツを多用しましょう。

まるで論文のように、文字だけがぎっしりと表示された記事LPだと、ユーザーは読む気を失って離脱してしまいます。

程よいタイミングでイラスト・画像・図表が登場することで、記事LPの読みやすさはグンと増します。

記事LPにおいては、画面全体が文字だけで埋め尽くされる状態は避けたいところです。パソコンのみならずスマホで記事LPを表示した際も画面全体が文字だけで埋め尽くされることがないように、意識をしてみてください。

イラスト・画像・図表の作成には手間やコストがかかり大変ですが、それに見合った効果を期待できます。

画像は素人感を出す

記事LPも通常のLPと同じように、画像を多用した方が効果的です。文字だけでなく画像もあった方が、ユーザーが商品やサービスについてイメージしやすいですからね。

しかし記事LPにおいては、通常のLPのような綺麗な画像はあまり求められません。カメラマンが撮影したような画像よりも、一般のユーザーが撮影したような、リアリティのある画像が求められます。

例えば「この婚活サービスを使って結婚しました」という内容の記事LPに、まるでモデルのような男女の写真が掲載されていたらどうでしょうか。

• 「どうせ作り話なんだろうな」
• 「リアルじゃないな」

上記のように思われるはずです。

どこにでもいるような普通のカップルの何気ないデートの写真が掲載されていた方がリアリティがありますよね。

今回は婚活サービスを例に挙げましたが、どんな商品・サービスに対しても同じようなことが言えます。

適度に改行をする

記事LPは通常のLPと比べると文章量が多いです。改行をしなければ、文字で埋め尽くされてしまい、ユーザーに「読みづらそうだな」という印象を与えてしまいます。

よって記事LPでは、適度な改行を心がけましょう。

どのくらいの頻度で改行をすべきかは、ペルソナによっても異なります。例えば日常的に文章を読む機会が多い層であれば、改行が少なくてもそれほど影響はありません。

むしろ改行をしすぎることによって稚拙な印象を与えてしまうリスクすらあります。

一方日常的に文章を読む機会が少ない層であれば、読みやすさを優先して改行を多用すべきです。中には1文ごとに改行をしている記事LPもあります。

また強調したい文言の時のみあえて1文のみで改行をするといった手法もおすすめです。

CTAボタンとマイクロコピーは特にこだわる

記事LPにも通常のLPと同じように、CTAボタンとマイクロコピーを設置します。

• CTAボタンとは？：申し込みや購入などのアクションを促すためのボタンのこと
• マイクロコピーとは？：CTAボタンの上下に設置された短いセールスコピーのこと

CTAボタンとマイクロコピーは、記事LPの中でも最もユーザーの視点が集まる箇所です。よってデザインや文言には特にこだわりましょう。

例えば上記の例ではCTAボタンに記載の文言を「LP制作のお問い合わせ」ではなく「LP制作のお問い合わせをする」とユーザー視点での書き方にすることで、クリック率UPを狙っています。

またマイクロコピーとして「ご相談・お見積もりは無料！」の文言を入れることで、お問い合わせへのハードルを下げています。

いくら記事LPの内容が良くても、CTAボタンとマイクロコピーのデザインや文言次第では、期待する成果が得られません。

また記事LPでは、広告色をなくすためにCTAボタンのみを設置して、マイクロコピーの記載はしていないものも見受けられます。

まとめ

記事LPのデザイン事例4つと記事LPのデザインにこだわるべき理由、記事LPのデザインで気をつけるべき7つのことについて解説しました。

記事LPのデザインは奥が深く、一度記事LPを作成したとしても改善点は無数に見つかります。

まずは現時点でベストと言える記事LPを作成して公開しましょう。そこからデータを収集して、記事LPに改善を加えてみてください。

弊社クロスバズでも、記事LP制作や運用、Web広告運用等のサービスを提供しています。お見積もり・ご相談は無料です。

▶︎詳細はこちら：バズLP – LP制作依頼・ランディングページ作成サービス

関連記事：記事LPとは？成功事例や勝ちパターン、テンプレートを初心者向けに解説