お問い合わせフォームの入力画面設計

お問い合わせWebフォームの必須・任意項目でCVを増やすためのフォームデザインやページ設計

サービスサイトやコーポレートサイトなどでPV数は稼げているものの、CVにつながっていないという課題を抱える企業は少なくありません。

そんな時にぜひ一度見直してほしいのが、お問い合わせWebフォームのデザインや設計です。Webフォームの品質は、CVR(コンバージョン率)に直結します。

この記事では、必須・任意項目の設定をはじめとするWebフォームの設計について詳しく解説します。

目次[非表示]

  1. 1.Webフォームの必須・任意などのあるべき姿
    1. 1.1.入力項目の数は最低限に。必須項目だけのWebフォームを心がける
    2. 1.2.条件分岐がある場合は全表示ではなく入力項目の出し分けをフォーム側で行う
  2. 2.必須項目をユーザーにストレスなく伝えるWebフォームのUIデザイン
    1. 2.1.必須項目に「※」や「*」を使用しない
    2. 2.2.任意項目も必須項目同様に表記をする
    3. 2.3.項目名と必須・任意のラベルは入力欄の上に配置して目線の幅を小さくする
    4. 2.4.必須項目で取りたいデータ形式・内容を確実にするため補足情報を入れる
    5. 2.5.優先度の高い必須項目から配置する
  3. 3.必須項目のデータはコアな個人情報になる
  4. 4.Webフォーム入力後の送信行為のキャンセル・離脱を防ぐ方法
    1. 4.1.個人情報保護規定・プライバシーポリシーを表示する
    2. 4.2.データの収集目的・運用範囲について表示する
    3. 4.3.プライバシーマークなどセキュリティレベルを示す
    4. 4.4.サーバー監視体制など保守対応を示す
  5. 5.Webフォームに必須入力項目の指定を実装する方法
    1. 5.1.Webフォーム作成・運用の専用ツールで実装する
    2. 5.2.CMSのプラグインを用いて実装する
    3. 5.3.HTML、JavaScriptを用いて実装する
  6. 6.Webフォーム経由のユーザーデータは取得ではなく分析・活用が目的


Webフォームの必須・任意などのあるべき姿

まずはWebフォーム設計の基本となる、質問項目の適切な設定方法について重要なポイントを2つ解説します。


入力項目の数は最低限に。必須項目だけのWebフォームを心がける

CVの増加を目指すのであれば、入力項目数は極力減らした方が効果的と言えます。

入力項目が増えるほど、ユーザーの心理的ハードルは高まります。また、企業側としてはできる限り情報を集めるべく、必須とはしないまでも任意項目として入れておきたいという思いもあるでしょうが、任意項目でも項目数を増やすのはおすすめしません。

フォームを開いた時に与える印象で離脱率は変わってきますし、特にお問い合わせフォームのユーザーは信頼関係を築けていないリードであることも多いため、企業側の都合よりもユーザー側の都合を優先して設計するのが得策でしょう。


条件分岐がある場合は全表示ではなく入力項目の出し分けをフォーム側で行う

フォームの質問項目の中には、条件に応じて必須項目が変わる場合もあるでしょう。例えば、入力者が法人か個人か、新規かリピーターか、あるいはどういったお問い合わせ内容かによって入力してほしい項目が変わるようなケースです。

こうした場合には、入力内容によって質問項目の出し分けができる条件分岐の機能を活用することで、全体の項目数を減らし、個々のユーザーにとって必要な項目だけに絞ることができます。


必須項目をユーザーにストレスなく伝えるWebフォームのUIデザイン

質問項目が固まったら、次はユーザーのストレスを減らすフォームデザインについて見ていきましょう。


必須項目に「※」や「*」を使用しない

必須項目である印として色をつけた「※」や「*」を配するケースも散見されますが、必須項目であれば「必須」と記載すべきです。デザインする際は、「これで通じるだろう」ではなく、「誰でもわかる」状態にしましょう。


任意項目も必須項目同様に表記をする

任意項目に関しても、上記と同様のことが言えます。必須項目にのみわかるような記載をし、任意項目には特に何も表記しないことで「必須ではないのだから任意だとわかるだろう」と意味理解を強いるのは不親切な態度です。任意なら「任意」と明記するのが望ましいでしょう。


項目名と必須・任意のラベルは入力欄の上に配置して目線の幅を小さくする

氏名や電話番号といった項目名や必須・任意のラベルは、入力欄の横ではなく上に配置するのがおすすめです。入力欄の上にあれば、フォーム全体の幅が抑えられるため、ユーザーの目線は横にスライドすることなく上から下へ一直線で進むことができます。それによって入力時のストレスを軽減できます。


必須項目で取りたいデータ形式・内容を確実にするため補足情報を入れる

ユーザーごとの表記ゆれをうまないように、必要に応じて補足情報を記載しておくことも有効です。例えば、電話番号や郵便番号にハイフンは入れるのか入れないのか、氏名や住所の分割入力でもそれぞれの欄に何を記載して欲しいかを記載しておけば、入力する側も迷わず、データを活用する企業側も扱いやすくなります。


優先度の高い必須項目から配置する

質問項目の順番は優先度の高い項目から配置すると良いでしょう。ユーザーから見ても伝える必要性を感じる項目であれば、入力に対する抵抗は少なくなります。

反対に、必要性を感じない項目が冒頭から並んでいたら、不信感やストレスを感じさせる原因となるでしょう。


必須項目のデータはコアな個人情報になる

Webフォームで必須項目とされるデータには、氏名や連絡先、会員番号、登録用パスワードなどの個人情報が含まれます

そのため、Webフォームはわかりやすさを追求するだけでなく、セキュリティにもこだわる必要があります。

機密性の高い情報を扱うからこそ、Webフォームはサイバー攻撃などの標的にもなりやすいもの。

堅牢なセキュリティを備えたWebフォームでしっかりと守りを固めておくことで、安心してCV向上や効果的なデータ活用に向けた攻めの運用に徹することができるでしょう。


高いカスタマイズ性と公官庁導入の高セキュリティWebフォームなら「クライゼル」


Webフォーム入力後の送信行為のキャンセル・離脱を防ぐ方法

Webフォームの離脱の要因は、質問項目の多さやわかりにくさだけではありません。ある調査では、セキュリティに関する懸念が離脱の最大の要因となっているという結果も出ています。

ここでは、セキュリティに関する不安を払拭し、離脱を防ぐ方法について解説します。


個人情報保護規定・プライバシーポリシーを表示する

まず大切なのは、プライバシーポリシーを表示しておくことです。またプライバシーポリシーの記載にあたって、雛形を転用したことで後にトラブルを招くケースもありますので、自社の実態に即した内容で策定することが必要です。


データの収集目的・運用範囲について表示する

個人情報保護法では、個人情報を収集する際には、個人情報の利用目的を公表するか、本人に伝えることが義務付けられています。またグループ会社や提携先、委託先などに共有・提供する場合にはその内容についても公表または本人への通知が必要となるため注意が必要です。


プライバシーマークなどセキュリティレベルを示す

上記の2つに加えて、さらに安心感を与えたい場合には、プライバシーマーク取得などの情報管理体制の堅牢さを示すと良いでしょう。


サーバー監視体制など保守対応を示す

また、プライバシーポリシー以外でも、フォームの安全性を伝えることで安心感を与える方法もあります。プライバシーポリシーは基本的に内部統制に関わる内容になりますが、フォームの堅牢さを伝えることで外部からのインシデントに強いことをアピールできます。


Webフォームに必須入力項目の指定を実装する方法

次に、Webフォームで必須項目の指定を実装する方法について見ていきましょう。


Webフォーム作成・運用の専用ツールで実装する

1つ目は、Webフォーム作成・運用の専用ツールを使う方法です。専用ツールであれば必須項目の設定機能を有していると見て間違いないでしょう。ただし、フォームのUXデザインの項目で説明したような「必須」「任意」という表記が可能かどうかはサービスによって異なるため、確認が必要です。


CMSのプラグインを用いて実装する

2つ目は、サイト構築に使っているCMSのプラグインを用いる方法です。専用ツールよりも簡易的なフォーム機能のものが多くはなりますが、プラグインでも必須項目の指定ができるものが多いでしょう。


HTML、JavaScriptを用いて実装する

3つ目は、直接コーディングによって実装する方法です。具体的にはrequired属性を指定したり、JavaScriptなどのプログラミング言語によって入力制御を行います。専門知識が必要なため、リソースが必要です。


Webフォーム経由のユーザーデータは取得ではなく分析・活用が目的

この記事では、CVを増やすためのWebフォームの設計について解説してきました。

Webフォームはユーザーデータを収集する有益な手段ですが、データは集めて終わりではなく、分析・活用してこそ本来の目的が達成されます。

同様にWebフォームツールも必要なデータを集められる機能を有するだけでは不十分だと言えます。分析機能を有するツールや、既存システムとの連携ができるツール、そして何よりセキュアな環境で安全に運用できるツールを選ぶことが肝要です。


Webフォーム作成の専用ツールであるクライゼルは、高いカスタマイズ性で必須項目や条件分岐なども自由に設定できる上、システム連携にも強く、また堅牢なセキュリティを持つことから官公庁などにも導入されています。

高品質なWebフォームツールをお探しの方はぜひクライゼルをご活用ください。


高いカスタマイズ性と官公庁導入の高セキュリティWebフォームなら「クライゼル」


  Webフォームとは お問い合わせ、資料請求、セミナー受付など、用途に合わせ様々なフォームを無制限に作成可能です。 クライゼル | 多彩な業務で使える高セキュリティなCRMプラットフォーム


M.Hattori

M.Hattori

トライコーン(株)Senior Vice President of Marketing。web広告、CRM、CDP、データ可視化などお客様のwebマーケティングの課題解決に長年従事。 Salesforce Marketing cloud メールスペシャリスト / アドミニストレータ / コンサルタントおよび、Salesforce アドミニストレータの各認定資格を保持。

関連記事

よく読まれる記事

ホワイトペーパーDL

ステップメール完全ガイド

タグ一覧