勝手にEFO比較分析【トヨタ×アウディ】(自動車メーカーメルマガ会員登録編)

5月に入り、行楽シーズン真っ只中。
遠出する機会も増えてくるのではないでしょうか。

今回比較するサイトは、日本が世界に誇る自動車メーカー・トヨタ自動車株式会社様(http://toyota.jp/)(以下、トヨタ)と
フォルクスワーゲン(ドイツ)傘下のメーカー、アウディ・ジャパン様(http://www.audi.co.jp/)(以下、本記事ではアウディ)です。
1999年よりル・マンの技術革新に貢献し、レース表彰台の常連のアウディ、
一方、自動車メーカー初・年間台数1000万台を超えたトヨタ。
この2社のフォーム、果たして車のように使用感が良いのはどちら!?

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

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

※本記事の内容は2014年5月7日時点のトヨタ、アウディ、両社のサイトのフォームを分析した内容を記載しています。
なお今回ご紹介したどのフォームにも当社エフトラ EFOの入力補助機能は導入されていません(2014年5月7日時点)。

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

トヨタ アウディ
ページ数 会員規約同意、会員情報入力、入力内容確認、仮登録完了、本登録完了の5つ 入力、確認、完了の3つ
入力項目 18種類 16種類
必須項目入力欄の数 8個 35個
フロー あり あり
オファー あり(規約同意上部) なし
必須マーク あり(※マーク) なし(任意マークあり)
利用規約、
プライバシーポリシー
別ページ 別ページ
送信ボタンのサイズ 幅171px x 高さ36px 幅152px x 高さ33px
入力画面のレイアウト 他ページと共通 他ページと共通
入力ページへの遷移 ログイン
→新規会員登録をご希望の方はこちらから
メールマガジン
→Audi Newsletterのご登録はこちらから

オファー、入力画面に差

今回はトヨタが規約の上に、オファーとも取れる一文を載せていましたが、アウディはそれらしきものはありません。

また、入力画面にも大きな差が。トヨタは必須項目以外をアウトラインにすることにより、任意項目は非表示でスッキリに。
一方アウディはページにあるフォームの全てが必須となっており、おなじみの必須マークの代わりに”任意”マークがありました。

入力項目はほぼ同じ数、必須入力個数に差

両社とも18、16種類と少し多めの項目数でした。
しかし、必須入力個数に大きな差が見られました。
というのも、トヨタはメルマガ登録に必要最低限の項目しか必須としていません。
一方アウディは繰り返しとなりますが、ページにある全ての項目が必須と言っても過言ではありません。
そのためかトヨタの約4倍の入力個数となっていました。

トヨタ
必要最低限の必須項目を表示することにより画面スッキリ。ただし下方のリンクが入力の集中を妨げる可能性も。
toyota_02
ng_bwアウディ
必須となっているお客様情報登録が多く、画面も長い。また、そのためか任意マークのみ表示あり。
audi_02

送信ボタンに差!

送信ボタンはアウディがボタンを二色にして並べることにより、登録をスムーズに誘導していると感じました。
またページのヘッダーやフッターに余計なリンクがないため、うっかりページ遷移してしまい送信できない…というリスクも小さいのでは。

対してトヨタは、同じくボタンを並べていましたがデザインが全く一緒なので、送信するつもりがうっかりもどってしまう危険が。
またフッターに不要なリンクがたくさんあり、こちらも誤ってクリックしてしまう可能性が否めません。

ng_bwトヨタ
全く同じ形状のため、誤って前画面に戻ってしまう可能性が。toyota_01
アウディ
登録ボタンを赤で強調することにより、登録の誘導がスムーズに。audi_01

次は入力補助機能を見ていきます

機能名 トヨタ アウディ
ガイド

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

なし なし
離脱ブロック

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

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

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

エラー時にブロックあり エラー時にブロックあり
項目ごとのアラート表示

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

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

エラー表示は引き分け!

トヨタとアウディですが、エラーの際該当箇所のフォーム内の色を変えるか、入力セルの色を変えるかの違いで、
表示はほぼ一緒でした。
もちろんエラー内容もフォームの近くに表示されます。
ただ、アウディが上部にエラーで色のついたセルのアナウンスをしていたので、こちらのほうが少し親切かもしれませんね。

トヨタ
フォーム内に色を付けて、下部にエラー内容を表示。
toyota_03
アウディ
こちらはセルに色を付けて表示。最上部にも短くアナウンスが表示されている。
audi_03

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

今回のEFO比較分析は以上となります。
それではいつもどおり、それぞれの改善案を”勝手に”提案していきましょう。

トヨタ

シンプルですし最低限必要な項目しか表示されていない良いフォームではありました。
ですが1点挙げるとすれば、確認画面の送信ボタンと戻るボタンの配色、もしくは配置でしょうか。
再度申し上げますが、全く同じ形状のため押し間違いが起きてもおかしくありません。スムーズに登録を誘導するためデザインにメリハリを付けると良いです。
また確認画面も任意の項目部分も含めて全表示になり、すぐに送信ボタンを押せないので、こちらも不必要な部分は隠してしまってもいいかもしれません。

アウディ

とにかく入力項目(と必須項目)が減らすことが先決です。
今回のフォーム入力の意図は、メールマガジンの送信。そのために必要な情報といえばメールアドレスとID、パスワード。極端な話、この最低限の情報さえ取得できればメルマガは配信できます。

また顧客により詳しい個人情報を登録させる必要があるのであれば、ガイドと離脱ブロックがあると良いでしょう。ユーザーも項目残数を把握し、誤って他のページやサイトへ飛びせっかく入力したものを消してしまう、ということも防ぐことができます。

まとめ

いかがだったでしょうか。
クルマは大きな買い物。情報収集のため、メーカーを横断して検討する人がほとんどだと思います。WEBも検討のうえでかなりの役割を担っていることでしょう。
せっかくフォームを訪れたユーザーを逃すことのないよう、しっかりとEFO対策をしておきたいですよね。

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

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

エフトラEFO機能アイコン

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

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

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

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

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

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

メールアドレスを入力

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