Smile Blog

スマイルヴィジョンスタッフが運営する広報ブログ

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

66a4ab51ed9ffc879ff0cf5064d744e7_m

 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^)/

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

いろは

いろは

■部署
開発部

■スペック(Level、身長、座高、属性、資格)
水属性(95℃)

■入社年
2017年

■趣味
ごはん(つくる)、白と茶色模様の犬、ボウリング、8bit

■座右の銘
明けない夜はない

■ひとこと
スキレットの錆がとれない

関連記事

  1. J18ZCO3IPA

    ビジネスバッグは最後のオシャレ

  2. SUMMER SONIC 2016行ってきた

  3. はなまるudon

    【食べてみた】暑い夏にピッタリ!?期間限定ビリビリサンラーうどん!

  4. 石田三成CM

    話題沸騰!石田三成CM続編公開!

  5. ひょうご就職サミット2018

    今年も開催!! 集まれ!未来の幹部候補! 合同企業説明会迫る!

  6. 0

    2017年度 経営計画発表会が開催されました

  7. Photoelly039_TP_V

    Webエンジニア初心者が知っておきたいこと

  8. tsukutte11

    【作ってみた】KeynoteとSkitchを使用した画像加工方法(macユーザー向け)

人気記事

  1. クリアボタン
  2. mv
  3. 9f803b3532fa44bcb3001cac6734d898_m
  4. 安い!美味い! 【大阪天満・天神橋筋商店街の食レポ】
  5. 新入社員研修「伝える+伝わるセミナー」
  6. tukutte08
  7. タイ料理「天満3パクチー」
  8. 2017年スタートアップトレンド (アメリカ版)
  9. 大阪天満天神橋筋商店街がっつりBEEF_KINGOFSTEAK

最近の記事

  1. IMG_1502 (1) 会議室とイベントスペースの違い・活用方法
  2. sslservice 常時SSLサービス 2018年7月よりいよいよ警告が表示
  3. tsukutte11 【作ってみた】KeynoteとSkitchを使用した画像加工方法(macユーザー…
  4. gatag-00014199 中小企業でも増えている「自社独自の採用サイト」
  5. mv_ssl01 「常時SSL対策」セットアップサービスについて
2018年7月
« 6月    
 1
2345678
9101112131415
16171819202122
23242526272829
3031  
PAGE TOP