Webサイトを通じた新規顧客獲得は、Webマーケティング戦略の中核を担います。

入力フォームはユーザーをコンバージョン(CV)に導くための最後の地点であるため、

Webマーケティングにおいて、入力フォームはCVR(コンバージョン率)の向上において重要な要素です。
しかし、多くの場合は入力フォームがユーザー体験のボトルネックとなり、潜在顧客の離脱を引き起こしてしまっています。

CVR最大化のため行われる、フォーム改善の施策は一般に「エントリーフォーム最適化(EFO)」と呼ばれ、その手法は様々です。
ここでは、フォーム改善のための具体的なポイントを深掘りします。

フォーム改善のポイント

入力項目の最適化

不要な入力項目を削除する

フォーム改善の始めに、不要な入力項目がないか確認しましょう。不要な入力項目はユーザーに手間を与えるだけでなく、不信感を抱かせてしまいます。フォームは住所氏名など個人情報が多いので、入力項目が多いとユーザーは個人情報を多く渡すため不信感を抱きやすくなります。

そのため、不要な入力項目がないか確認し、不要な場合は削除するようにしましょう。

フォーム入力を完了させるためには、できるだけユーザーの労力が少ないことが望ましいです。不要な入力項目は、ユーザーの負担・不信の原因となり、離脱を引き起こしてしまいます。例えば、購入フォームであれば、氏名・住所・決算方法など必要最低限の情報のみを求めることが重要です。

リアルタイムでエラー検知をする

入力完了後にエラーが判明すると、ユーザーはエラーの箇所を探す必要があり、ストレスとなります。
リアルタイムでのエラー検知は、ユーザーがエラーを即座に修正できるようにしましょう。

アクティブな入力項目を目立たせる

入力最中の項目の、枠線や背景の色を変えるなど、入力している項目をわかりやすくしましょう。
入力項目を目立たせることで未入力項目を減らすことが可能になります。

入力例を入れる

電話番号や郵便番号などはハイフンをつける、つけないというのがフォームによって異なるなど、ユーザーは判断に迷う部分が多く存在します。
そのため、入力例がないと入力エラーが生じやすく、ユーザーにストレスを与えてしまいます。
入力エラーでストレスを与えないよう、フォームに入力例を入れ、ユーザーがスムーズに入力できるよう整えるのがおすすめです。

電話番号や郵便番号であればハイフンの有無や、全角・半角文字の使用など、フォームによって要求される入力形式が異なるため、ユーザーにとっての混乱やストレスの原因となり得ます。

ユーザーがスムーズにフォームを完了できるようにするためには、入力例を提供することが非常に効果的です。
入力例をフォームに明示することで、ユーザーは正しい入力形式を理解し、適切に情報を入力できるようになります。例えば、電話番号の入力欄の下や横に「例: 03-1234-5678」というような具体的な入力例を示すことで、ユーザーはハイフンの位置や数字の区切り方を即座に把握できます。

正しい形式での入力を促すことで、フォーム送信後のエラーチェックや修正の手間を減らすことも可能となります。

フォームのデザインの最適化

不要な導線を削除

入力フォームの設計において、別ページへ飛ぶボタンやメニューなど、不要な導線はなくすようにしましょう。
不要な導線があるとユーザーが別のことに興味を持ち離脱するだけでなく、誤って遷移してしまいストレスを与える可能性があります。
出来る限り、ユーザーがフォーム入力に集中できるようにしましょう。

CTA文言の明確化

行動を促すCTAボタンの文言は明確にするようにしましょう。ボタンの文言が「内容を確認」だったら確認ページに遷移するという事が伝わり、「内容を送信」だとそのまま送信されることが伝わります。
「お疲れ様でした」・「SEND」など曖昧な表現や伝わりにくい表現は避け、次の行動が伝わる文言にしましょう。

おすすめの例は、以下の通りです。

  • 今すぐ登録する
  • 無料トライアルを始める

CTA文言を考える際のポイントとして、「動詞を使いアクションを明確にする」・「緊急感を演出する」・「メリットを強調する」・「簡潔にする」などが挙げられます。

以上の点を踏まえてCTA文言を考えましょう。

フォーム完了のベネフィットを明記

フォームには住所や氏名などの個人情報が含まれるため、項目が多すぎるとユーザーが不信感を抱き離脱する可能性があります。入力情報を何に活用するか明記し、ユーザーの不信感を払拭するようにしましょう。

入力情報を活用方法を明記

フォームには住所や氏名などの個人情報が含まれるため、項目が多すぎるとユーザーが不信感を抱き離脱する可能性があります。
入力情報を何に活用するか明記し、ユーザーの不信感を払拭するようにしましょう。

フォーム機能の強化

フォームの自動保存機能

ページを離脱すると入力項目が消えてしまい、1から入力をし直す必要があるという状況は

ユーザーに大きなストレスを与えます。興味を失った、通信状況が悪い、急遽やらなければいけないことがあったなど、ページ離脱には様々な要因が考えられます。再訪時に以前の入力内容が保持されていることで、ユーザーがストレスなく入力を再開できるようにすることで、入力完了率が高まります。

フォームの必須項目数の明示

フォームの必須項目数を明示することも重要です。必須項目数を明示することでユーザーはどれくらい手間・時間がかかるか把握しやすくなりストレスを軽減できます。
また、必須項目数を明示することでユーザーが未入力の項目に気づき、未入力エラーを減らす効果も期待できます。入力進捗が分かるプログレスバーを表示させることも有効です。

郵便番号から住所の自動補完

文字数が多く、正式住所の入力はフォーム入力において最も手間がかかる部分です。
そのため郵便番号を入力すれば、途中まで自動で住所が入力される自動補完機能を実装し、容易に入力が出来るようにしましょう。

フォームの読み込み速度の改善

ユーザーは必ずしも快適な通信環境でサイトを閲覧しているとは限りません。中には電車など通信環境が良くない場所におり、フォームを読み込む速度が遅いかもしれません。
そのような状況だとユーザーはストレスを感じ、離脱してしまう可能性があります。

その点を踏まえ、ユーザーが快適にフォーム入力できる環境を整えるためにフォームの読み込み速度に問題がある場合は改善しましょう。

スマートフォン最適化

総務省の令和4年版情報通信白書によると、インターネットの利用率はスマートフォン68.5%で、パソコン48.1%を20%以上上回っています。
このように、ユーザーがサイトを閲覧する際はスマートフォンを使用している可能性が高いため、フォームをスマートフォンに最適化させることも重要となります。

参照リンク

入力項目のサイズを確保

スマートフォンはパソコンと比べ画面が小さく縦に長いため、パソコンに最適化されたフォームでは入力項目のサイズに問題がある可能性があります。パソコンだと画面も広いため横スクロールの必要がなくても、スマートフォンの画面には大きく、横スクロールが必要となりユーザーに余計なストレスを与える可能性があります。

スマートフォンでフォームを確認し、入力項目のサイズに問題がある場合は入力項目のサイズを改善しましょう。

入力項目に合わせてキーパッドの最適化

入力項目は多岐にわたるため、ユーザーはひらがな・漢字・英数字など多様な種類の文字を使用することになります。ユーザーの入力の手間・ストレスを軽減するため、住所を入力する際は始めからフリック入力のキーパッド、電話番号なら数字のテンキーなど、最も使用すると想定されるキーパッドを表示するのがおすすめです。

これを実現する際におすすめなのがHTML5です。HTML5では、フォーム入力の際にユーザーの入力を容易にするために、input要素のtype属性を使って、特定の種類のデータを入力するための最適なキーボードや入力方法を指定することができます。

住所入力用のフリック入力キーボード

住所入力の場合、一般的には通常のテキスト入力が適しています。HTML5では、input要素のtype属性にtextを指定します。これにより、デフォルトのテキスト入力キーボードが表示されます。ただし、モバイルデバイスにおいてフリック入力を強制する方法はHTML5の標準仕様には含まれていません。ユーザーのデバイスや入力設定に依存します。

html

<label for=”address”>住所:</label>

<input type=”text” id=”address” name=”address”>

電話番号入力用のテンキー

電話番号の入力では、ユーザーが数字のみを簡単に入力できるように、input要素のtype属性にtelを指定します。これにより、多くのモバイルデバイスでは数字専用のテンキーが表示されるようになります。ただし、実際にどのようなキーボードが表示されるかはブラウザやデバイスによって異なる場合があります。

html

<label for=”phone”>電話番号:</label>

<input type=”tel” id=”phone” name=”phone”>

注意点

input要素のtype属性を使っても、すべてのブラウザやデバイスで期待通りのキーボードが表示されるとは限りません。特にデスクトップブラウザでは、これらの属性が入力の補助にどの程度影響を与えるかは限定的です。

ユーザーの入力体験を向上させるためには、placeholder属性やpattern属性を使用して、入力されるべき内容の形式を示唆することも有効です。

セキュリティやプライバシーを考慮し、特に電話番号のような個人情報を扱う際には、適切な対策を講じることが重要です。

HTML5のinput要素とそのtype属性を適切に使用することで、ユーザーがデータを入力する際の使いやすさを大きく向上させることができます。

住所の例

電話番号の例

入力項目配置の最適化

スマートフォンでサイトを見る際、ユーザーは指で操作を行います。指だと細かい操作は難しいため、入力項目の間隔が近すぎるとユーザーは誤ってタップしてしまい、ストレスを与えてしまう可能性があります。

このような事態を避けるため、入力項目の距離は適切に離して設置しましょう。

回線速度の最適化

上記でフォームの読み込み速度について重要であると述べましたが、スマートフォンではより重要となります。
スマートフォンはパソコンと比べ持ち運びが容易なため、ユーザーは家や電車、外出先など様々な場所で使用することが想定されます。

これらの場所は通信環境が良いとは限らず、サイトが読み込まれないことにストレスを感じ、途中でサイトから離脱してしまう可能性があります。このようにスマートフォンでは回線速度が遅いことがパソコンより問題となりやすいため、スマートフォンからの流入を増やす場合はより回線速度の最適化を重視しましょう。

フォーム離脱の背景

フォーム到達時、入力が面倒と判断

住所・氏名・それらのふりがな・電話番号・メールアドレスetc…フォームを入力する際にあまりにも多くの項目を入れなければいけないとわかった時、うんざりした経験はないでしょうか。
ユーザーはフォーム到達時に項目がいっぺんに表示されると面倒と判断し、離脱してしまう可能性があります。

フォームの入力形式がわからない

ハイフンの有無、全角・半角での入力などフォームによって入力形式は様々です。
中には形式が明記されておらず、入力エラーとなりフォーム入力が最初からになるということもあります。

そのため、フォームの入力形式がわからない状況はユーザーにとって非常にストレスです。ハイフンの有無、全角・半角での入力などフォームの入力形式は明記し、ユーザーがどのようにフォーム入力を行えばよいかわかるようにしましょう。

このように、フォーム入力は、ユーザーにとってストレスの原因となりやすく、その結果、離脱する可能性が高まります。フォーム入力で離脱してしまうと、コンバージョンに至る直前までの努力が無駄になってしまいます。

しかし、フォームを改善することは手間がかかる作業です。そこでおすすめするのが、チャット型EFOツールの導入です。
チャット型EFOツールを導入することにより、入力情報の自動保存などを通じてユーザーのストレスを軽減できます。

特におすすめなのが「GENIEECHAT」です。GENIEECHATは、D2C業界をはじめ、人材や不動産業界など幅広い分野で支持を受けているツールです。専属カスタマーサクセスがあらゆる場面で伴走し、CVR向上を実現します。

まとめ

フォーム最適化施策はEFOと呼ばれ、、CVR向上のために重要です。EFOにおいてはユーザーにストレスを与えないことが重要であり、入力エラーを減らす、項目数を減らす、入力を補助するなどが求められます。

「GENIEECHAT」の導入により、ユーザーはより直感的でストレスフリーな方法でフォーム入力を完了させることができ、結果としてコンバージョン率の向上が期待できます。このように、チャットEFOツールは、新規顧客獲得を目指すWebマーケティング戦略において、非常に有効な手段となります。

チャット型EFO「GENIEE CHAT」の資料請求はこちら

GENIEE CX NAV1 編集部

「誰もがマーケティングで成功できる世界を創る」というパーパスを掲げる株式会社ジーニーの
CXプラットフォーム事業本部が運営しております!

Webマーケティングにおけるノウハウや
パーソナライズされた顧客体験を叶える最新情報など皆様のお役に立てる情報をお届けします。

関連記事

当ブログがおすすめしている記事