EFO(入力フォーム最適化)で成約率を上げる10のテクニック | DXシステム開発・WEB制作 SmileVision|大阪のWEBシステム開発 SmileVision

社員ブログ EFO(入力フォーム最適化)で成約率を上げる10のテクニック

 EFOとは?

ども、こんにちは!開発部のいろはです。
EFO(エントリーフォーム最適化)とはEntry Form Optimizationの頭文字を取った略語です。
主にお問合わせフォームや、資料請求フォームなどで、
入力の手間を減らしより短時間で正確に入力完了できるように最適化し、
送信率をアップさせ利益につなげるよう対策されています。
入力項目や意図しないエラーが発生するとユーザーの約7割は
入力の途中で離脱するという報告もあります。
(参考:エフトラEFOブログより)
そこで今回はユーザーが目的達成し、サイトのコンバージョン率をアップさせる
EFOのテクニックを10個ご紹介いたします。

 成果を上げるテクニック10選!

1:住所を自動入力させる

img1-1
郵便番号を入れると自動で住所を入力するものです。
近年では住所自動入力をしているフォームが増えてきているため、
自動入力でないだけでもユーザーの離脱率は増えると言われています。
「ajaxzip3」や「YubinBango」という
javascriptライブラリを導入することで
郵便番号より住所を自動入力することができます。
(詳しくはこちらをご覧ください)

2:必須・任意を明記する

img2
各フィールドに必須・任意を付けることで
ユーザーの勘違いや入力漏れを防ぐことができます。
ユーザーが心理的に提供したくない情報は
任意と明記することで離脱を防ぐことができます。
また、「※」や「*」で表示される場合もありますが、
これでもわかりにくいので必須・任意のラベルを貼りましょう!

3:リアルタイムで入力エラーを指摘する

img3
ユーザーが入力直後に何かしらのエラーがあれば、
入力エラーを色や動きで表示して警告すると注意を引くことができます。
フォーム送信時よりも、直後に指摘される方が後で探す手間が省けるのでストレスは少なくすみます。

4:エラー表示は項目付近に表示させる

img9
エラー文は冒頭部分にまとめて表示するとユーザーの探す手間がかかるので、
該当項目付近に表示されるようにしましょう。

5:入力内容の保持

入力ミスや送信エラー時に、入力した内容が消えてしまうことがあります。
全て消えてしまうとユーザーは最初から入力しなければいけないので、非常にストレスを感じます。
エラー時には入力内容が消えないように設定しましょう!

6:再入力欄のデメリット

メールアドレスなどを入力する際に、入力ミス防止のため再入力欄が設けられていることがあります。
しかし2度同じ内容を入力するのはユーザーにとっては手間がかかります。
さらには一度目の内容をコピーペーストした場合は無意味となってしまいます。
再入力欄の代わりに正規表現を使用し、
意図しない値が入力された場合はエラーを表示するという方法も一つです。
■正規表現のサンプル(PHP)

7:プレースホルダーを使用する

img6
入力例がある場合とない場合をぱっと見の印象だけでも大きく異なります。
入力例を表示していないフォームはエラーやミスの原因となりますので、
何を入力してほしいかの例を詳しく記載しておきましょう!

8:サジェスト機能を使用する

img7
サジェストとは英語で「示唆する」「提案する」などの意味があり、
訪問者の要望を先取りして、候補を情報をサイトに表示するのがサジェスト機能の役割になります。
例えば、メールアドレスの@以降の候補を予想し、入力欄の下に表示させるようにします。

9:ポップアップの警告

img5
例:三井住友銀行グループモビット(モビットカード申し込みページ)
入力画面で誤ってブラウザの閉じる(✕)や戻るを誤爆した方多いかと思います。
私もそのうちの一人です(笑)
せっかく入力した情報が消失してしまうと離脱の原因になりますので、
ポップアップ表示を出してお知らせすることで誤操作を未然に防ぐことができます。

10:不要なリンクは外す

img10
お問合わせページ周辺に、広告や関係のない外部リンクが貼られている場合はすべて排除するのが無難です。
フォームの目的は入力内容に答えて送信ボタンをクリックしてもらうことですので、必ず外すようにしましょう!

まとめ

いかがでしたでしょうか。
せっかく興味を持って訪問されたにも関わらず、ユーザーが離脱してしまうということは非常にもったいないものです。
商用でホームページを設置する場合は、お問い合わせフォームの必要性や改善点について
しっかり基本を理解しておくことが大切です。
何事も土台を固めるのも大事ですね!
本記事を参考にフォーム作りのお役に立てれば幸いです\(^o^)/

ABOUT ME
いろは
いろは
2017年入社 開発部所属のいろはと申します! 当ブログではWordPressなどWEBに関するアイデアや応用例をを中心に発信して参ります。