ツールなしでもここまでできるフォーム改善14カ条

かんたんフォーム改善

WEBサイトの改善には、お客様の流入数を増やすだけでなく、お問い合わせが発生する「フォーム」の改善がとても重要です。今回はエントリーフォーム最適化(EFO)、ツールを使わなくても簡単にできる、抑えておきたい改善ポイントについての記事です。

ユーザが離脱するタイミング

EFOを行なうにあたり、まずは離脱タイミングを検証することが重要です。離脱タイミングを検証し、それぞれに対して施策を繰り返すことで、フォームを改善していきます。

フォームでの離脱タイミングについて、以下のように分類できます。

  • 入力ページでの離脱

    1. 直帰
    2. 入力途中離脱
    3. エラー発生時離脱
  • 確認ページでの離脱

大きな分類として「入力ページでの離脱」「確認ページでの離脱」があります。
入力ページについてはさらに、フォームに到達したのに入力せずに離脱してしまう「直帰」
入力を始めたのに途中で離脱してしまう「入力途中離脱」
送信ボタンを押したのに入力内容のエラーが表示され離脱してしまう「エラー発生時離脱」に分けられます。

今回は「ツールなしで」がテーマなので、
ツールでの解析を行なわなくても抑えておきたいポイントと、
参考としてどの離脱タイミングに影響するのかを載せるという形でまとめました。

1. オファー画像の設置直帰対策

免許hunterオファー
免許合宿hunter(当社メディア)のパンフレット請求フォーム オファー画像)

フォームの目的を明示したオファー画像を設置することで、ユーザの不安を解消します。
例えば、無料パンフレット請求フォームであれば、「どのようなパンフレットなのかを示した写真」や「無料」という文言の入った画像を設置します。

2. ステップを明確にする直帰対策入力途中離脱対策

20130829_flow_h
勝手にフォーム分析で取り上げたhome’s(株式会社ネクスト様)のステップ画像)

フォームの上部に、「入力/確認/完了」などの現在の位置と今後のステップがわかるチャートを表示することで、ユーザが迷子にならないようにします。

3. 余計なリンクを入れない直帰対策入力途中離脱対策

グローバルナビやサイドバーを削除し、フォームから移動できるリンクを減らすことで、ユーザをフォームに集中させることができます。

4. 必須項目、任意項目を明記直帰対策入力途中離脱対策エラー発生時離脱対策

お名前必須
お名前任意

必須項目を明確にすることで、ユーザがきちんと入力が必要な項目を把握できます。
「*」や「★」などではなく、きちんと「必須」という文言で示した方が、特にライトユーザの勘違いを防止できます。

5. 不要な項目は入れない直帰対策入力途中離脱対策

任意入力でほとんど入力されない項目、必須にしているが利用していない情報などを削除することで、項目数が減り、ユーザストレスを軽減できます。

6. 項目をまとめる直帰対策入力途中離脱対策

名前や電話番号、郵便番号などの項目で複数に分かれているものをまとめることで、項目数、不要な項目の移動が減り、ユーザストレスを軽減できます。
特にスマートフォンでは、画面が小さく項目の移動のストレスが大きいことから、項目をまとめることによる改善の効果が期待できます。

7. 項目を横に並べないエラー発生時離脱対策

フォームは縦に進んでいくものなので、関連の無い項目が横並びになっていると入力漏れが生じる可能性があります。
電話番号を携帯番号が横並びで、ともに必須項目である場合などがあります。

8. input typeの活用(スマートフォン)
入力途中離脱対策

スマートフォンでは、inputタグのtypeの指定によって、キーボードを切り替えることが可能です。
例えば、電話番号の入力欄に対しtypeを=”tel”を指定することで、日本語入力のキーボードではなく、電話番号入力のキーボードを表示することが可能です。

9. ラジオボタン、チェックボックスはラベル(文字)をクリックできるようにする
入力途中離脱対策

ラジオボタン、チェックボックスではなくラベル(文字)をクリック可能にすることで、ユーザビリティが向上します。実際にクリックして確認してみてください。

文字をクリック出来ないチェックボックス
文字をクリック出来るチェックボックス

10. 記入例の明記、placeholderの活用入力途中離脱対策エラー発生時離脱対策

入力例をきちんと示すことで、入力方法の迷いや、入力エラーの発生を軽減できます。
(入力例を記載した場合と、入力例をplaceholderで表示した場合)

電話番号必須 ※半角数字で入力してください(例:0362728993)
電話番号必須

11. キャンセルボタンは設置しない入力途中離脱対策

送信ボタンの近くに設置してあるキャンセルボタンを誤って押してしまった場合、意図せず入力内容が、全て消えてしまいます。キャンセルボタンの必要性はほとんどのフォームにおいて低いので、そもそも設置しないことでユーザのミスを防ぎます。

12. 送信ボタンは大きく、アクションを示す入力途中離脱対策

20130829_btn_s
勝手にフォーム分析【不動産ポータル 物件問い合わせ編】で取り上げたSUUMO(株式会社リクルートホールディングス様)のボタン)

「送信」「確認」というラベリングではなく、「入力内容を送信する」「入力内容を確認する」とアクション内容を明確に示すことで、フォームを送信するユーザの心理的障壁を下げることができます。

13. 個人情報取扱への同意はフォーム内で行うその他

フォーム前後での無駄なページ遷移は、離脱を招くことから、個人情報取扱への同意はフォーム内でチェックボックスを用いて行ないましょう。

14. 確認ページをなくす確認ページでの離脱対策

確認ページで気持ちが変わって離脱するユーザ、ライトユーザでは確認ページへの到達で送信が完了していると勘違いするなど、確認ページでの離脱は意外と多く、入力ページから直接送信できるようにしてしまうことで、CVは上がる傾向にあります。
ただ、入力項目が多いフォームや、お申込みフォームなどでは、間違った内容での送信が増える可能性があり、リアルタイムでのエラーチェックなど、注意・対策が必要です。

まとめ

14カ条ということで、フォーム最適化(EFO)を行なう上で押さえておきたい点を挙げましたが、
・どのような目的のフォームなのか示す
・入力項目数を減らす
・ユーザの勘違いを減らす
ということを意識して、改善を進めていきましょう。
離脱タイミングを検証して改善を行なうで、より効率的な改善が可能になります。

それぞれの改善を詳しく紹介しています

「1. オファー画像の設置」「2. ステップを明確にする」について
エントリーフォーム改善に知識は必要ナシ!誰でも知ってる○○○?

「3. 余計なリンクを入れない」について
気にするほど気づかない?エントリーフォーム改善のたった一つの大問題

「5. 不要な項目は入れない「6. 項目をまとめる」「7. 項目を横に並べない」について
エントリーフォームを改善するなら、不要な項目は消してくれ!

著者:小木曽正佳

かんたんフォーム改善

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

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

エフトラEFO機能アイコン

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

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

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

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

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

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

メールアドレスを入力

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