勝手にEFO比較分析【ホームズ x スーモ】(不動産ポータル 物件問い合わせ編)

今回、新たなシリーズを開始します。

題して「勝手にEFO比較分析」。

業界別に代表的なサイトをセレクトし、ユーザー目線でエントリーフォームの相違や、入力補助機能について「勝手に」分析します。

エントリーフォームの入力完了率アップのために、エントリーフォームと入力補助機能はどうあるべきかを考えるためのヒントとして、この記事が役立てればと思います。

今回は、不動産ポータル編として、数ある不動産ポータルサイト様のなかから、株式会社ネクスト様「home’s」(http://www.homes.co.jp)(※以下本記事内では「ホームズ」)と、株式会社リクルートホールディングス様「SUUMO」(http://suumo.jp)(※以下本記事内では「スーモ」)を題材に、フォームの入力補助機能を中心にEFOの比較分析をしました。
以下、サイト名の敬称は省略させていただきます。

さて今回分析の対象とするフォームは3つ。
・ホームズ物件問い合わせ
・スーモ物件問い合わせ
・スーモ見学予約
です。全て賃貸物件のフォームを拝見しました。

※本記事の内容は2013年8月25日時点のリクルート様スーモ、ネクスト様ホームズ両サイトのフォームを分析した内容を記載しています。なお今回ご紹介したどのフォームにも当社エフトラ EFOの入力補助機能は導入されていません(2013年8月25日時点)。

入力ページ、基本的な部分は共通点が多かった

まずは、入力ページについて。入力フォームとしての基本的な部分からEFO比較していきます。

必須項目の数はばらつきましたが、
基本的な点については、3フォームともに共通といえる結果になりました。

ホームズ物件問い合わせ スーモ物件問い合わせ スーモ見学予約
ページ数 入力、確認、完了の3つ 入力、確認、完了の3つ 入力、確認、完了の3つ
入力項目の種類 7種類 5種類 7種類
必須項目数 4~5個
問い合わせ内容、お名前姓名、連絡方法、問い合わせ先(複数ある場合)
3個
問い合わせ内容、氏名、連絡先
10個
見学希望日、時間、お名前姓名、カナ姓名、メールアドレス、電話番号×3
必須マーク あり あり あり
フロー画像 あり あり あり
オファー なし なし なし
新着メール希望チェック デフォルトチェック済み デフォルトチェック済み デフォルトチェック済み
利用規約、
プライバシーポリシー
リンクで別ウィンドウ表示 リンクで別ウィンドウ表示 リンクで別ウィンドウ表示
問い合わせ先表示
(不動産会社名)
表示される 表示される 表示される
送信ボタンのサイズ 幅487px X 高さ76px 幅325px X 高さ44px 幅325px X 高さ44px

以下、個別に説明いたします。

入力項目、必須項目の数

入力項目、必須項目の数をできるだけ減らすことは、CV改善のための代表的な策のひとつです。ホームズ問い合わせ、スーモ問い合わせでは入力項目数の数がかなり絞り込まれている印象。

一方、スーモ見学予約は、メールアドレスと電話番号が必須になるなど、やや冗長でした。これは見学予約という性質上、より質の高い情報を得ることを優先しているのでしょう。

フロー画像はともに「あり」

フロー画像とは、入力ページから完了に至るまでのページ数とユーザーが今どのページにいるかを示す情報です。これは3フォームともに備わっていました。
※以下、画像については、ホームズの画像はオレンジの枠色スーモの画像は緑色の枠色をつけます。

ホームズの場合

スーモの場合

※ともに画像は実サイズです。

オファーはともに「なし」

オファーとは、フォーム上部に設置するメッセージ(テキストまたは画像)で、例えば下記は当社サイトの問い合わせフォームの例ですが、このように「フォームを送信することで何が起きるか」を提示したものです。

オファーを提示することで何のフォームなのかが伝わり、直帰が減るなどの効果が期待できますが、今回の例では、どちらにもありませんでした。不動産ポータルサイトなので、物件の問い合わせであることが明らかなため、ともに省略しているということでしょうか。

オファーの例(当社フォームより)

送信ボタンのサイズはともに大き目、ホームズがスーモの約1.5倍

実際のサイズです。特にホームズのほうは、画像だけでみると大きすぎる気もしますが、フォーム内では違和感ありませんでした。

ホームズの場合(幅487px 高さ76px)

スーモの場合(幅338px 高さ33px)

入力ページで違っていたのは、「どこまでシンプルにするか」という点

入力ページをどこまでシンプルにするか。3つのフォームでそれぞれ違う結果となりました。

ホームズ物件問い合わせ スーモ物件問い合わせ スーモ見学予約
入力画面のレイアウト フォームは専用ページで、シンプル フォームは物件詳細ページの一部なので、グローバルメニューやサイト内検索フォームが存在 フォームは専用ページだが、グローバルメニューやサイト内検索フォームが存在

シンプルな入力ページのホームズ、スーモは2つのフォームで別々の結果に

離脱率を下げるための策として、「入力ページを極力シンプルにする」というのものがあります。サイトナビゲーションなど、フォームからの離脱要因を減らすというのが目的です。

今回の比較では、結果は分かれました。

ホームズは、シンプル派。フォーム上部に物件の価格や面積、所在などの概要がある以外はフォーム要素のみというシンプルな入力ページです。

スーモ見学予約も、シンプル派。ただ、サイトナビゲーションは存在しています。

一方、スーモ問い合わせは、物件情報と入力フォームが同じページで、フォームへはページ内リンクで遷移するというパターンでした。ナビゲーションなど様々なリンク要素が入力フォームからの離脱要因となりえる懸念はあるものの、ユーザーにとっては、入力しながら物件情報の詳細をスクロールで見ることができるというメリットもあります。

大きな違いがあった、入力補助機能。

さて、本題ともいえる入力補助機能の比較ですが、結果は、ホームズとスーモで大きな違いがありました。

機能名 ホームズ物件問い合わせ スーモ物件問い合わせ スーモ見学予約
ガイド

未入力の残り必須項目数などをリアルタイムで表示する機能

あり なし なし
離脱ブロック

ページを閉じようとするとアラートを出してOKしないと閉じることができない機能

あり なし なし
サブミットブロック

送信のための入力条件を満たさないと送信ボタンを表示しないor押せなくする機能

あり なし なし
プロフィール自動入力

登録済みのユーザー情報を呼び出して自動入力する機能

なし 登録済みならボタンクリックで呼び出せる方式 登録済みならボタンクリックで呼び出せる方式
項目毎アラート表示

入力についての説明をリアルタイム表示する機能

フォーカス時:なし
エラー時:吹き出し
フォーカス時:なし
エラー時:項目上にテキスト
フォーカス時:なし
エラー時:項目上にテキスト
項目毎に
入力完了した際の動作
入力欄の背景色が消える 消えない 背景色は消えず、項目右に「入力済み」と表示される

以下、個別に見ていきましょう。

離脱ブロック、ガイド、サブミットブロック

どれもホームズあり、スーモなし、という結果。

ホームズのガイドは、サイトロゴにかぶる左上に配置。ロゴを避けて右上に置くケースも多いのですが、そこはあえて、という判断でしょうか。背景色が黒でこれまた目立つのですが、もう少しフォームのトーンに合わせたほうが良かったかも…と筆者は感じました。

ホームズのガイド

アラート機能、吹き出しかテキストか。フォーカス時は表示なし

ユーザーが入力欄をクリックした際(フォーカス時)の表示は、ともに無しで、
エラー時にのみ、ホームズは吹き出し、スーモは項目上部に赤くテキストを表示するという動作でした。

フォーカス時のアラート表示なしというのは、項目が一般的なものであること、またアラートを表示するとうるさいと感じるユーザーへの配慮と思われます。

ホームズのアラートは吹き出しタイプ

スーモのアラートはテキスト挿入タイプ

プロフィール呼び出し機能

ポータルに登録したプロフィールを呼び出す機能がスーモにはありました。リピーターには便利な機能でしょう。一方でホームズは同機能は見られませんでした。

スーモのプロフィール呼び出しボタン

入力済みマーク、あと一歩…

スーモ見学予約の、項目別の入力完了時の動作は、吹き出しとテキストという差はあれ、入力完了時に項目右に「入力済み」と表示するのはわかりやすいと思った半面、ついでに入力欄の背景色も消すともっとわかりやすくなると思いました。

スーモの入力済みマーク

その他にも、独自の工夫が。

【ホームズ】連絡方法の入力方法がわかりやすい

連絡方法で、メールアドレス、電話番号、FAX番号のどれか1つを入力することで、必須条件は満たされるのですが、
初期表示時は、メールアドレス欄、電話番号の1つ目の欄、FAX番号の1つ目の欄が色付けされています。このうちどれかを入力すると、色付けが消えるという動作。これは入力しやすい工夫だと感じました。

入力前…これが

↓↓↓↓↓

入力後、こうなる

【ホームズ】サブミットブロックの動作、条件を満たしていない入力欄までスクロールしてくれる

ホームズについては、もう1つ挙げておきたいです。
送信のための入力条件を満たさないと送信ボタンを表示しないor押せなくする機能を「サブミットブロック」と呼んでいますが、ホームズの場合、送信ボタンが有効になっていない状態で敢えてボタンをクリックすると、あと何件で必須を満たすかのメッセージをダイアログで表示するとともに、条件を満たしていない入力欄へスクロールで戻してくれます。

通常、入力を満たしてない状態で、送信ボタンをクリックするユーザーは少ないと思いますが、そんなマイナーな状況に対しても対処しているホームズ。そこまでやりますか…の感あり。

あえてクリックすると…

↓↓↓↓↓

ダイアログ表示後、スルスルと上部にスクロールして戻される。
必須を満たしていない入力項目のうち一番上のものにフォーカスした状態に。

【スーモ】メールアドレスの入力欄が大きく入力しやすい

離脱ブロック、ガイド、サブミットブロックは「なし」と入力補助機能では、控え目なスーモですが、メールアドレスの入力欄が大きく、入力しやすいという点を挙げておきたいです。

メールアドレスは、インターネット上での問い合わせという性質上、大抵の入力フォームで入力必須とされる入力項目だと思いますが、必須となる一方で、半角英数字の文字列による入力は、特に初めての問い合わせにおいては、入力候補もでてこないし、入力しづらい項目の代表だと思います。そこへ来て、スーモのこのメアド入力欄の大きさ。

特定の入力項目だけ大きくするというのは、デザイン上はやや違和感を感じる向きもあると思いますが、入力しやすさ=離脱を防ぐという実利をとったスーモの判断と言えると思います。

見よ、このメアド入力欄(画像中央)の巨大さ

一方、ホームズはそういうことはしない

ちなみに確認ページ…押さえどころは共通していた

・確認ページであり、まだ送信完了していない旨のメッセージ表示
・送信ボタンと戻るボタンのメリハリが大きい
という工夫が見られました。

まだ送信完了してませんよ、確認ページですよ…のアピール

ホームズの確認ページ上部

スーモの確認ページ上部

送信ボタンと入力に戻るボタンはメリハリつける

ホームズの送信ボタン(中央、青)と修正ボタン(左)のメリハリ!「修正する」の所在なさ。

スーモの送信ボタン(中央、オレンジ)と修正ボタン。修正ボタン(左)は、ホームズよりデザイン性を意識。

【まとめ】
技術上の工夫できめ細かく離脱を逃すまいとするホームズ、
技術は控えめでも2種のフォームの使い分けと独自レイアウトで入力しやすさを実現するスーモ

離脱ブロック、サブミットブロック、ガイドなど技術上の工夫、またフォームをシンプルにすることで、
とにかく離脱を減らしたい=CV数を集めたいという意思が感じられたのがホームズ。

一方、スーモは、離脱を減らすことにはさほど注力していない印象ですが、巨大なメールアドレス入力欄や、プロフィール呼び出し機能など、独自の工夫で、入力しやすさを実現し、また問い合わせフォームと見学フォームを使い分けることで取得する情報の質を維持したいという意思が感じられました。

home’s http://www.homes.co.jp/
SUUMO http://suumo.jp/

【最後に】

いかがだったでしょうか?同じ不動産業界の問い合わせフォームでも、相違点を見ていくことで、それぞれのフォームの姿勢のようなものが垣間見えた気がします。

さて、本記事で話題に挙げた
・アラート吹き出し/テキスト表示
・必須項目の色付け、条件を満たしたら色を消す
・ガイド表示
・離脱ブロック機能
・サブミットブロック機能
といった機能は、当社エフトラEFOで、フォームにタグを貼るだけで実装可能です

今ならトライアルでのご利用は、1ヶ月間無料です。下記からお問い合わせください。


機能、料金、導入に関するご相談等、まずはお気軽にご連絡くださいませ。

この記事が気に入ったら
いいね!しよう

UI改善ブログの最新情報をお届けします

エフトラEFO機能アイコン

UI改善ブログを運営する株式会社エフ・コードでは
UI改善の基本施策を簡単に実施できる「エフトラEFO」「エフトラCTA」を開発しています。

エフトラEFOサイトへ エフトラCTAサイトへ

UI改善ブログ by f-tra の購読

当ブログの更新情報は以下の各種アカウントから購読できます。

メールマガジンを購読する

ブログの更新情報やセミナーのお知らせなど、
UI改善に関する情報を1~2週間に1回お届けします。

メールアドレスを入力

 購読解除はいつでも可能です