勝手にEFO比較分析【ぐるなび x ホットペッパー】(グルメ系サイト会員登録編)

やってきました「勝手にEFO比較分析」。

春は出会いと別れの季節ですね。
歓送迎会などの幹事を任されている方もいらっしゃるのでは?
お店探しに難航、なんてこともあると思います。そんな時に役に立つのがグルメ系サイトですよね。
そこで今回は、グルメ系サイトの会員登録フォームに注目してみました。

題材は、飲食店の情報を集めたウェブサイトを運営する株式会社ぐるなび様(http://www.gnavi.co.jp/company/)(以下、本記事ではぐるなび)と、
株式会社リクルートホールディングス様が運営する全国の飲食店検索サイトのホットペッパーグルメ(http://www.hotpepper.jp/)(以下、本記事ではホットペッパー)をセレクトさせていただきました。

※以下、サイト名の敬称は省略させていただきます。

いつもどおり「勝手に分析」していきましょう。
今回もEFOの改善ポイントを「勝手に」指摘していきますので、どうぞお付き合い下さい。
○△×と、ユーザー視点での評価を行っていきます。

※本記事の内容は2014年3月31日時点のぐるなび様、ホットペッパー様、両社のサイトのフォームを分析した内容を記載しています。
なお今回ご紹介したどのフォームにも当社エフトラ EFOの入力補助機能は導入されていません(2014年3月31日時点)。

まずはEFO基本項目の確認です。

ぐるなび ホットペッパー
ページ数 入力、確認、借り登録メール受信、クリックで完了の4つ アドレス入力、メール受信後入力、確認、完了の4つ
入力項目の種類 4種類 10種類
必須項目入力欄の数 6個 11個
フロー あり あり
オファー あり 登録画面の前にあり
必須マーク オレンジで「必須」マーク 赤で「必須」マーク
メルマガ購読 あり(デフォルトでなしにチェック) デフォルトチェックあり
利用規約、
プライバシーポリシー
ページ下部にあり ページ下部にあり
送信ボタンのサイズ 幅230px x 高さ40px 幅190px x 高さ40px
入力画面のレイアウト 専用ページ 専用ページ
入力ページへの遷移 トップページの会員登録から トップページの会員登録から

基本的にグルメサイトは、ウェブ上で全てが完結するサービスです。
「今すぐ情報を入手したい!」というときに、入力フォームの項目数が多いとうんざりしてしまいますよね。。。
今回、両社とも、必須項目はかなり厳選されている印象でした。

違いが出た任意項目!

ぐるなびは、全体の項目自体がかなり少なく、任意項目はメルマガ購読のみ。これもデフォルトでチェックが入っていました。
とにかく、メールアドレスのみ情報を得る!と決めているフォームで、潔さを感じます。
ホットペッパーは、項目数は多くないですが、任意項目で住所や電話番号を聞いていました。自宅に資料などが送られてくるようなこともほとんどないと思うので、思い切ってカットして、項目数を減らすのも一つの手です。

ぐるなび
項目が少ないので、ファーストビューにほとんど収まっていますね。
ホットペッパー
すっきりとしたレイアウトは見やすいですね。

またぐるなびは、ファーストビューにおさめる手法として、入力欄をマウスでクリック(フォーカス)したときのみ、入力のヒントを表示させていました。
非フォーカス時はヒントが表示されないので、省スペース、かつ、すっきりした印象になります。
このような手法は、ぜひ取り入れていきたいですね。

ぐるなび
少ないスペースでヒントも表示出来るのが良いと思います。

ユーザーに優しい便利機能!

ぐるなびは、様々なSNSからのログインや、オンラインでの特典などが準備されていました。
飲み会のお誘いなどで、SNSを利用する機会も増え、より便利に使える機能が増えているなと感じました!

ぐるなび
オファー表示自体もわかりやすく、参考になります。

最初の項目にこだわる!

直帰を防ぐための方法として、最初の項目にこだわる、ということを過去記事入力フォームの最初の項目を入力しやすくするだけでユーザーの直帰は減らせる  勝手にEFO分析-エントリーフォーム改善でもお伝えしています。
最初の項目が頭を悩ますようなものだと、ユーザーのイライラにつながり、直帰となってしまいます。
ホットペッパーの初めの入力項目が、「パスワード」でした。
パスワードは、禁止文字列があったり、文字数制限があったりと、入力難易度高めの項目なので、1番最初の項目にするのは避けたほうが良いと思います。

ホットペッパー
「氏名」や「生年月日」などは、頭を使わずすらっと入力出来ますよね。

送信ボタンにこだわる!

どんなに項目数を減らして入力の手間を省いても、最後に「送信」ボタンを押してもらえないことには、完了につながりません。
このブログの中でも、何度もお伝えしているのが、「送信ボタンにこだわる」ということ。
色やサイズにこだわり、「送信ボタン」としてのアピールが出来ていることが大切です。

ぐるなび
色やサイズでとても目立っていると思います。
ホットペッパー
色を少し変えて、もっと存在感を出しても良いかもしれません。

入力補助機能は、検討の余地あり!

機能名 ぐるなび ホットペッパー
ガイド

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

なし なし
離脱ブロック

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

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

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

なし なし
項目ごとのアラート表示

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

フォーカス時:あり
エラー時:あり
フォーカス時:なし
エラー時:あり
項目ごとに入力完了後の動作 なし なし

入力項目が少なくても、うっかり離脱はあり得ることだと思います。
少しでもユーザーに優しく、完了に導く機能の導入は検討の余地があると思います。

勝手にフォーム改善アドバイス

今回のEFO比較分析は以上となります。
前回と同じく分析に加え、こうすれば良くなるのではないかという改善案を、考えてみました。

ぐるなび

メルマガにもこだわる!!

せっかくのメルマガ配信の機会ですが、デフォルトのチェックは「NO」に入っていました。
ぜひ「YES」に変えて、配信の機会を増えせると良いと思います。

ホットペッパー

正確なフロー表示を!

フロー表示で、「会員情報の入力・確認」と、入力と確認が、ひとまとめになっていました。
この表示だと確認ページに気付かずに、完了までたどり着かないユーザーもいるのでは、と思いました。
「入力」と「確認」を分けて表示することで回避できると思います。

まとめ

現地に行かなくてもお店の雰囲気や評価がわかり、どんどん簡単に情報が取れる時代になっています。
会員登録もより簡単に、ユーザーにとって親切なものになるとより良いですね。

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

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

エフトラEFO機能アイコン

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

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

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

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

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

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

メールアドレスを入力

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