会員登録の離脱を防ぐ方法｜ソーシャルログイン導入の4つの視点

ソーシャルログインを導入したのに、会員登録の完了率がほとんど変わらないサイトは少なくありません。

原因の大半は、導入したかどうかではなく、ボタンの置き場所・入力項目の重複・選択肢の数という見せ方にあります。CVR(コンバージョン率)診断ツールは、会員登録画面をこの見せ方の観点から確認しています。

この記事では、その確認手順を4つの視点としてそのまま紹介します。自分の登録画面を横に開いて、上から順に照らし合わせてみてください。

会員登録の離脱は、ボタンを足すだけでは動かない

会員登録フォームを開いた瞬間、訪問者は無意識に負荷を感じ取ります。その負荷は主に三つです。

• 何個の項目を打たされるか分からない不安
• 新しいパスワードをまた一つ増やす面倒さ
• このタイミングで初めて個人情報を渡すことへの警戒

ソーシャルログインは、この三つすべてに一度に効くはずのレバーです。項目数はSNS側の登録情報で肩代わりでき、パスワードは新規に作らずに済み、個人情報の入力もSNS側のログイン画面で完結します。

ところが、導入したのに完了率がほとんど変わらないという相談は珍しくありません。画面を見ていくと原因はほぼ一貫していて、ボタンを追加しただけで、フォームの主役を入れ替えていないケースです。 ボタンは増えたのに、画面の一等地は依然としてメール入力欄が占めたまま、というわけです。

たとえば会員制の通販サイトで、購入前にアカウント作成を求める場面を考えてみます。同じボタンを置いていても、訪問者に伝わる優先順位は次のように変わります。

	SNS連携の位置づけ	メール入力の位置づけ
ボタンを足しただけ	面倒な人向けの近道(補助)	画面の主役
主役を入れ替えた	最初に示される選択肢	連携できない人の代替手段

上の行と下の行で、実装されている機能は変わっていません。違うのは並び順と面積だけです。

CVR改善ラボの診断では、こうした見せ方の課題を含めて合計11の評価観点からサイトを確認しています(全体像は「CVRとは」で整理しています)。この記事では、そのうち会員登録画面のソーシャルログイン導入に絞った4つの視点を取り出します。

視点1: ソーシャルログインを入力欄より前に置く

訪問者は登録画面を開いた瞬間、最初に目に入った要素から行動を決めます。メールアドレス欄が画面の一等地を占めていれば、「今から入力作業が始まる」という心理的な構えが先に立ちます。

SNSボタンが下や小さな文字リンクとして添えられているだけでは、選ぶ前に離脱の判断が終わってしまいます。

図1: ソーシャルログインを入力欄より先に置くだけで、入力を始める前に離脱する人を減らせる

原則は単純で、最初に目に入った選択肢が「入力する/しない」の判断を決めます。

確認手順

1. 会員登録画面を、スクロールしない状態で開く
2. 最初に視界へ入るのがメール入力欄か、SNSログインのボタンかを見る
3. SNSボタンの文言を読む

3のボタン文言は見落とされがちです。「アカウント連携」のような抽象的な表現より、「Googleで登録」「LINEで登録」のように押した後の動作が想像できる表記のほうが選ばれやすい傾向があります。

判断基準

画面の状態	判断
SNSボタンがフォーム最上部・最初の選択肢	問題なし
メール入力欄が先に見える	ボタンの位置を入れ替えるだけで着手できる
SNSは下部の小さな文字リンクだけ	選ばれる前に離脱の判断が終わっている

架空の例で考える

あるオンライン英会話サービスの登録画面を想定します。メールアドレス・パスワード・確認用パスワードの3欄が最上部にあり、その下に「他の方法で登録」という灰色の小さな文字リンクだけがある状態です。

変えた箇所	変更前 → 変更後
画面の最上部	メール・パスワード・確認用の3欄 → 「Googleで登録」「LINEで登録」
メール登録	画面の主役 → 折りたたみ式の「その他の方法」へ格下げ
実装の変更量	入力欄の並び順だけ

やったことは並び順の入れ替えだけで、画面の主役が入れ替わります。開発コストはほとんどかかりません。

自分のサイトの登録画面は、SNSボタンとメール入力、どちらが先に目に入っていますか。無料でCVR診断する(自分のサイトを確認)(結果はメールでお届け)

視点2: 連携後に入力項目を重ねて聞かない

ソーシャルログインの本来の価値は、氏名やメールアドレスを新たに打たせずに済むことにあります。ところが実際の画面を見ていくと、SNS連携を済ませた直後に、次の項目がそのまま残っているケースに何度も出会います。

• 氏名・メールアドレスの入力欄が連携後も必須のまま
• パスワードの入力・確認欄が省略されずに表示されたまま
• SNS側で取得済みのはずの情報を、確認目的でもう一度入力させる欄

連携後に残る項目が二つ以上ある画面は、ほぼ確実に離脱要因になっていると見てよい水準です。

せっかく連携したのに結局はじめから入力する羽目になり、訪問者には「連携した意味は何だったのか」という徒労感だけが残ります。

図2: SNSログインで取得できる項目を、フォームでも重ねて聞くと入力の手間がそのまま倍になる

確認手順

1. SNS連携を実際に最後まで済ませる
2. 連携後のフォームに残っている項目を、一つずつ数える
3. 各項目を「すでにSNS側から取得できているか」で仕分ける

電話番号や生年月日のように連携だけでは取得できない項目は、この段階で無理に聞く必要はありません。あとから必要になった時点で聞く設計に変えるだけで、登録完了までの入力欄はゼロに近づきます。

架空の例で考える

法人向けのクラウドサービスで、連携直後に5項目が残っている画面を想定します。

残っている項目	SNS側から取得	対応
会社名	できない	残す
部署名	できる	値を差し込んで確認だけ
氏名(フリガナ)	できる	値を差し込んで確認だけ
メールアドレス	できる	値を差し込んで確認だけ
パスワード	そもそも不要	削除

連携時に渡ってきた値をそのままフォームへ差し込み、確認だけで完了できる形にすれば、入力が必要な項目は会社名の1つだけになります。連携直後の項目は「削れるかどうか」ではなく「すでにSNS側から取得できているかどうか」で判断するのが早道です。

視点3: ログイン手段の数を絞る

選べる手段が多いほど親切に見えますが、実際には逆です。

Google、Facebook、X(Twitter)、LINE、Apple、メール——横並びで6つの選択肢を提示された訪問者は、比較検討にわずかでも時間を使います。登録画面のように滞在意欲がまだ固まっていない場面では、その数秒の比較検討そのものが離脱の引き金になります。

図3: ログイン手段が多いほど「どれを押すか」で立ち止まる。主要2つ+メールの3択に絞る

確認手順

1. 横並びになっているログイン手段の数を数える
2. それぞれのボタンの大きさ・色を見比べる

すべてのボタンが同じ大きさ・同じ色で並んでいれば、優先順位が訪問者に伝わっていない証拠です。

判断基準

横並びの選択肢の数	判断
1〜3個	問題なし。優先順位が伝わりやすい
4個	主要2つを大きく、残りを小さくできないか検討
5個以上	絞りどころ。折りたたみへの整理を検討

選択肢が増えるほど比較に時間を使ってしまう現象は、行動経済学で「選択のパラドックス」と呼ばれる傾向として知られています。 会員登録のような低関与な場面ほど、この傾向は離脱に直結しやすくなります。

自社の会員層で実際に使われているSNSは、想像より偏っていることがほとんどです。最も使われている1〜2つを主要ボタンとして大きく見せ、残りは「その他の方法」の折りたたみに収めれば、選択肢を削らずに一等地だけを整理できます。

視点4: 連携失敗時に戻れる道を用意する

連携ボタンを押した後の画面まで実際に確認している担当者は、意外と多くありません。しかし失敗は珍しい事故ではなく、登録数が増えるほど一定の割合で必ず起きる現象です。

• アプリがインストールされておらず、ブラウザに切り替わったまま戻り方が分からなくなる
• 複数のSNSアカウントを持っていて、意図しない方で連携してしまう
• すでにメールアドレスで登録済みのアカウントとSNSアカウントが重複する

図4: 連携失敗の画面に「別の方法で登録する」への戻り道があるかどうかで、その訪問者を失うかどうかが決まる

確認手順

1. 実際にSNS連携ボタンを押す
2. わざと失敗させる(別アカウントで連携する、途中でキャンセルする など)
3. 失敗した画面からどこへ戻れるかを見る

判断基準

エラー画面に「別の方法で登録する」といったフォーム全体へ戻れるリンクがあるかどうか。 用意されていない画面は、失敗した訪問者がそのまま離脱するだけの行き止まりになっています。

登録数が月に数百件程度の規模でも、失敗パターンは一定の割合で積み重なっていきます。連携ボタンを増やせば増やすほど、失敗する組み合わせも増えるという単純な理由です。エラー画面を1画面追加で作る手間と、そこで離脱していく訪問者を比べれば、優先度は自然と決まります。

まとめ: 会員登録の離脱は「見せ方」で変わる

ソーシャルログインは導入して終わりではありません。入力欄より先に置くか、連携後に項目を重ねて聞いていないか、選択肢を絞れているか、失敗時に戻れる道があるか——この4つの見せ方まで整えて、はじめて完了率に効いてきます。

視点	確認ポイント	良し悪しの目安
1	ボタンの位置	メール入力欄より先に見えるか
2	入力項目の重複	連携後に残る必須項目が2つ以上ないか
3	選択肢の数	横並びが5つ以上になっていないか
4	失敗時の導線	エラー画面からフォーム全体へ戻れるか

どれも大がかりな開発を伴わず、ボタンの位置や文言、項目の要不要を見直すだけで着手できるものばかりです。とはいえ、自分のサイトの登録画面を一つずつこの4視点で照らしていくのは、思っている以上に手間がかかります。

無料でCVR診断する(まとめてチェック)(結果はメールでお届け)。会員登録画面に限らず、訴求構造全体の見直し方は「CVR改善 完全ガイド」でも整理しています。あわせて確認してみてください。

CVR改善ラボのレポートは、実際どんな形で届くのか

視点1〜4では、自分の目で確認できる範囲に絞って説明しました。ただ実際の課題カードには、優先度・想定される機会損失・改善前後の画面案までが1枚にまとまっています。

図5: フルレポートの課題カードの例。優先度・想定される機会損失・改善前後の画面案までが1枚に収まる(※架空サイトのサンプルです。実在サイトの診断結果ではありません)

「なんとなく直したほうがよさそう」で止まらず、どこをどう直すのかまでが画面の形で残るので、社内共有や制作会社への指示の叩き台としても使えます。

フルレポートに含まれるのは、次の内容です。

項目	内容
診断範囲	全11観点(この記事の視点1〜4を含む)
課題一覧	優先順位付きで一覧化
ワイヤーフレームモック	画面の変更で改善できる課題のうち上位3件までBefore/After(ブラウザ上でそのまま編集可能。価格・配送など画面変更以外の課題は対象外)
改善ロードマップ	何から着手するかの提案
価格	4,980円(税込・買い切り、継続課金なし)
納品方法	メールでお届け(非同期)

入口は無料診断です。サイトのURLとメールアドレスを入力して申し込むと、診断結果はメールで届きます。届いたサマリーを見てから、フルレポートに進むかどうかを判断できます。

無料診断で自分のサイトも確認するなら、この記事の視点1〜4を含む11観点を、自分のサイトに当てはめて確認できます。