モバイルのB2Bパーソナライゼーション：あらゆるデバイスで購買担当者にアプローチする

モバイルでのB2Bパーソナライゼーションは後回しにされがちです。パーソナライゼーションのルールはデスクトップのブラウザで設計され、27インチのモニターで確認され、誰かがスマートフォンでバリエーションを開く前に承認されます。そして購買担当者がLinkedInのメッセージのリンクをタップすると、パーソナライズされたブロックの読み込みが遅れたためにデフォルトのヒーローが表示され、2単語分の幅の列に押し込まれた導入事例カードを読み飛ばしてしまいます。

これがどれほど重要かは自社のトラフィック次第なので、読み進める前に確認しておきましょう。この記事では、自社のデータからモバイルの機会の大きさを見積もる方法、小さな画面向けにパーソナライズする際に変わること、スマートフォンでも機能するCTAとフォームのパターン、実機でバリアントをテストする方法、そしてモバイルの訪問が最も高いインテントを示す状況について解説します。

自社のデバイス比率から始める

「B2Bトラフィックに占めるモバイルの割合」として公表されている数値はばらつきが大きく、性質のまったく異なるサイトが混在しているため、計画にはあまり役立ちません。自社のアナリティクスを見れば、数分で自社にとっての答えがわかります。

1. GA4でレポート → テクノロジー → ユーザーの環境の詳細を開き、ディメンションをデバイス カテゴリに切り替えます。期間は過去90日間にします。
2. 実際にパーソナライズしているトラフィック（たとえば、識別されたターゲットアカウントのセグメントや、有料広告・メールキャンペーンからのセッション）の比較を追加します。
3. モバイルとデスクトップそれぞれについて、セッションの割合と主要イベント（デモ申込、問い合わせフォーム）の割合を記録します。
4. トラフィックの多い上位3つのランディングページでも同じことを行います。メールやSNSからのクリックが集まるページでは、モバイル比率がホームページと大きく異なることがよくあります。

対応すべきパターンは2つです。モバイルがセッションの大部分を占めるのにコンバージョンに占める割合が小さい場合、モバイル体験で訪問者を取りこぼしている可能性が高いでしょう。モバイルの割合が全体では小さくても、特定のキャンペーンページでは大きい場合は、まずそのページをモバイル向けにパーソナライズし、残りはそのままにしておきましょう。

コンバージョンの差には注意が必要です。その一部は修正すべき問題ではありません。スマートフォンで読み、後でノートPCでコンバージョンするバイヤーはたくさんいます。モバイルページのせいにする前に、デバイスをまたいだ全体像を確認しましょう（後述の指標のセクションを参照）。

小さな画面で変わること

ファーストビューでパーソナライズする要素は4つではなく1つ

デスクトップのヒーローなら、パーソナライズした見出し、訪問者の業界のロゴ帯、お客様の声、CTAを横に並べられます。幅375ピクセルのスマートフォンでは、最初の画面に収まるのは見出し、1〜2行の補足文、そしてボタンがせいぜいです。「これはあなたのためのものです」と伝える要素を1つに絞り、それがスクロールなしで見えるようにしましょう。多くのB2Bサイトでは、最も低コストで変更でき、最初に読まれる見出しがその役割を担います。

描画速度がパターンが見られるかどうかを左右する

クライアントサイドのパーソナライゼーションは通常このように動作します。デフォルトのページが描画され、スクリプトがパーソナライゼーションサービスに訪問者が誰かを問い合わせ、コンテンツを差し替えます。低速なモバイル回線ではこれらのステップ間の間隔が長くなるため、訪問者にはバリエーションの前にデフォルトが一瞬表示される(ちらつき)か、待っている間ブロックが空白になります。どちらも良いことはありません。

自社のページを確認するには、パーソナライズしたページを Chrome DevTools で開き、ネットワークのスロットリングを低速のプリセット（Slow 4G など）に、CPU のスロットリングを4倍に設定して、パフォーマンスプロファイルを記録します。パターンの見出しがデフォルトと比べていつ表示されるかを見ましょう。次に同じ URL を PageSpeed Insights にかけ、パーソナライズ版とデフォルト版の Largest Contentful Paint を比較します。パターンが LCP を明らかに遅らせているなら、判断をもっと早い段階に移しましょう。サーバーサイドかエッジで行うか、少なくとも準備ができるまで（ページ全体ではなく）差し替えるブロックだけを非表示にします。

ホバーなし

ツールチップ、ホバーで表示されるパネル、マウスオーバーでの導入事例プレビューは、タッチスクリーンでは機能しません。ホバーに依存するパーソナライズされたコンポーネントには、タップで同等の操作ができる仕組みが必要です。タップ領域について、WCAG 2.2の強化基準では少なくとも44×44 CSSピクセルが求められています。AAAレベルの基準ですが、主要なボタンの最低ラインとして妥当です。

短いセッションと、別のデバイスを使う同じ購買担当者

モバイルでの訪問は短時間であることが多く、後でノートPCで続きが行われます。スマートフォンで設定されたCookieはノートPCでは使えないため、Cookieベースのセグメントは人を追いかけられません。デバイスをまたいで引き継がれやすいシグナルは、企業単位の識別（訪問者が接続しているネットワークに対するリバースIPやエンリッチメント）と、追跡リンクをクリックしたCRM上の既知のコンタクトです。訪問者が各デバイスで1回のセッションしか見ない場合でも意味が通るよう、パーソナライゼーションのルールを計画しましょう。

パーソナライズされたブロックのレイアウトパターン

デザイナーがブロックを縦に並べる前に、パーソナライズしたブロックのモバイルでの優先順位を決めておきましょう。よくある順序は、見出し、CTA、実績（類似企業のロゴや一行の引用）、そして導入事例カードなどの補足コンテンツです。デスクトップのカラムが折りたたまれたとき、グリッドの都合で決まる順序ではなく、この順序でブロックが表示されます。

その他の有効なパターン：

• 隠すのではなく凝縮する。デスクトップの導入事例カードでは、見出し、2文の要約、成果を表示しているかもしれません。モバイルでは見出しと成果を表示し、要約はタップで開くようにします。パーソナライズされたシグナル(業種名、顧客ロゴ)は表示したままにします。
• 証拠には短い横スクロールのカルーセルを。複数の推薦コメントをパーソナライズする場合、スワイプできる列は縦に並べるより縦方向のスペースを取りません。項目は少数に抑え、タッチデバイスでは自動送りをオフにしましょう。ユーザー自身のスワイプと競合するからです。
• バリアントの文言は作成段階で短くする。デスクトップで2行に収まる見出しも、スマートフォンでは5行に折り返されることがあります。各セグメントのバリアントは文字数制限を設けて書き、公開前に375ピクセル幅でプレビューしてください。

モバイルでのCTAとフォーム

製品にコンパニオンアプリがある場合、モバイルの訪問者にはデモフォームよりもインストールのCTAのほうが適しているかもしれません。アプリのランディングページ事例では、Webでのコンバージョンを失わずにストアバッジやスマートアプリバナーを扱う方法を紹介しています。

セグメント別にパーソナライズした追従型 CTA

スマートフォンでは、メインのCTAがすぐに画面外へ流れてしまいます。画面下部に細い固定バーを置けば、いつでもタップできます。そのラベルは手軽にパーソナライズできる箇所で、たとえば次のようにできます。

• 識別されたエンタープライズアカウント：「エンタープライズチームに相談する」
• 小規模企業:「プランと料金を見る」
• 料金ページを閲覧したリピーター：「デモの日時を選ぶ」

バーはコンテンツを覆わない程度に小さくし、Cookieバナーやチャットウィジェットの上に重ならないようにします。CTAの文言をセグメントに合わせる方法について詳しくは、データに基づくパーソナライズされたCTAをご覧ください。

フォームが短くなり、入力項目が減る

スマートフォンでの入力は時間がかかるため、項目が1つ増えるごとの負担はデスクトップより大きくなります。リード獲得フォームのガイドでは、調べればわかる情報は尋ねないよう推奨していますが、モバイルではこの主張がさらに当てはまります。

• ドロップダウンの代わりにエンリッチメントを使う。企業が特定できていれば、社名、規模、業種を事前入力するか、それらの項目を削除します。訪問者にすべてを確認させるのではなく、事前入力した企業名を「編集」リンク付きで表示しましょう。
• 適切な入力タイプを設定する。type="email" や type="tel" を使うと対応するキーボードが表示され、autocomplete 属性（email、name、organization）を使うとスマートフォンに保存された情報を自動入力できます。
• 二次的な質問は後に回す。電話番号やプロジェクトの詳細は、主要なコンバージョンが記録された後、サンクスページや日程調整ツールで尋ねます。

自社のトラフィックでの効果を測定しましょう。モバイルのセッションでフォームの入力開始率と完了率を前後で比較し、リードの質が変わるかを確認します。所要期間は、A/B テストのサンプルサイズのガイドでサンプルサイズを確認すればわかります。

希望するセグメント向けのクリック発信

tel:リンクは、スマートフォンならワンタップで発信できます。通話が自然な次のステップとなるエンタープライズのセグメントでは、「エンタープライズチームに電話する」ボタンが効果的なことがあります。セルフサービスのセグメントでは通常効果はありません。製品を試したい小規模企業の購買担当者が、営業の電話を望むことはまずないからです。セグメントのルールが良い体験を生み出すのと同じくらい、悪い体験を防ぐケースです。

実機でバリアントをテストする

公開前に、パーソナライズしたすべてのパターンを3つの画面幅で確認しましょう。

DevToolsのデバイスエミュレーションはレイアウトの確認には十分です。ただし、実際のタッチ操作、実際のフォントレンダリング、ミドルレンジのスマートフォンのCPUは再現できないため、公開前に各バリエーションを少なくとも1台の実機で開いて確認しましょう。セグメントに該当しない状態でバリエーションを確認するには、パーソナライゼーションツールのプレビューモードか、バリエーションを強制表示するURLパラメータを使います。

モバイルで個別に追跡すべきこと

• パーソナライズされたページのスクロール深度。モバイルの訪問者のほとんどがパーソナライズされた実績ブロックまで到達しないなら、上に移すか、モバイルでは省きましょう。
• デバイス別のフォーム入力開始率と完了率。開始率が低ければページに、完了率が低ければ入力項目に問題があります。
• レイジタップとデッドタップ。セッション録画ツールは、反応しない要素への連続タップを検出します。これは通常、リンクのように見えてリンクではないものがあることを意味します。
• デバイスをまたいだ再訪問。識別された企業のうち、モバイルでの訪問から1週間以内にデスクトップで戻ってくるのはどのくらいで、そこでコンバージョンしているか？多くがそうしているなら、モバイルページはモバイルでのコンバージョンだけでなく、その再訪問を生み出しているかどうかで評価しましょう。

モバイルからの訪問で購買意欲が最も高い場面

イベント

参加者はセッションの合間にベンダーを調べます。出展する場合は、会期中だけ有効なルールを設定し、開催都市から（または参加者リストの企業から）の訪問者に、イベントに触れたヒーローとブースでの商談予約リンクを表示しましょう。イベント終了日にはルールを外します。フォローアップについてはイベントでのリード獲得のガイドで解説しています。

メールとLinkedInのクリック

メール配信プラットフォームのデバイス別レポートを確認しましょう。ほとんどのリストでは、開封とクリックの多くがスマートフォンで行われています。キャンペーンメールからのクリックは、訪問者が何に関心を持ったかをすでに教えてくれます。それを UTM パラメータで引き継いでパターンの選択に使えば、ページは汎用的なホームページでやり直すのではなく、メールの話題の続きを語れます。

営業が送ったリンク

営業担当者がLinkedInのメッセージやフォローアップメールでリンクを送ると、見込み客はスマートフォンでタップすることがよくあります。営業担当者には、パラメータにアカウントやキャンペーンを含めたトラッキング付きリンクを渡し、担当者が話していた内容に関するページが開くようにしましょう。文脈が明確なので、アカウント単位のパーソナライゼーションを最も正当化しやすい場面です。

移動中の閲覧

電車の中で読んでいる人は、比較検討ではなく流し読みをしています。コンテンツをメールで送る「この導入事例を送ってもらう」オプションのほうがデモフォームより合うことが多く、デスクに戻ったときにフォローアップする理由にもなります。

2週間で始める出発点

1. セッションとコンバージョンのデバイス別内訳を、全体とパーソナライズ対象のセグメントについて取り出します。
2. それらのセグメントの中でモバイルの割合が最も高いページを1つ選びます。
3. そのページのパーソナライズされたバリアントを、実機のスマートフォンと低速回線で確認します。まず、ちらつきとレイアウトを修正しましょう。
4. セグメントに応じたスティッキーCTAを追加し、モバイルのフォームはエンリッチできない項目だけに絞ります。
5. モバイルでのフォーム入力開始数、完了数、クロスデバイスでの再訪問を前の期間と比較し、変更を拡大するかどうかを判断します。

スマートフォンからノートパソコンに切り替えても失われない企業レベルのシグナルが必要なら、Markettailorの訪問者特定がどちらのデバイスでも訪問企業を特定し、セグメンテーションでその上に前述のモバイル向けルールを構築できます。