KAIZEN REPORTブログ

2019.12.3 | LPデザイン制作の改善

BtoBとBtoCでのランディングページデザインの違いと制作ポイントを紐解く

BtoBとBtoCでのランディングページデザインの違いと制作ポイントを紐解く

昨今ではBtoB向け商材のWebマーケティングにランディングページを活用する例も珍しくありません


では、BtoBとBtoCのランディングページデザインにおいて、それぞれの違いや制作のポイントはあるのでしょうか。


今回の記事では「デザイン」の観点からBtoBとBtoCそれぞれの特徴と、ランディングページ制作のポイントについて考えてみたいと思います。


BtoBとBtoCの違い


まず、BtoBとBtoCの違いについて考えていきましょう。


特にデザイン制作時に注意したいポイントに絞って整理していきたいと思います。


ユーザー特性の違い


大きな違いとして1つ目に挙げられるのが、ページに来訪するユーザー特性です。


購入者本人がランディングページに来訪することが多いBtoC向けサービスと違い、toBは、必ずしも購入者本人が来訪するとは限りません


上司の指示により部下が情報収集を行う、つまり、購入の意思決定権を持つ人物とページ閲覧者が別になるケースがあるということです。


関連して、BtoB向けサービスのユーザーは衝動買いがほとんど無いように思います。


購入の意思決定を行うのは、BtoCでは多くの場合、個人単位となりますが、BtoBではチーム・部署・会社全体など、複数人が関わるため、購入のメリット・デメリットを多面的に検討するため、衝動買いはほとんど起きません。


部下は競合サービスも含めて網羅的に情報を収集し、上司に報告を行い、複数人で比較検討を行いながら、最終的に購入の意思決定をしていく。この意思決定の流れが、まずはBtoBとBtoCの大きな違いになってくるでしょう。


比較検討のために、競合との違いをあらゆる面で網羅的に説明する必要があるので、ランディングページ上に記載する情報量も必然的に多くなる傾向があります。


商材自体の専門性


特にBtoBランディングページにおいては、非常に専門性の高い商材を取り扱うケースがあります。


その際、対象となるターゲットユーザーが一定の前提知識を持った専門家である場合もあれば、前提知識のない初心者になる場合もあるでしょう。


商材の魅力を分かりやすく説明することは、BtoB/BtoCどちらでも重要ですが、難しい専門用語・概念の解説を分かりやすく紹介しなくてはいけないBtoB向け商材の方が、その難易度はより高いように思います。


対してBtoCは、ユーザーにも制作者自身にも、馴染みのある商材であるケースが多いです。


しかし一方で、BtoCの場合は、商材によっては競合が多いにも関わらず薬事法などの関係でランディングページで謳える表現に制約がある場合があるため、独自性を表現する役割として、デザインが重要視されるケースが多いように思います。


閲覧環境の違い


スマートフォンの普及により、スマートフォン向けランディングページの重要性は非常に高くなっています


すでに弊社でも、ほとんどの場合で、BtoC向けの商材はモバイルファーストでランディングページを制作しています


実際にGoogleアナリティクスでデバイス別の訪問数を計測してみると、BtoC向けサービスにおいては、スマホユーザーの流入数がPCユーザーの流入数を上回っている場合がほとんどです。


しかし、この流れはBtoB向けランディングページにおいては、一概に当てはめることはできません


BtoB向け商材では、まだまだPCユーザーの流入が大多数を占めている場合が多く、平日の日中、勤務時間中に会社のPCから閲覧しているような傾向をGoogleアナリティクスから確認できることも多々あります。もちろん、商材によってもスマートフォン向けのランディングページを重視するケースなどもありますが、大半のBtoB商材において当てはまる傾向かと思います。


メインとなるデバイスの違いは、デザインの考え方にも大きく影響を及ぼすポイントではないでしょうか。


また、デザイナー視点の意見となりますが、PC向けのデザインはスマホ向けに比べ難易度が高いように思います。


画面領域が狭く、ある程度レイアウト表現に決まりが出てくるスマホ向けデザインに比べ、PCは同じコンテンツでも複数の見せ方を検討でき、デザイナーの力量がはっきりと現れやすい面があるかと思います。


BtoBとBtoCの違いまとめ


細分化するとまだまだ違いはあると思いますが、特にデザインに関係してくるポイントとして、ユーザー特性と商材の専門性、閲覧環境の違いについて説明させていただきました。


BtoBとBtoCの違い

一概に当てはまるものではないと思いますが、上記の差が実際のデザインにおいて、どのような特徴となって現れるのか、その違いを探ってみたいと思います。


BtoBランディングページデザインの特徴と制作ポイント


BtoBでは、端的に表現すると論理的>情緒的なデザインを求められる傾向が多いでしょう。


ユーザー目線で考えると、意思決定には複数人が関わる場合が多く、競合との比較検討が欠かせません。そのため、競合他社に比べて、自社の商材の優位性を網羅的に説明するために情報量が多くなります


多くの情報を分かりやすく筋道を立ててシナリオを組み立てていくため、デザインでも、シナリオの切り替わりや情報要素のまとまりを意識した論理的なデザインが必要になります


BtoB向けランディングページデザインのポイント01

まとまりを意識しすぎると単調な印象になるため、縦長のランディングページにおいては、レイアウトの動きに変化をつけてユーザーを飽きさせない工夫も大事なポイントです。


また、基本的にページに訪れるユーザーは自分の知りたいことを素早く確認したいと考えているため、ユーザーが読みたい情報にたどり着きやすくする工夫をデザインで行うことも重要なポイントです。


BtoBのランディングページは、特に専門的かつ説明的な内容が続くため、そのような意識を持ってデザインに取り組むことが大切です。


BtoB向けランディングページデザインのポイント02

また特に商材の専門性が高かったり、抽象的な内容が多くなる場合では文章だけの説明ではユーザーに伝わりにくいページになってしまいます。内容を分かりやすく説明するために、グラフや図解を用いることが効果的です。


グラフや図解の作り込みにおいては、装飾的なデザインというよりは、直感的に情報が伝わりやすい内容を補完する意味付けとしてのデザインを意識すると良いと思います。


BtoB向けランディングページデザインのポイント03

また、企業間のコミュニケーションである以上、信頼性の担保は必須となります。


そのため、信頼感を想起するデザインであることを基本として考えているページが多い傾向にあるのではないでしょうか。


厳密には、信頼感とはデザインのみで表現できるものではなく、ランディングページのテキスト内容や、Web以外でも、企業の取り組み、これまでの歴史等、様々な要素が積み重なって醸成されるものですが、ランディングページのビジュアル表現においては、以下のようなパーツデザインを行っているページが多い印象です。


1)信頼感を想起させやすいブルー系カラーの色彩設計


2)誠実さや品質感を想起させる明朝体をメインフォントに採用


3)フラットデザインにグラデーションを組み合わせた、先進性を感じさせるデザイン


BtoB向けランディングページデザインのポイント04

また、構成に関わる話となりますが、サービス導入までのフローや会社情報など、意思決定のために、必要なコンテンツを漏れなく紹介することも重要です。


特に料金プランについては、サービスによってランディングページに掲載すべきか否か一概には言えませんが、意思決定のために確実に必要な情報となるので、掲載しない場合には、どこに問い合わせれば料金がわかるのか?ページ上で分かりやすく案内しておくと良いかもしれません。


ランディングページデザインの特徴と制作ポイント


BtoB向けランディングページとは異なり、BtoC向けサービスのランディングページデザインにおいては論理的<情緒的な側面が、より重要視される傾向にあるように思います。


自分の普段の買い物を考えてみると、もちろん金額や機能など実利的なスペックは重視しますが、それだけではない、個人的な好みが購入に影響していることも多々あると思います。


あらゆる業界・業種でWeb集客/ECの競争が激化し、成熟化していく中で、スペックの違いだけで他社との差別化を図ることが難しくなっています。そのため、直感的にユーザーを惹きつける魅力的なビジュアル表現の重要性はこれからも高まっていき、自社商材を選択してもらう重要な決め手となるでしょう。


また、商材によっては、昨今の薬事法の規制強化により、具体的な効果効能を謳えなくなっている点も、上記の流れに拍車をかけているように思います。


特に女性向けのランディングページでは、構成の内容は同一でも、ビジュアル表現の違いでCVRに大いに変化が出てきます。


これは決してオシャレなデザインにすればOKという話ではなく、対象のユーザーが好むであろう最適な見せ方を考えるということです。


自社のサービスにとってどのようなデザインが望ましいか、判断するのが難しい領域になりますが、ひとつの方法として、弊社ではデザインテイストの方向性を決める際に、複数のデザイン案をユーザーテストにかけ、定量的・定性的な意見を取り入れながら、作成していくケースがあります。


ユーザーの率直な意見が集まるため、客観的な情報を元にランディングページを制作することができます。


BtoC向けランディングページデザインのポイント01

また、スマートフォンがメインのデバイスとなるため、PCよりもさらにスクロールが必要となりページの隅々まで熟読されないことを想定し、拾い読みでも成立する動きのあるデザインもBtoC向けランディングページで意識するべきポイントといえるでしょう。


BtoC向けランディングページデザインのポイント02

横ではなく、縦に読み進めていくことになるため、シナリオのつながりをスムーズにする工夫もBtoC向けランディングページでは多く見られます


BtoC向けランディングページデザインのポイント03

まとめ


今回の記事では、BtoBとBtoCそれぞれのランディングページデザインの特徴と制作のポイントについて考察してみました。


大きな考え方として、それぞれの特徴を分けて考察していますが、実質的にはBtoBとBtoCでのデザインの違いを明確に分けられるものではありません。もちろんBtoBにも情緒的なデザインは必要ですし、BtoCにも論理的なデザインの考え方は非常に重要です。


その上で、対象となるユーザーに行動を起こしてもらうために、必要な情報を最適な見せ方で表現すると言う点では、BtoBとBtoCのデザインに、本質的な違いは無いのかもしれません。ビジュアルの見せ方としてそれぞれの傾向は見えてきましたが、重要なことはコンバージョン獲得(=ユーザーの意思決定)のために必要な情報を逆算して組み立てていき、それをデザインに落とし込んでいくことなのだと思います。


BtoBだからこのデザイン、BtoCだからこのデザインと単純に当てはめるのではなく、その裏にあるユーザー心理とマーケットの市況を見極めながら、その時々で最適なランディングページデザインを目指していきましょう。