お問い合わせフォームとは、ホームページやECサイトでユーザーが問い合わせを行う際に必要なシステムです。「入力フォーム」「確認ページ」「送信完了画面」3つで構成されているのが一般的で、顧客満足度の向上にも関係があるとされています。

本記事では、お問い合わせフォームの作り方と注意点、作成に役立つツールを紹介します。

プロが作って、自分で簡単更新!
運用費用ゼロのホームページ作成サービス

初期費用55,000円、月額5,500円で高品質なホームページを作成可能!

お客様に最適な構成やデザインをプロが作成し運用までサポートするので、安心して任せることができます。
ホームページの更新は直感的に操作可能な管理画面からお手軽に更新可能です。

  • お客様に何を伝えたらよいかわからない
  • どんなデザインにしたらよいかわからない
  • 作った後の更新・運用方法がわからない

上記のようなホームページ作成のよくある悩みをsiteflowでカンタンに解決!
まずは無料相談をご利用ください。

お問い合わせフォームの作成方法

お問い合わせフォームは、HTMLやCSSのほか、PHPやJavaScriptを用いたコーディング、CMSのプラグインの活用で作成することが可能です。専門的な知識を要するコーディングで作成した場合と、比較的簡単にフォームを作成できるプラグインを使ったケースでは、メリットも異なってきます。
ここでは、プログラミング言語それぞれによる特徴と、CMSのプラグインで利用できる代表的な機能を解説します。

コーディングで作成

プログラミング作業がプログラムの設計から完了までの全般を指すのに対して、コーディングはプログラミング言語での記述を行う作業のみを指します。コーディングでフォームを作成する場合、自らソースコードを書くため自由度が高く、思い通りのお問い合わせフォームを作れるというのがメリットです。ただし、専門的な知識を持つ人材が自社にいない場合には、フォーム作成後の更新やメンテナンス作業も含め、外部へ発注しなくてはなりません。

HTML

HTMLは、Hyper Text Markup Languageの略です。コンテンツの構造に関わる言語であり、文字を大きくしたりフォントを変えたりといったような、文章の構成を指示するために使われます。実際のコーディングでは、さまざまなタグを組み合わせて使用されています。

お問い合わせフォーム作成におけるHTMLの役割は、土台づくりです。コーディングの際には、HTML専用エディタを活用すると効率よく作業を進められます。専用エディタに搭載された入力補助の機能を使えば、メモ帳を使うよりもHTMLが書きやすくなります。

CSS

CSSはスタイルシートとも呼ばれ、Webページのデザインに大きく関わる言語です。背景や色の設定をはじめ、余白の調整や表示位置を変更するなど、レイアウトを組むのに使われます。そのため、お問い合わせフォームの印象を決定づける言語だといっても過言ではないでしょう。

CSSもテキストデータであるため、メモ帳のようなツールを使えば編集できます。ただ、効率性を考えると専用ツールの使用がおすすめです。CSSのソース編集を補完・生成するなどの機能を実装した便利なツールがリリースされています。

PHP

Webアプリケーションやサイト作成の際によく用いられている言語です。Web開発に特化したプログラミング言語であり、ECサイトやSNSなどを作成できるほか、WordPressをカスタマイズすることもできます。

JavaScriptとよく似た言語ですが、クライアントサイドで動くJavaScriptとは異なり、PHPはサーバーサイドで動くのが特徴です。お問い合わせフォームには、入力内容の確認画面が必須となるため、入力した内容を正しく確認画面に反映させるPHPは重要な役割を担います。

JavaScript

JavaScriptは、ブラウザを動かすためのプログラミング言語で、ポップアップやアニメーション効果を指示する言語だと覚えておけばわかりやすいでしょう。汎用性の高さが特徴であり、ブラウザに動的な効果を加える言語として、現在もっともよく用いられています。

また、この言語を用いれば、お問い合わせフォームのエラーチェックも可能です。10桁以上の数字、半角英数字だけ、などの条件を設定したエラーチェックが行えます。

CMSのプラグインを利用

CMSは、Contents Management Systemの略です。Webサイトの構成に必要な画像やテキストなど、さまざまなコンテンツを一元で管理できるシステムです。もっとも代表的なCMSとしては、WordPressが挙げられます。

CMSには、さまざまなプラグインが用意されています。プラグインとは、機能の追加や拡張が行えるプログラムのことです。CMSを活用すれば、コーディングの専門的な知識がない場合でも、簡単にお問い合わせフォームを作成できます。

プラグインには、機能や特徴の異なるものが数多くあるので、どのような機能があるのかよく理解したうえで比較検討してください。

フォームの設定

まずは、プラグインをインストールして管理画面からフォームの設定を行います。氏名・メールアドレス・タイトル・問い合わせ内容など、具体的な項目について設定しましょう。プラグインによっては、最低限の項目しか用意されていないこともあるため、必要に応じて項目の追加が必要になります。

このとき、項目数は適切数に抑えるように意識する必要があります。手間と時間がかかってしまうと、ユーザーが問い合わせを断念してしまう可能性も考えられるからです。

メールの設定

次に、受け取るメールの設定を行います。導入するプラグインによっては、設定項目に多少の違いがありますが、送信元・題名・メッセージ本文と追加ヘッダーの欄があります。複数人でメールを受け取りたい場合には、追加ヘッダーにCCやBCCを設定しておきましょう。

また、テンプレートの設定で定型文を埋め込んでおけば、毎回文章を入力する手間が省け、業務の効率化につながります。イベントのお知らせや新しいサービスの情報など、定期的にテンプレートを更新すると顧客満足度の向上にもつながるはずです。

メッセージの設定

ユーザーが起こしたアクションに対して表示するメッセージを設定します。問い合わせ内容が正常に送信されたとき、送信に失敗したとき、入力内容に不備があったときなど、それぞれのケースで表示させたい文章を設定します。

あらかじめ設定されている「メッセージは正常に送信されました。」という無機質な文章よりも「メッセージは正常に送信されました。お問い合わせありがとうございます。」といったように、ひと言お礼を追加するだけでも相手に与える印象は変わるものです。

固定ページに設定する

ここまでの設定が終われば、あとは固定ページに反映させるだけです。プラグインの種類にもよりますが、管理画面に表示された専用コードをコピーして、固定ページに貼り付ければフォームがブラウザに反映されます。プレビューで正しく反映されているかどうかを必ず確認し、正常に反映されているのを確認したら、動作確認のチェックを行います。メッセージをきちんと送信できるか、設定したアドレスに届くかなどをテストしてください。

お問い合わせフォーム作成ツールで作成

コーディングの知識を持つ人材がいなくても、お問い合わせフォームを作成できるツールやサービスを活用すれば、簡単にフォームを設置できます。テンプレートが豊富に用意されているツールやレスポンシブ対応など、その特徴はツールによってさまざまです。自社のニーズに合う機能を備えたツールを導入すれば、業務の効率化に役立つはずです。

なお、お問い合わせフォームに求められる基本的な機能としては、マーケティング戦略にも役立つ「顧客管理」ウイルス感染を回避するための「スパム対策」のほか、ユーザーが安心して個人情報を送信できる「SSL通信」が挙げられます。特にSSL通信は、個人情報を取り扱ううえでは必要不可欠です。

お問い合わせフォーム作成ツール10選

それでは、具体的にどのような部分を重視して比較検討すればよいのでしょうか。月々の費用はもちろん、作成できるフォームの数や広告の非表示機能のほか、回答フォームにファイルが添付できるかどうかも併せてチェックしてみましょう。

 

Googleフォーム

Tayori オレンジフォーム

Qubo

FormOK Formmailer SECURE FORM Form Answer formzu formrun
月額 無料

無料

3,400円

7,400円 無料 1,200円 2,750円

4,400円

7,150円

無料

3,500円

7,200円

無料

1,375円
(個人:1か月プラン)

6,875 円
(法人:3ヶ月単位)

無料

990円

1,980円

無料

3,600円

6,150円

14,300円

無料

3ヶ月
1,900円

3ヶ月
3,300円

3ヶ月
8,500円

無料

5,980円

12,980円

25,800円

作成可能なフォーム数

無制限 1 3

無制限

無制限 1 10 20 無制限 5 10

20~100
(タイプにより異なる)

3

10 50 5 15

50(オプションで増加可)

無制限

無制限

10 10

50(オプションで増加可)

1 5 50 無制限

広告の非表示機能

あり あり あり あり あり あり あり あり あり あり あり あり

ホームページ埋め込み

回答にファイル添付

可(ログインユーザーのみ)

何を決め手にツールを選べばよいのか迷ってしまった場合は、導入する目的を整理してみてください。どのような機能があればよいのかあらかじめ明確にしておけば、難しく考えなくても必要な機能が絞れてくるはずです。ここからは、各サービスの特徴を紹介します。

Googleフォーム

引用元:Googleformホームページ(https://www.google.com/intl/ja_jp/forms/about/

あらゆる用途に利用できる「Googleフォーム」は、世界的なシェアを誇る信頼性の高いツールです。サービスは無料で利用でき、豊富なデザインやテーマの中から雰囲気に合ったものを選択したり、画像や動画を追加したりすることもできます。また、モバイルデバイスにも対応しているため、ユーザーの環境を選びません。

自動集計機能でスムーズにグラフ化を行い、集計の手間が軽減できます。また、スプレッドシートとの連携により、より詳しい分析結果を表示させることも可能です。コーディングの知識がなくても、直感的な操作で簡単にフォームが作れる設計になっているので、導入後すぐに活用できます。

Tayori

引用元:Tayoriホームページ(https://tayori.com/

「Tayori」は、スムーズな顧客対応の実現や会社の情報整理など、バックオフィス業務を支える用途で導入実績が豊富なクラウド型のサービスです。カスタマーサポートの効率化などに適しており、これまで40,000アカウントが導入したという実績があります。テンプレートも豊富に用意されていて、アイデア次第で多彩な活用方法が見出せるはずです。

ステータス管理・タスク管理機能も実装しているので、プロジェクト管理ツールとしての利用にも向いています。WordPressをすでに利用している場合は、専用のプラグインでスムーズに導入できます。自社の財産となる顧客情報を整理して、より良いコミュニケーションの構築を実現させるツールです。

オレンジフォーム

引用元:オレンジフォームホームページ(https://form.orange-cloud7.net/

お問い合わせフォームはもちろん、資料請求やアンケートなど幅広い目的で使える「オレンジフォーム」は、自由度の高さが特徴です。PC・タブレット・スマホにも対応しており、作成したフォームをFacebookやTwitterなどのSNSに利用すれば、イベントの告知と応募フォームへの誘導が同時に行えます。

テンプレートからフォームを選択するだけの簡単なステップで作成できるため、専門的な知識は必要ありません。SSL通信対応で安全性が高く、メルマガとの連携機能など、マーケティングの効率化を実現する数々の機能が備わっています。

Qubo(キューボ)

引用元:Qubo(キューボ)ホームページ(https://www.qubo.jp/

ドラッグ&ドロップで、簡単に問い合わせフォームを作成できるサービスです。フリープランは用意されていませんが、すぐに利用できる14日間の無料体験版があります。提供されているツールは2種類あり、お問い合わせや申し込みフォーム向けの「REQUEST」と、アンケートや診断フォームに特化した「SURVEY」から、用途に合わせて選べます。

専門知識は一切不要で簡単にフォームが作成でき、医療機関や教育機関などでの導入実績が豊富にあることから、信頼度の高いサービスです。「Qubo」で作成したフォームはすべてレスポンシブ対応で、さまざまなデバイスで機能するためユーザーにストレスを与えません。

FormOK

引用元:FormOKホームページ(https://formok.com/

画像や動画などの大容量ファイルをフォームに添付できる「FormOK」は、簡単なドラッグ操作でフォームが組み立てられます。質問項目は必要に応じて増やすこともでき、365日24時間ノンストップで顧客からのコンタクトに応じてくれます。無料で確保される100MBのストレージには、日時で多重バックアップが実施されるため、データ消失の心配もありません。

SSL/TSL暗号化によるセキュアな通信と、アクセスの集中に耐えられるネットワーク・サーバーの構成をクラウド環境で実現するなど、オンプレミスでは多額の費用がかかってしまうサービスをクラウド環境で実現させているツールです。また、顧客満足度を最大限に高めることを目的として掲げており、ユーザーが自由な環境でアクセスできるよう、レスポンシブにも対応しています。

Formmailer(フォームメーラー)

引用元:Formmailer(フォームメーラー)ホームページ(https://www.form-mailer.jp/

官公庁や教育機関をはじめ、個人から大手企業まで約40万アカウントの導入実績がある「Formmailer」は、わずか30分程度でフォームとホームページの両方を作成できるサービスです。回答を集計して分析できる機能が実装されているほか、CSVダウンロードやGoogleアナリティクスと連携でき、サイトの改善に活用できるのも特徴です。

入力されたフォームのデータを外部サービスと連携させて、問い合わせの一元管理や予約管理を実行します。大切な個人情報を守るSSL通信やスパム投稿防止機能など、安全な運用を実現するために必要な機能が備わっています。

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

引用元:SECURE FORM(https://www.secure-cloud.jp/sf/

「SECURE FORM」は、累計登録者数が4万人を超える実績があり、専門的な知識なしで用途に合わせたフォームを作成できるサービスです。わずか9秒でフォームを作れるというスピード感が強みで、フォーム作成画面では、パーツをドラッグするだけで簡単にフォームを組み立てられます。

問い合わせフォームをはじめ、自社商品を販売するための注文フォーム、顧客満足度の調査に必要なアンケートフォームのほか、採用向けの応募フォームも作成できます。複数のフォームを1つのメールアドレスで管理でき、SSL暗号化通信に標準対応しているセキュリティの高さも特徴です。

Form Answer(フォームアンサー)

引用元:Form Answer(フォームアンサー)ホームページ(https://www.form-answer.com/

コンバージョン率の向上を実現したいなら「Form Answer」がおすすめです。作成するフォームはEFO(フォーム最適化)が標準で実装されており、顧客の途中離脱を抑えるのに役立ちます。短時間で作成できるフォームは、色やデザインの編集、画像や動画の埋め込みなどが可能で、すべてレスポンシブ対応です。

Slackとの連携で問い合わせ状況を共有したり、Googleスプレッドシートと連携させてフォームの投稿をスプレッドシートへ自動登録したり、業務の効率化につながる多彩な機能が搭載されています。画像認証をオンにして、botからのスパム投稿対策を強化することも可能です。

formzu(フォームズ)

引用元:formzu(フォームズ)ホームページ(https://www.formzu.com/

20年の歴史がある「formzu」は、メールアドレスを登録するだけで簡単にフォームを作成できるクラウドサービスです。Webからの問い合わせ対応、アンケートの実施、イベントの参加申し込みなど、さまざまなフォームの作成に適しています。

WordPressの管理画面からプラグインの新規追加を行えば、セキュリティ性の高いフォームが簡単に設置できます。コンピューター言語の知識は一切不要でデザインの自由度も高いため、あらゆる用途に利用できるツールです。

formrun(フォームラン)

引用元:formrun(フォームラン)ホームページ(https://form.run/home

スタートアップ企業から大企業まで、10万ユーザーに利用されている「formrun」は、お問い合わせ窓口・カスタマーサポート・セミナー受付など幅広い用途に活用できます。テンプレートからイメージに合ったデザインを選び、テキストを追加するだけで簡単にフォームが作成できるのも魅力的です。

Slack・Chatwork・Microsoft Teamsと連携して通知機能を活用すれば、顧客からの投稿に対して迅速なアクションを起こせる環境が構築できます。また、問い合わせ対応では、チーム画面から顧客の担当数を確認したり、ステータス別に進捗状況を把握したり、カスタマーサポートの一元管理を実現させます。

お問い合わせフォーム作成時の注意点12つ

電話やメールに比べて、気軽にアクションを起こしやすいメールフォームを設置すると、さまざまなメリットが得られます。お問い合わせのハードルを下げ、顧客と接点創出の機会を増やせれば、マーケティングの拡大にもつながるはずです。フォームを作成する際には、ユーザーに不安を抱かせないための配慮が大切です。たとえば、自動返信メールを設定して正しくフォームが送信されたことを伝えれば、ユーザーは安心して回答を待つことができます。
また、選択式の回答でデータの集計をしやすくしたり、聞き漏れなどのミスをなくせることで必要なデータを確実に入手できたりと、フォームの運用により得られるメリットは数多く挙げられます。さらに、ユーザーがどのように自社のフォームへたどり着いたのかアクセス解析を行えば、新たなターゲット層の発見に結び付く可能性もあるのです。

しかし、ただ単にフォームを作成して設置しただけでは、このようなメリットにつながりません。成果を導くためには、入力の途中でユーザーが離脱してしまうのを防ぐ工夫が必要です。ここからは、コンバージョン率向上の目的を達成するために、意識すべきポイントを詳しく解説します。

項目数を減らす

入力項目が多すぎると、途中で離脱を招く恐れがあります。顧客の立場になって考えてみれば、なかなか終わらない入力作業を面倒に感じてしまうことは容易に想像できるでしょう。フォームを作成したら、不要な項目が混ざっていないかどうかをもう一度チェックし、本当に必要な項目だけに絞り込むようにしてください。項目の数を最小限に抑えれば、集計したあとの分析や管理も行いやすくなるメリットもあります。

動作を減らす

ユーザーの入力動作を軽減するような工夫を講じることも大切です。たとえば、氏名の入力項目を例に挙げてみると「姓」と「名」の項目を分けている場合、姓を入力した後にカーソルを移動させます。「たったそれだけのこと」と思えるかもしれませんが、この手間が多くなるとユーザーは面倒に感じてしまい、離脱につながるケースもあるのです。

入力項目は極力減らす

郵便番号から住所を検索するシステムを利用すれば、フォームに必要な情報を短時間で反映でき、ユーザーの手間を減らすことができます。入力の手間がかかるほど、ユーザーは億劫に感じてしまい、ページから離脱していきます。項目数を必要最低限に減らせるよう意識すれば、コンバージョン率のアップにつなげられるのです。

問い合わせの種類を分類する

ひと口に問い合わせといっても、さまざまなケースが考えられます。「商品について知りたい」「返品したい」「契約の更新について知りたい」など、その内容は顧客の目的によって異なるからです。問い合わせの種類をあらかじめ分類しておけば、問い合わせの内容に合わせてスムーズな割り振りができるだけでなく、集計したデータの管理もしやすくなります。

記入例を記載

Webサイトからの問い合わせに誰もが慣れているわけではありません。初めてお問い合わせフォームを利用するユーザーのことを考え、入力がスムーズに進められるよう、記入例を記載しておくことも大切です。

どのように記入すればよいのかわからないと困ったユーザーは、そのままページを閉じてしまう可能性があります。これでは、お問い合わせフォームを設置した意味がありません。特に、高齢の方をターゲット層としている場合は注意しましょう。

全角・半角の対応

お問い合わせフォームによっては、入力文字の全角・半角を指定するケースがあります。システム上、どちらかに指定しなければならない場合もあるかもしれませんが、可能であれば全角・半角どちらにも対応したフォームが理想的です。変換の手間やエラーによる再入力など、ユーザーに面倒だと感じさせる要素は極力取り除き、入力作業のストレスを少しでも減らせるような工夫をするとよいでしょう。

必須・任意表示

入力が必須なのか任意なのかについて、わかりやすく表示しておくことも大切です。必須・任意を言葉でわかりやすく表示しておけば、ユーザーは必要な情報のみを入力するだけで済みます。このような表示がない場合、ユーザーはすべての項目を埋めなくてはならないと捉えるでしょう。

その結果、項目の多さに離脱してしまうといったことも十分に考えられるのです。システム内で必須と任意を分けるだけでなく、明確にユーザーへ伝わる方法で示すようにしてください。

エラー表示

お問い合わせフォームでは、入力内容の不備を検知してエラー表示を出す機能があります。必要事項の未記入なのか、メールアドレスの不一致なのか、表示するメッセージの内容はできる限りわかりやすくすることが大切です。たとえば「エラーが発生しました」といった表示だけでは、ユーザーにとってどこが問題なのかがわからず、離脱を招く恐れがあります。

このようなエラー表示は、項目を入力するごとにリアルタイムで表示されたほうがより親切な問い合わせフォームになり、顧客満足度の向上にもつながるのです。

フロー表示

お問い合わせフォームによっては、入力が複数のページにまたがるケースがあります。このような場合、ユーザーが今どの段階を入力中なのか、あとどれくらいで作業が終わるのかを把握できるように、フローを表示する仕組みがあると親切です。たとえ2~3ページだったとしても、入力状況がわかるようにしておくことでユーザーの離脱が回避できます。

スマホ対応(レスポンシブ対応)

現在では、幅広い世代がスマホを所有するようになりました。このような時代のニーズに対応するためには、レスポンシブ対応が不可欠といえます。レスポンシブ対応ができるツールを選べば、PCやスマホなどのデバイスごとにフォームを作成する必要がありません。

スマホでECサイトや企業のWebサイトを閲覧したユーザーが、スムーズに問い合わせできるのはもちろん、管理の手間も低減することにもつながるのです。

確認画面

フォームに入力した内容が正しいかどうかをユーザーが確認するために、送信を行う前の確認画面は設置するようにしましょう。最終的な確認画面がないと、誤った情報に気付かないまま送信してしまう可能性があるため、親切な設計とはいえません。誤った情報の送信は、ユーザーだけでなく運営側にとってもデメリットとなります。ユーザーに安心してフォームを送信してもらうために、確認画面は必ず用意してください。

送信後のアクション表示

フォームを送信したあと、何も表示されないとユーザーはどうすればよいのか戸惑ってしまうことでしょう。送信後のアクション表示は、正しく情報が送信されたと相手に示すものでもあります。「当社からのご連絡をお待ちください」「〇〇にお進みください」といったように、具体的なアクションを伝えるようなメッセージを表示させると、ユーザーの不安解消につながります。

なお、同時に「〇〇への申し込みはこちらから可能です」といったような、別のアクションを促すようなメッセージも効果的です。

まとめ

お問い合わせフォームの作り方には、コーディングやCMSのプラグイン、作成ツールを利用するなど、多様な選択肢があります。中でも、もっとも手軽に利用できるのは、専門的な知識を必要としないお問い合わせフォーム作成ツールの活用です。

ここで紹介した作成ツールは、セキュアな通信が実行できるのはもちろん、用途に合わせて幅広く活用することができます。すでに利用しているツールと連携させることで、より詳細な分析を行ったり、チームの進捗状況を把握したりなど、業務の効率化に役立つ機能を備えたものもあります。

まずはフリープランや無料体験版を利用して、自社のニーズにかなうツールを比較検討してみてはいかがでしょうか。

プロが作って、自分で簡単更新!
運用費用ゼロのホームページ作成サービス

初期費用55,000円、月額5,500円で高品質なホームページを作成可能!

お客様に最適な構成やデザインをプロが作成し運用までサポートするので、安心して任せることができます。
ホームページの更新は直感的に操作可能な管理画面からお手軽に更新可能です。

  • お客様に何を伝えたらよいかわからない
  • どんなデザインにしたらよいかわからない
  • 作った後の更新・運用方法がわからない

上記のようなホームページ作成のよくある悩みをsiteflowでカンタンに解決!
まずは無料相談をご利用ください。