本記事の動画解説(3分)

「問い合わせ」「資料請求」「会員登録」「イベント申し込み」など、顧客データを取得する際には欠かせない存在である入力フォーム。ユーザーとのコミュニケーションの接点、リード獲得の入り口であることを考えると、入力フォームUIUXは非常に重要です。

見栄えが悪い・入力しづらい場合、ユーザーはページを離脱してしまい、せっかくのビジネスチャンスを失ってしまう可能性さえあります。

今回は、Web制作のスキルや知識を持たなくても簡単にWebフォームを作成できるツールを厳選して9つ紹介します。どれも無料から始められるものばかりですので、すでにある入力フォームの改善や、新規でのフォーム作成を考えている方は、これらのツールを試してみてください。

目次

  1. 入力フォームとは?
  2. 入力フォームの作り方
  3. 入力フォームを作成する際の4つのポイント
  4. 無料で使えるおすすめ入力フォームサービス9選
  5. スマホ対応の入力フォームをつくるには?
  6. 使いやすい入力フォームのデザインをするポイント
  7. 無料ツールで入力を最大化する入力フォームの作り方
  8. まとめ: 無料の入力フォーム作成ツールで問い合わせを最大化

入力フォームとは?

入力フォームとは、ユーザーが情報を入力・送信するための、入力画面のことです。
入力フォームは、エントリーフォームや登録フォーム、単にフォームと呼ばれることもあります。
入力する内容や形式が指定されているので、求める形式で情報収集できるためデータの利用がしやすい利点もあります。

入力フォームの活用用途

入力フォームには、以下のように様々な用途があります。

用途 概要
問い合わせフォーム 顧客からの問い合わせを受け付ける
資料請求 自社の説明資料やホワイトペーパーなどの請求を受け付ける
応募・申し込みフォーム 求人応募や写真コンテスト、キャンペーンなどの応募を集める
会員登録 サービスの会員やメルマガ会員への登録を受け付ける
予約フォーム セミナーやイベント、飲食店などの予約を受け付ける
アンケートフォーム 商品やサービスのレビューや顧客への満足度調査などのアンケートを行う
購入フォーム 商品やサービスの購入を受け付ける
採用フォーム 求職者のエントリーを受け付ける

入力フォームにはこのように多くの種類があるので、必要な機能も異なります。目的に合わせてそれぞれの目的にあったフォームを導入する必要があります。

入力フォームの作り方

1.業者に外注する

入力フォームの作り方1つ目は、Web制作会社などプロへの依頼です。
デザインから機能まで自社に合わせて一から設計してもらえるため、オリジナルの入力フォームが作れます。

ただし、他の作り方と比べて費用が高額になってしまう点がデメリットです。2万円〜数十万円の費用がかかります。
外注した場合は修正も制作会社に依頼する必要があるため、時間がかかってしまうのもデメリットです。

自社で入力フォームを作成するリソースがない、オリジナル性の高い入力フォームを作成したい場合におすすめの方法です。

2.入力フォーム作成ツールを使う

入力フォームは、入力フォーム作成ツールを使用することで簡単に作成できます。無料で使えるツールも多くあり、HTMLCSSの知識が必要ありません。

ほとんどのツールがクリック操作のみでフォームを作成できます。テンプレートを選択し、必要な項目を追加するだけです。

ツールによってはデザインのカスタマイズ性が低かったり、有料プランでなければ使えない機能があるため、事前に搭載されている機能を確認し、複数のツールを比較して導入することが重要です。

また、WebサイトWordPressで作成しているのであれば、プラグインを使用して入力フォームが作成できます。

プラグインには無料で使え、コードの知識がなくても簡単に作れるものが多いため、Web制作のスキルや知識を持たない方におすすめです。

日本語に対応していないものや、細かなカスタマイズにはコードの知識が必要なものもあるため、注意しましょう。

3. その他のマーケティングツールで作成する

入力フォームを作成する3つ目の方法は、マーケティングツールを利用して作成する方法です。

マーケティングオートメーションや、CRMツールには入力フォームが作成できる機能を備えたものがあります。専門的な知識がなくてもフォームが作成でき、入力された顧客情報はそのままマーケティングツールに自動で取り込めるため業務の効率化が可能です。

ただし導入にはコストがかかります。すでにフォーム作成機能を備えたマーケティングツールを導入している企業や、フォーム作成と同時に導入を検討している企業におすすめの作成方法です。

4.自分で作成する

入力フォームは、HTMLCSS・PHPなどコードを使用して設置できます。

HTMLCSSは、それぞれ以下のような役割を果たします。

HTMLフォームの設問項目など、テキストや画像を記述する
CSS:テキストの大きさやフォント、色などのデザインを調整する
・PHP:データの受け渡しをする

コーディングによりレイアウトやデザインをカスタマイズすることで、Webサイトに合うデザインを実現できます。また、Webサイト上にはコードのサンプルが掲載されているページもあるため、それらのデザインを参考にすることもできるでしょう。

ただし、カスタマイズするには専門的な知識が必要になるため、コーディングの知識がない場合は時間がかかってしまいます。コーディングの使用が難しいと感じた場合には、専門的な知識がなくても作成できる方法を選びましょう。

入力フォームを作成する際の4つのポイント

入力フォームのゴールは、ユーザーにストレスなく最後まで情報を入力していただくことです。フォームが使いにくくては、せっかくたどり着いたユーザーの離脱に繋がってしまいます。

ここでは、入力フォームを作成する際の4つのポイントを解説していきます。

設置する項目は最低限にする

入力フォームに設置する項目は最低限にしましょう。入力項目が多いとフォームを開いた時点で入力を面倒だと感じ、離脱する可能性があります。

項目数が増えるごとにフォームの通過率が下がるというデータもあり、項目数を減らすことがコンバージョンの向上にもつながります。

ただし、項目数が少なすぎると必要なユーザー情報が集められないということになってしまいます。ユーザーの負担にならず、自社の必要な情報が集められる数にしましょう。

「必須」「任意」の項目をわかりやすくする

入力項目の「必須」「任意」はひと目でわかるようにしましょう。項目を入力すべきなのか戸惑ってしまうとユーザーは離脱してしまう可能性があります。

「※」などのマークを用いて必須を表現することも多いですが、「必須」と文字で書いたほうがわかりやすいです。項目のそばに文字で表示しましょう。

必須項目だけを表示するのではなく、任意の項目にも「任意」と表示するとよいでしょう。

入力エラーはリアルタイムに表示する

入力フォームに入力された内容が正しくない場合は、リアルタイムでアラートを出すよう設定しましょう。エラーがリアルタイムに表示されず、送信ボタンを押した後にまとめて再度入力する手間があると、ユーザーは面倒に感じて離脱するかもしれません。

ユーザーにストレスを与えないためにも、入力間違いがある場合はどこが間違えているのか、どう修正すべきなのかをその場で表示させるようにしましょう。

確認画面を設置する

フォームには確認画面を設置しましょう。確認画面を設置することで、ユーザーは送信前に入力内容の確認ができます。それによって、フォームから間違った情報が送られる確率を減らせます。

間違った情報が送られてしまうと、ユーザーと連絡が取れなかったり、関係のない人に間違って電話やメールをしてしまう可能性もあります。

また、ユーザーとしてもいきなり送信完了となると、本当に送られたのか不安に思うかもしれません。WordPressプラグインでは確認画面がないものがあるので注意しましょう。

無料で使えるおすすめ入力フォームサービス9選

無料で使えるサービスの中でも、特におすすめのものを紹介します。ツールによってデザイン性に強みを持つものや集計機能に強みを持つものなど、機能や特徴が異なるため、入力フォームを作成するのにどのような機能が必要かを明確にして導入を進めましょう。

1.formrun(フォームラン)

formrun(フォームラン).png

formrun(フォームラン)は弊社が提供しているメールフォーム作成ツールです。

30秒で簡単にフォーム作成、サイト上への埋め込み設置を行うことで、顧客管理までをワンストップで行えるフォーム作成ツールです。

操作性やデザイン、コンセプトを評価され、2018年度グッドデザイン賞にも選ばれています。40種類以上の豊富なテンプレートとデザインの自由度の高さから、貴社のサイトやブランドイメージに合ったオリジナルフォームを作成することができます。

image_information.png

上記の画像が、formrunの実際の問い合わせフォームで人気のテンプレートです。画像や項目もデフォルトで設定されており、迷うことがありません。

また、フォームの背景・タイトル・項目・ボタンなど自由にカラー設定できることから、貴社の世界観に合わせてフォームをカスタマイズすることできます。

WordPressへのフォーム埋め込みもiframeの設定画面からコピー&ペーストで完了するため、その日のうちに設置が完了します。

管理画面上でステータス管理やメールの送受信、一斉メール配信ができるため、複雑な設定や操作をしなくても、これ一つで顧客管理やマーケティング活動に取り組める点が魅力です。

2.Googleフォーム

Googleフォーム.png

Googleフォームは、Googleがサービスの1つとして提供しているサービスです。全ての機能を無料で使える点が特徴で、アンケートや問い合わせ、キャンペーンへの申し込みなど様々なシーンで役立ちます。

基本的なデザインだけでなく、条件分岐項目の設置やWebサイトへの埋め込み、回答が届いた際のメール通知などの機能も無料で利用できます。

Googleフォームから届いた回答は、自動でスプレッドシートに蓄積されるように設定することが可能です。試しに作ってみたいという方や、フォーム作成ツールの利用が初めての方にオススメのツールです

3.SurveyMonkey(サーベイモンキー)

サーベイモンキー.png

SurveyMonkeyは無料で利用でき、アンケートを実施したい方におすすめのツールです。入力フォームの設置から回答の収集・分析までをツールの中で行うことができます。

1600以上の質問サンプルが用意されており、これを利用することでわずか数分でアンケート項目が完成します。回答内容による設問の分岐や、分析結果の集計も可能なので、アンケートや投票、市場調査など、リサーチ目的の利用に最適です。外出先でもアンケートを作成・回収できるアプリ版も提供されています。

また、アンケートの結果は自動的に集計され、グラフと集計結果が表示されるため、手作業で集計をする手間を省けるでしょう。
無料プランでは項目数や取得できる回答数に制限があるため、ビジネスでの利用の際には有料プランの利用がオススメです。

4.フォームズ(formzu)

フォームズトップページ.png

フォームズは累計100万件以上利用されている老舗のフォーム作成ツールです。
無料プランであってもデザイン面での細かなカスタマイズや無制限のフォーム作成が可能な点が特徴です。

有料プランは他社ツールに比べて圧倒的に低コストで、月額500円〜3,000円ほどの価格で利用することができます。有料プランではEFO(エントリーフォーム最適化)機能を利用できるほか、アフィリエイトサービスへの対応を行なっているので、マーケティング用途に適しています。入力回数や回答時間、エラー発生回数などのデータを収集し、集客の改善に役立てましょう。

またPayPal決済も可能なので、注文フォームの作成を考えている方はフォームズを検討してみてはいかがでしょうか。

5.フォームメーラー(FormMailer)

フォームメーラー.png

株式会社フューチャースピリッツが提供するフォームメーラーでは、ドラッグ&ドロップの直感的な操作により専門的な知識がなくてもフォーム作成が行えます。

他社のツールと比べると選択できるデザインは多くはありませんが、問い合わせや申し込み、応募・投票・注文・アンケートなど、幅広い用途で使える点が魅力です。

有料プランではランディングページの作成も可能なので、埋め込み先のWebページも併せて用意する必要がある場合には重宝するでしょう。
Business版を14日間無料でトライアルできるので、気になる方はそちらで操作感を確認してみてください。

6.オレンジフォーム(orange form)

オレンジフォーム.png

オレンジフォームは株式会社オレンジスピリッツが提供するサービスです。
同社の「オレンジメール」と連携することでフォームに入力をしたユーザーにメールの一斉送信ができるようになります。

有料のビジネス版はChatworkやGoogleアナリティクス、スプレッドシート、PayPalなど各種ツールとの連携ができ、利用料金は月額1,200円と格安。
デザインの自由度は高くありませんが、HTMLCSSなどの専門知識は不要なので、シンプルデザインの入力フォームを求めている場合にオススメです。

7.Tayori(タヨリ)

Tayori(タヨリ).png

株式会社PR TIMESのTayoriはカスタマーサポート業務にピッタリの入力フォーム作成ツールです。
通常の問い合わせフォームに加え、チャット形式のフォームやFAQページの設置ができる点が他のツールにはない特徴で、コードを貼り付けるだけでフォームの設置も簡単に行えます。

有料プランでは、自動応答メールの差出人名やメールアドレスの変更も可能になったり、回答内容の保存や解析ができるようになったりと、問い合わせ業務に不可欠な機能を利用することができます。
顧客とのコミュニケーションもツールの中で行えるので、商品・サービスの問い合わせや不具合報告用のフォームを作成するのに適したツールです。

8.SuguForm(スグフォーム)

img_suguform.jpg

株式会社リブレルが提供するSuguFormは、お問い合わせ、アンケート、注文など様々なシーンに役立つフォームがすぐに完成するツールです。

無料プランでも機能が充実しており、入力した内容がエラーであることを表示するバリデーション機能や住所の自動補完機能など、ユーザーの回答率を向上させるための機能を利用できます。

さらに、作成数だけでなく、項目設置数やフォーム送信数に制限がありません。しかし、添付ファイルの上限サイズを拡大したい場合や、回答データ保存期間を伸ばしたい場合は、プレミアムプランを利用すると良いでしょう。

プレミアムプランの利用料金は、通常時で月額2,000円ですが、キャンペーン中は月額990円となっています。

9.SECURE FORM(セキュアフォーム)

img_secure_form.jpg

SECURE FORMは累計登録者数4万人を突破した入力フォーム作成ツールです。わずか9秒でフォームが完成するほど、シンプルな操作になっています。

無料プランにもSSL暗号化が適用されるので、セキュリティ面でも安心です。ユーザーへ自動メールを送信する機能や必須項目設定も利用できます。

作成数は無料プランの場合だと制限があるため、10個作成できる月額990円のベーシックプランか、50個作成できる月額1,980円にプラン変更するのがよいです。

スマホ対応の入力フォームをつくるには?

スマホはパソコンよりも画面が小さいため、入力がしにくくなってしまいます。スマホ対応の入力フォーム作成時には、ユーザーが使いづらくないように以下の点に注意しましょう。

・入力欄や文字を大きくする
・質問項目を必要最低限に絞る
・入力モードを自動で切り替わるよう設定する
・SNSアカウントと連携させて入力の手間を省く
ページの読み込み速度を速くする
・プルダウン形式にする

スマホ対応の入力フォームは、レスポンシブデザインで作成するのがおすすめです。デバイスの画面サイズに合わせて自動的にページレイアウトを変更してくれるため、わざわざスマホ専用の入力フォームを作成する必要がありません。

レスポンシブデザインに対応したフォーム作成ツールを使用すれば、簡単にスマホ対応のフォームが作成できます。

使いやすい入力フォームのデザインをするポイント

入力フォームのデザインは見た目だけでなく、ユーザーの使いやすさを重視したデザインであることが重要です。

使いにくいデザインは入力がしにくく、最後まで入力を完了せずに離脱してしまい、コンバージョンにつながりません。

使いやすいデザインの入力フォームにするポイントには以下のようなものがあります。

・質問項目数は必要なものだけに絞る
・入力欄は縦に配置する
・項目名は入力欄の上に設置する
・質問項目の順序は不自然な並びにしない
・質問項目をグループ化する
・項目名の英語表記は避ける
・チェックボックス・ドロップダウンなどを利用する
・入力例を表示する
・エラーはわかりやすく表示する
・必須・任意を区別する
・自動補完機能を利用する
・不要なリンクは貼らない

使いやすい入力フォームのデザインにするポイントは多くあります。何よりもユーザー目線で使いやすさを意識し、ストレスを与えないよう細かい配慮が必要です。

無料ツールで入力を最大化する入力フォームの作り方

無料のフォームでは機能や設置できる項目などが限られることがあり、入力を最大化できない可能性があります。そこで、無料フォームでも入力を最大化するためのデザインやポイントを意識することが大切です。ここでは、無料フォームで入力を増やすためのコツを紹介します。

1.セキュリティ

セキュリティ対策が十分でない場合、サイバー攻撃のリスクが高まります。個人情報が漏洩するリスクがあると、企業イメージが低下するだけでなく、ユーザーが情報入力に対して不安を感じてしまうため、セキュリティ対策を徹底することが大切です。

無料で入力フォームを作成する場合、SSL暗号化や、管理画面にアクセスできるIPアドレス制限などのセキュリティ機能が利用できないことがあります。

無料でもセキュリティ対策ができるツールやプラグインを選択するようにしましょう。また、ユーザーが安心できるように個人情報に関する取り扱いの記載も効果的です。

2.項目数

項目数は離脱率を左右する重要なポイントです。項目数が多いとユーザーが入力するのに手間を感じてしまい、回答率が低下してしまいます。余計な項目を設置していないか、ユーザーの視点から考えて確認することが大切です。

また、チェックボックスやラジオボタンなどの項目を積極的に設けて、入力の手間を削減するのも効果があります。そのため、無料版の場合でもこういった機能があるかどうかに着目してツールを選ぶようにしましょう。

全部答えられますか?「入力フォーム」5つのパターンと設定すべき入力項目

全部答えられますか?「入力フォーム」5つのパターンと設定すべき入力項目

フォーム作成と聞くと、設問を考えて設置するだけと思ってしまいがちですが、意外と時間がかかるものです。そこで今回は、キャンペーンや問い合わせ対応で頻繁に使われるフォームの用途を理解し、適切なタイミングで利用できる方法をお伝えいたします。

3.入力エラー表示

img_error.jpg

入力エラーはユーザーに分かりやすく表示するようにしましょう。全項目の入力が完了してからエラーに気付くと、ユーザーのやる気が損なわれ離脱率が上がってしまうためです。

入力作業をしている時にすぐにエラーが表示されるようにすると、修正もその場で行えます。ユーザーがどの項目のエラーを認識しやすいように、カラーリングやデザインを工夫することが大切です。

赤色など、はっきりと認識できるカラーでエラー表示させると良いでしょう。

4.住所自動入力

img_street_address_automatic.jpg

住所自動入力は、郵便番号を項目に入力すれば住所が自動的に反映されるシステムです。面倒な住所入力の手間を大幅に削減できるため、離脱率を下げる効果が期待できます。

住所自動入力機能は、コードで実装することもできますが、プログラミングの知識がない場合は、住所自動入力機能が元から備わっているツールを選ぶようにしましょう。

5.必須、任意表示

img_mandatory_any.jpg

回答が必須かどうかは項目ごとに明記するようにしましょう。ユーザーが視覚的に必須項目を把握できるようにすることで、入力項目に迷うことがありませんし、入力漏れを防ぐことができます。

また、項目の必須か任意か不明瞭だと、ユーザーが入力するべきか困惑してしまうため、どちらのラベルも設置するのよがいです。

6.スマホでの入力に対応

img_smartphone_display.jpg

スマホでもパソコンでもエラーにならず正しく回答画面が表示されるように、レスポンシブデザインを採用するようにしましょう。現在はスマホからの流入率が高まっているため、スマホでも最適な形にすることで入力を上げることができるのです。

また、スマホで回答する場合、文字種を変更するたびにキーボードを切り替えなくてはなりません。入力欄を選択したときに半角や全角、英字などが自動で切り替わるようにしましょう。

スマホに最適な入力フォームのチェックポイントは以下で解説しています。

スマホに最適化していますか? 今すぐ見直したいネットショップ入力フォームのチェックポイント

スマホに最適化していますか? 今すぐ見直したいネットショップ入力フォームのチェックポイント

ネットショップの運営で、コンバージョン率の向上は最も重視していきたい要素でしょう。ホームページにアクセスがあっても、商品を購入してもらえなければ、利益に繋がらないからです。コンバージョン率を上げるためにまず着手すべきなのは会員情報などの入力フォームの改善です。とくに、パソコンユーザーを中心に入力フォームを作成している場合は、今すぐ見直しが必要です。今回は、今すぐチェックしたいスマートフォンの入力フォームチェックポイントを紹介します。スマートフォンユーザーが利用しやすいフォーム作りの参考にしてみてください。

7.ステップ表示

img_step.jpg

入力完了までのステップを表示することで、回答率を高めることができます。完了までの目処をユーザーが把握できるようになると、完了までのモチベーションを保つことができます。

特にページを更新して回答を進めていく場合、ゴールまでの道のりが表示されていないとユーザーはやる気を失ってしまうため注意が必要です。入力完了までの目安時間を表示するのもモチベーション維持に役立ちます。

まとめ: 無料の入力フォーム作成ツールで問い合わせを最大化

問い合わせやアンケートなどで利用する入力フォームは、無料で設置することができます。
そして、フォームを最適化することは大きな成果につながります。

フォーム作成ツールは無料で使用できる機能がツールごとに異なるため、目的や改善点に合わせてツールを選ぶことが大切です。セキュリティ面も重要な選定ポイントになるので、しっかりとチェックしましょう。

formrunは弊社が提供している入力フォーム作成ツールです。上記で上げた7つの機能などの便利な機能が豊富であるだけでなく、デザイン性も高く、セキュリティ対策が徹底されています。無料でも利用できるので、まずはお試しでもご利用ください。

【有料ユーザー数No.1】直感的な操作のみでデザイン性の高いフォームを作成するなら「formrun」!

【有料ユーザー数No.1】直感的な操作のみでデザイン性の高いフォームを作成するなら「formrun」!

専門知識不要&ノーコードでデザイン性の高いフォームを簡単に作成できます。無料でご利用できるので、まずはお試しください。

EFO(入力フォーム最適化)について学ぶ

EFO(入力フォーム最適化)って?フォームを改善して売上を上げるための20のテクニック

EFO(入力フォーム最適化)って?フォームを改善して売上を上げるための20のテクニック

EFO(入力フォーム最適化)はコンテンツ内容やデザインに比べると対策の優先順位が低くなりがちです。ただコンバージョン率を高めるためにはEFOが必要不可欠です。

“フォーム離脱”に悩む担当者必見!導入したらCVR41.7%を実現した施策って?

“フォーム離脱”に悩む担当者必見!導入したらCVR41.7%を実現した施策って?

コンバージョン率(CVR)が上がらない。EFO(入力フォーム最適化)です。フォームの質問項目数の削減や、住所入力時のアシスト機能を導入するなど、ユーザーの入力時にストレスを感じさせないフォーム設計を目指して改善を行います。Web接客型の入力フォームBOTCHAN EFOを手掛ける株式会社wevnal監修のもと、フォーム落ちの原因とWeb接客型入力フォームで最適化を行うメリットについて解説します。