BtoB向けのデザインサイトとBtoC向けでは、サイトのデザインはきっと違うはず。
そこまでは誰でも思いつくことでしょう。ですが、具体的に何がどのように違うのか、という話になると、答えられる人は少数なのではないでしょうか。

結論から言うと、BtoBは論理を重視。BtoCは情緒を重視する。ということになります。

ですが、それだけ言われても具体的何がどう違うの? と混乱してしまうかもしれません。

ですので、今回の記事では、サイトデザインの観点から、BtoB、BtoCについて具体的にどう違いがあるのか、という点について解説していきたいと思います。

BtoB、BtoCの客層の違い  

toB向けサイトの閲覧者とtoC向け閲覧者の性質は大きく異なります。意思決定者が閲覧者とイコール関係であるのか、購入に関わる人数は何人なのか。

様々な点で異なるそれぞれの性質について、まずお話します。

意思決定者が閲覧者と違うBtoB  

BtoB向け商品サイトの閲覧者は、意思決定者と同一ではありません。これは閲覧者が「上司から調査を指示された一般社員である」ということです。

BtoBで想定される一般社員は、上司に「ここの商品が我が社に向いています」ということを、上司の論理的にプレゼンテーションする必要があることです。そのため、情報は網羅的かつ論理的に。その情報をもとに複数人で吟味した上で、購入の意思決定がなされます。

その意味で、BtoBのサイトデザインは、最終的に営業へつなげることが目的となります。そのため、各ページのファーストビューに必ずコンバージョンボタンを設定します。

この、コンバージョンボタンとは何でしょうか。コンバージョンボタンとは、Amazonを例に挙げるなら「商品をカートに入れる」などのサイトページのゴールとなるボタンのことです。

補足としてコンバージョンボタンから見るBtoBのサイトデザインの特徴をお話します。それは、BtoBサイトデザインでは、コンバージョンボタンを2種類用意する場合がある、ということです。

では、BtoBの二種類とは何でしょうか。一つは当然、案件申し込みのためのボタンです。ではもう一発なんでしょうか。それは、資料請求のボタンとなります。

繰り返しになりますが、一般社員は資料をまとめて上司にどの商品がいいか、という事を説明する必要があります。一般社員がその場で購入することはあり得ません。となれば、一般社員にとってのコンバージョンボタンは、資料請求ボタンとなります。

資料請求ボタンを用意することで、一般社員はスムーズに調査業務を進めることが出来ます。逆に言えば、資料請求ボタンがなければ調査のコストが増大します。データ漏れがあったり、最悪の場合プレゼンテーションの候補から外されてしまうかもしれません。

BtoBのコンバージョンは2種類用意しておきましょう。ただし、増やし過ぎると閲覧者が混乱してしまうかもしれませんので、増やし過ぎもよくありません。やはり2種類がちょうどいいのです。

意思決定者が閲覧者と同じBtoC  

一方BtoC向け商品サイトの閲覧者は、その多くが個人単位です。消費者の立場から、欲しいものについての情報を集めているのです。

BtoCで想定される消費者は、もっと直接的です。個人の独断と欲望のままに購入を決定するため、時として衝動買いも発生しうるのが特徴と言えます。

BtoC向けサイトデザインでは、顧客の欲望を煽り、実際に購入した時に得られる価値を想像させ、顧客の熱を冷めさせないサイトデザインが必要となります。つまりは、BtoCでは情緒面が重要になってくるという事です。

例を挙げましょう。BtoCでは、シズル感、という要素が重要になります。これは「直接的に本能に訴えかけてくる要素」のことです。

例えばトマトの写真などでしたら、普通に撮影するより霧吹きで水滴を付けてから撮影すると、シズル感が増加します。何故なら、水滴があることでより瑞々しく新鮮に見え、おいしそうに感じられるからです。

他にも、チーズのとろーり感や、焼き肉のじゅわり感などがシズル感に当たります。どれもが本能に直接的に訴えかけてきます。

そう言った要素は、BtoCでは非常に効果的です。シズル感に惑わされて、顧客は衝動買いをしてしまう、ということなのです。

ただ、こういった手法はBtoBでは使われません。論理性を強く求められるBtoBでは、シズル感を出しても意思決定に影響を与えられないためです。

閲覧のデバイスがPC率の高いBtoB  

BtoBサイトの閲覧者は、上司から調査を指示された一般社員である、という想定を上に記載しました。そんな一般社員の立場の調査者がどんな閲覧環境で調査するのかと言えば、昼間、仕事の一環としての調査となるでしょう。

そしてその場合、多くはスマートフォンなどではなく、PCでの調査となるのが一般的です。プレゼンテーション用の資料にも転載する場合があるため、その傾向は顕著となります。

もっとも、スマートフォン向けページを作成しなくてもいいという訳ではありません。BtoB閲覧者でも、朝の出社時にスマートフォンから調査することは十分にあり得ます。PCのデザインも、スマートフォンのデザインも、手を抜かず取り組むのが適切です。

閲覧のデバイスがスマートフォン率の高いBtoC  

BtoCサイトの閲覧者はどうでしょうか。仕事から離れての調査となると、手軽なのはやはりスマートフォンです。PCで収集した情報を別のものに移す必要もないため、スマートフォンで確認して「良さそうに見えたもの」にブックマークをつけるくらいの調査でしょう。

となれば、ここで求められるのはシズル感と、せいぜいがざっくりした理解です。分かりやすく、シズル感を出して魅力的に。情報を網羅して閲覧者を困惑させてしまえば、待っているのはブラウザバックです。情緒的に、というのはそういう事なのですね。

商品の専門性が高い傾向にあるBtoB  

BtoBの商品は、企業で扱うものになります。そう言ったものは自然と、非常に専門性の高い商品の割合も高くなるでしょう。

そのため、BtoBで必要となるのは「難しい商品説明を、可能な限り分かりやすく紹介する」こと。これが出来ていなければ、そもそも商品の価値を理解してもらえませんし、理解させられる能力のない会社なのだとすら認識されてしまうでしょう。

商品の専門性が低い傾向にあるBtoC  

他方BtoCは、購入される商品も個人が欲しいと感じるものに限定されます。

逆にBtoCでは多くの競合他社が存在し、それらを出し抜いて顧客にアプローチしていく必要があります。その足掛かりとしてデザインが活用される、というケースが多いのです。

BtoB、BtoCの違いのまとめ  

デザインに着目してBtoB、BtoCの違いをまとめると、以下のようになります。

BtoBBtoC
求められる要素論理的で網羅的魅力的で情緒的
閲覧者と意思決定者が同じ
閲覧されるメイン媒体PCスマートフォン
専門性高い低い
シズル感不要必要
コンバージョンボタン複数単体
衝動買いありえないありうる

具体的なBtoBデザイン  

BtoBサイトのデザインで重要なのは、論理的、網羅的な商品情報です。そこから逆算するに、サイトの情報は必然的に多くなる傾向にあります。

ですが閲覧者は共通して、分かりやすく、素早く欲しい情報を提示して欲しいもの。であれば、論理的かつ網羅的な大量の情報群を、分かりやすく素早く提示する、というコンセプトでデザインアイデアにアプローチする必要があります。

まとまりを意識したデザインで分かりやすさにアプローチ  

人間の理解は、基本的に概念度の高いところから具体的で詳細度の高い情報に降りていくのが常です。結論、理由、根拠、結論で有名なPREP法に倣って、以下のように構築するのがよいでしょう

大見出し  

中見出し  

本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文

小見出し  

本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文
本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文

また、難しい専門分野の説明は、文字での説明だけでは困難な場合もあります。
その場合は、グラフや図形で視覚的に見せるのも一つの手でしょう。

ここで重要なのは、まとまりを意識するだけでは不十分ということ。分かりやすく論理的でも、欲しい情報に中々たどり着けなければ問題です。

そのための工夫についても、以下に述べます。

一覧性を高めることでアクセス速度を高める  

サイトの様々なページに直接移動できるグローバルナビゲーションや、小項目をそれぞれ説明できるスライダーメニューは、一覧性を高めることが出来ます。

一覧性が高まると、その分閲覧者から欲しい情報へのアクセスが容易になります。

また、サイトトップページから、簡単に問合せに移行できるボタンが複数用意されているのも重要です。

BtoBの吟味は複数人で行われますが、必ずしも合理的であるとは限りません。何故なら、企業とは言え人間の集まりです。「問い合わせがスムーズにいかない配置になっている。これはこの会社がユーザーフレンドリーを理解していない証拠だ」などと、自身の不安から言い出す人が、案件成約を阻むこともあり得ます。

それを未然防ぐのが、親切で、やりたいことがすぐにできるデザインということになります。例えば冒頭の「問い合わせ移行ボタン」です。これをコンバージョンボタンと言います。一見クリックされないコンバージョンボタンだったとしても、それがあるだけで安心し、案件成約に結びつくこともあるのです。

具体的なBtoCデザイン  

BtoCサイトで重要なのは、個人顧客の欲望促進させ、その熱を冷まさせないデザインです。
そのため、論理性よりも情緒的な要素が強くなる傾向があります。

個人の欲望は、スペックだけでは満たせません。金額も機能も重要ですが、いかにターゲットに刺さるデザインであるか、好みを刺激するかが重要になってきます。

しかし一概に好みを刺激する、といっても何が好みを刺激するかは人それぞれでしょう。それを明らかにするのは何か。それを調べるところから始まりそうです。

また、顧客の熱を冷まさせないためにも工夫が必要でしょう。それぞれを説明していきます。

直観的にターゲットに刺さる、魅力的なデザインの知り方  

ターゲットの好みを誰が一番知っているのでしょうか。それはやはり、ターゲットに他なりません。

であればアプローチはシンプルです。ターゲットから直接意見を聞く、ユーザーテストが効力を発揮するでしょう。

報酬付きでアンケートを求めるもよし。ページの遷移からデータを集めるもよし。手段は複数存在します。そういった情報収集を積み重ねることで、ターゲットの好みに近づいていけるのです。

熱を冷めさせない、脳の負荷の低いデザイン

BtoBで紹介した、論理的かつ網羅的を目指した大量の情報はBtoCでは望まれません。ある程度掻い摘んでも、何となく理解できる。良さが分かる。そんなデザインが求められます。

またスマートフォンでの閲覧の特徴として、縦で読み進められるという点があります。そのため、コンテンツ同士がどうつながっているかがスムーズに理解できるデザインが求められます。

まとめ  

今回の記事では、想定されるBtoB、BtoCの客層から逆算して、どのようなサイトが求められているのかを解説しました。

とはいえ、ここでの落とし穴としては、BtoBならこう、BtoCならこう、という一辺倒なやり方では、どこかで間違えてしまう、という点です。

BtoBでも小規模向けなら、社長自らが調査をする可能性もあるかもしれません。BtoCでも家族向けなら、家族全員で考えて購入する場合もあるでしょう。

重要なのは、この例に倣ってターゲットを見出し、そこから適切なデザインを構築する、という点です。あなたの会社の商品に合わせて、デザインを構築するのがよいでしょう。