ブログの始め方から
収益化までを徹底解説

 

ホームページのお問い合わせフォームの簡単な作り方とは?仕組みやおすすめツールも解説

「ホームページ、作ったのに何も起こらない…」

せっかく時間をかけてホームページを作ったのに、「お問い合わせがまったく来ない」「何が足りないのかわからない」と悩んでいませんか?

実は、多くの人が見落としがちなのが「お問い合わせフォーム」の存在です。

どんなに魅力的なサービスを紹介していても、見込み顧客が「ちょっと相談したいな」と思ったときに、すぐに連絡できる手段がなければ、そのまま離脱されてしまうことも。

お問い合わせフォームがなければ、せっかくのチャンスを逃すリスクも高まります。

お問い合わせフォームは、ホームページと訪問者をつなぐ大切な窓口です。

24時間365日、休まずに「話しかけてもらえる状態」を作っておくことで、問い合わせの機会をしっかりキャッチできるようになります。

本記事では、初心者の方でも簡単に導入できるお問い合わせフォームの作り方や、WordPress向けのおすすめプラグイン、フォーム作成ツールを紹介しながら、実際の設置・運用方法を解説していきます。

これからホームページをもっと活用していきたい方は、ぜひ参考にしてみてください。

ホームページのお問い合わせフォームとは?

お問い合わせフォームとは、ホームページ上で訪問者からの問い合わせを受け付けるためのWebフォームです。

実店舗の受付窓口のように、以下のような幅広い用途で使用されます。

お問い合わせフォームの活用例
  • お問い合わせ
  • 無料体験申込み
  • 資料請求
  • イベントの参加申込み

一般的な問い合わせ方法には電話やメールがありますが、対応時間が限られたり、必要な情報が漏れていたりするなどの課題があります。

また、企業に直接電話やメールを行うのは、心理的な負担を感じる方もいるでしょう。

お問い合わせフォームであれば、24時間365日問い合わせを受け付けられ、氏名や電話番号などの入力項目も指定できます。

訪問者の心理的なハードルを下げ、連絡の行き違いなどの手間も省きながら、お問い合わせ数の増加を見込めるでしょう。

その結果、潜在顧客の獲得や成約率の向上に繋がります。

ホームページのお問い合わせフォームの仕組み

ホームページのお問い合わせフォームは、主に以下の仕組みで動作します。

STEP.1
訪問者 → Webサーバー:
ホームページの訪問者がお問い合わせフォームの項目を入力・送信
STEP.2
Webサーバー内:
フォームの送信内容をWebサーバーが受信し、処理を開始する
STEP.3
Webサーバー内:
入力内容をチェックし、メール形式の文章に整える
STEP.4
Webサーバー内:
メールソフト(SendmailやPostfixなど)が宛先にメールを送信
STEP.5
Webサーバー → 管理者:
指定されたメールアドレスやデータベースに問い合わせ情報が届く

難しく感じる方は、「お問い合わせフォームに入力された内容がメールとしてホームページの管理者に届く」とイメージしましょう。

また、お問い合わせフォームは、一般的に以下の3つのページで構成されます。

  • 入力フォーム:お問い合わせ内容を入力するページ
  • 確認画面:入力フォームの内容を確認するページ
  • 完了画面:入力内容が企業に送信された旨が表示されるページ

完了画面には、「○営業日以内にご連絡いたします」など、今後の流れを案内される場合が多いです。

ホームページのお問い合わせフォームを構成する6つの要素

ホームページのお問い合わせフォームは、以下の6つのフォーム要素で構成されています。

お問い合わせフォームの構成要素
  • テキストエリア
  • テキストフィールド
  • セレクトボックス
  • ラジオボタン
  • チェックボックス
  • 確認ボタン

それぞれの役割を詳しく解説します。

1. テキストエリア

テキストエリアとは、お問い合わせフォーム上で長文を入力できる入力欄です。

具体的には、以下のような項目で利用されます。

  • メッセージ本文
  • 詳細なお問い合わせ内容
  • 自由記入欄

文字数の上限は基本的にホームページ管理者が設定しますが、他のフォーム要素と比べて多くの情報を入力できます。

2. テキストフィールド

テキストフィールドとは、以下のような短い文章を入力する項目です。

  • 氏名
  • メールアドレス
  • 電話番号

テキストフィールドには一行しか入力できず、文字数の上限もあります。

メッセージ本文や自由記入欄など、文字数が多い場合は、テキストエリアの活用が一般的です。

3. セレクトボックス

セレクトボックスとは、複数の選択肢からプルダウン形式で一つの回答を選ぶフォーム要素です。

具体的には、以下のような情報を得るために設置します。

  • 生年月日
  • 居住地域
  • 職業

プルダウン形式で選択肢を提示するため、選択肢が多くてもコンパクトに表示され、ユーザーが見やすいお問い合わせフォームになります。

4. ラジオボタン

ラジオボタンとは、複数の選択肢のなかから一つだけ選んで回答してもらう入力項目です。

以下のように、必ず回答が一つになる選択肢で用いられます。

  • 性別
  • 年代
  • 今までの利用回数

一つの選択肢を選ぶと、他の選択は自動的に解除されます。

入力フォームに直接選択肢が表示されるため、選択肢の数が2〜6つ程度と少ない場合に有効です。

選択肢が多い場合、セレクトボックスを活用した方が見やすくなります。

5. チェックボックス

チェックボックスとは、複数の選択肢から該当する項目をすべて選択してもらうための入力項目です。

以下のように、複数の項目に当てはまるケースがある質問で用いられます。

  • 今までに使用したことがあるサービス
  • 興味のあるジャンルやカテゴリー
  • 利用するサービス(メールマガジン / 資料請求 / お問い合わせ など)

選択肢は入力フォームに直接表示されるため、2〜6つ程度と少ない場合に適しています。

6. 確認ボタン

確認ボタンとは、入力画面から確認画面に進めるためのボタンです。

入力フォームの回答が終わったタイミングで選択すると、入力内容の確認画面や送信完了画面が表示されます。

なお、ホームページによっては、以下のように表示される場合があります。

  • 確定
  • 完了
  • 送信

表示は異なりますが、実質的な役割はすべて同じです。

ホームページにお問い合わせフォームを設置する5つのメリット

ホームページにお問い合わせフォームを設置する主なメリットは、以下の5つです。

お問い合わせフォームを設置するメリット
  • 問い合わせのハードルが下がる
  • メールアドレスの公開が不要
  • 顧客情報を管理・分析できる
  • 24時間運用できる
  • 一次対応を自動化できる

各メリットを詳しく解説します。

問い合わせのハードルが下がる

ホームページにお問い合わせフォームを設置することで、訪問者の問い合わせのハードルが下がります。

電話での問い合わせは、「営業されるかもしれない」といった心理から、ハードルが高いと感じる方がいます。

文章でのやり取りであれば、その場で営業を受ける心配がなく、内容を確認しながらじっくりと検討できるため、安心感が生まれるでしょう。

また、入力事項があらかじめ定められているので、「具体的に何を聞いたらいいかわからない」という人でも行動に踏み切りやすいはずです。

企業にとっても、必要な情報を1回のやり取りで入手でき、効率的な対応が可能となります。

メールアドレスの公開が不要

ホームページにお問い合わせフォームを設置すれば、メールアドレスの公開が不要となります。

メールアドレスの収集や迷惑メールの受信を防ぎ、本当に大切な問い合わせを漏れなく確認しやすくなります。

迷惑メールに添付されたURLやファイルを開くと、情報流出やウイルス感染といった危険もあるので要注意です。

ただし、メールアドレスを公開しなくても、お問い合わせフォームを通じて迷惑メールが届くことがあります。

詳しくは後述しますが、セキュリティ対策や迷惑メール対策を施すことが大切です。

顧客情報を管理・分析できる

ホームページのお問い合わせフォームから送信された顧客情報を管理・分析することで、自社のサービスの改善やマーケティング戦略の策定に役立てられます。

例えば、回答結果の年齢や性別に偏りが見られる場合、その属性に合わせた商品開発や事業戦略の策定が可能です。

お問い合わせフォームのなかには、回答内容を自動でデータ化するツールがあります。

お問い合わせフォームの回答結果を一元管理する仕組みを構築すれば、効率的にサービスの改善や事業運営を進められるでしょう。

24時間運用できる

24時間運用できる点も、ホームページにお問い合わせフォームを設置するメリットです。

問い合わせの手段が電話の場合、休日や深夜帯などの営業時間外には対応できません。

なかには、営業時間内に問い合わせできず、サービスの利用をあきらめてしまうユーザーもいるでしょう。

お問い合わせフォームであれば、24時間365日いつでも企業に要件を伝えられます。

企業側は翌日や休日明けの営業時間に対応すればよいため、時間的な制約があるユーザーの顧客化を目指せるでしょう。

一次対応を自動化できる

ホームページにお問い合わせフォームを設置すれば、問い合わせの一次対応を自動化できます。

電話やメールでの問い合わせの場合、営業時間外や担当者の不在時には、すぐには対応できないことがあります。

一方で、お問い合わせフォームに自動返信機能を設定すると、時間や担当者の状況に関係なく即座に一次対応が可能です。

自動返信に「○営業日以内に返信いたします」など、今後の対応を記載しておけば、ユーザーに安心感を与えられます。

ホームページにお問い合わせフォームを設置する危険性

お問い合わせフォームの設置には、問い合わせ数の増加や顧客情報の収集など、複数のメリットがあります。

しかし、適切なセキュリティ対策を施さずにお問い合わせフォームを運用してしまうと、以下のようなサイバー攻撃や不正アクセスの標的になる恐れがあります。

攻撃の種類 内容
SQLインジェクション 不正なSQLコマンド(データベースを操作する命令文)を入力し、データベースに侵入・不正操作を行う攻撃
クロスサイト
スクリプティング
不正なスクリプト(プログラム)を埋め込む攻撃
スパムメール 大量の迷惑メールを送り、広告やフィッシングサイトへ誘導する攻撃
不正なファイルの
アップロード
不正なファイルをアップロードし、ウイルス感染や不正アクセスを引き起こす行為

ホームページにお問い合わせフォームを設置する際は、入念なセキュリティ対策が不可欠です。

ホームページに施すべきセキュリティ対策については、詳しく後述します。

ホームページにお問い合わせフォームを設置する3つの方法

ホームページにお問い合わせフォームを設置する方法は、大きく以下の3つです。

お問い合わせフォームを設置する方法
  • HTMLやPHPなどのプログラミング言語で作成
  • お問い合わせフォーム作成サービスを活用
  • WordPressのプラグインで作成

それぞれの方法を詳しく解説します。

HTMLやPHPなどのプログラミング言語で作成

以下のようなプログラミング言語を使ってお問い合わせフォームを作成する方法があります。

  • HTML
  • CSS
  • PHP

プログラミング言語で自作するメリットは、文字の大きさや配色、機能などを柔軟にカスタマイズできる点です。

ホームページの雰囲気や目的に合わせて、最適なお問い合わせフォームを作成できます。

ただし、お問い合わせフォームの作成には時間がかかり、完成後の保守管理も組織内で行う必要があります。

お問い合わせフォーム自体は比較的シンプルな工程で作成できますが、プログラミングの専門知識を持つ人材がいない場合は、現実的ではありません。

お問い合わせフォーム作成サービスを活用

お問い合わせフォーム作成サービスを利用すれば、プログラミングの専門知識がなくても本格的なお問い合わせフォームを設置できます。

サービスやツールによって機能は異なりますが、クリック操作で簡単に作成でき、データ管理まで対応しているものもあります。

ただし、設定できる範囲はサービスの仕様内に限られるため、プログラミング言語で自作する場合より自由度に劣ります。

また、有料サービスが多く、無料プランでは一部機能が制限されている傾向があるので要注意です。

WordPressのプラグインで作成

WordPressのプラグインとは、ホームページにお問い合わせ機能やランキング機能といった各種機能を追加できる拡張機能です。

Contact Form 7」のように完全無料で使えるプラグインがあり、プログラミングの専門知識がなくても簡単にホームページにお問い合わせフォームを設置できます。

ただし、WordPress以外のツールで作成されたホームページには利用できません。

WordPress
専門知識がない初心者でも簡単にホームページを作成できるWebツール

また、ホームページにプラグインを入れすぎると、動作が遅くなる原因になるので、お問い合わせフォーム用のプラグインは一つに厳選して導入しましょう。

ホームページにお問い合わせフォームを設置できるWordPressプラグイン2選

ホームページにお問い合わせフォームを設置できるおすすめのWordPressプラグインは、以下の2つです。

お問い合わせフォームプラグイン
  • Contact Form 7
  • Ninja Forms

それぞれの特徴を解説します。

Contact Form 7

Contact Form 7のファーストビュー

Contact Form 7は、1,000万以上の有効インストール数を誇るWordPressプラグインです。

お問い合わせフォームを無料でホームページに設置でき、ショートコードを使って簡単に埋め込めます。

ショートコード
WordPressで特定の機能を埋め込むための短いコード

入力フォームはもちろん、自身に送信されるメールの文面やユーザーに表示される文章まで詳細に決められるため、本格的なお問い合わせフォームを作成したい方にもおすすめです。

Ninja Forms

Ninja Formsのファーストビュー

Ninja Formsは、ドラッグ&ドロップでホームページにお問い合わせフォームを設置できるWordPressプラグインです。

基本的な機能は無料であり、プログラミングの専門知識がなくても簡単にお問い合わせフォームを作成可能です。

また、Ninja Formsで作成したフォームは、送信履歴を確認できます。

海外のプラグインですが、管理画面は日本語にも対応しています。

WordPress対応のお問い合わせフォーム作成サービス3選

WordPressのホームページ対応でおすすめのお問い合わせフォーム作成サービスは、以下の通りです。

お問い合わせフォーム作成サービス
  • formrun(フォームラン)
  • SECURE FORM(セキュアフォーム)
  • Form Answer(フォームアンサー)

それぞれの特徴を解説します。

formrun(フォームラン)

formrunのファーストビュー

formrunは、豊富なテンプレートとドラッグ&ドロップの簡単操作でホームページのお問い合わせフォームを作成できるサービスです。

目的に合わせて以下のようなフォームにも対応しています。

  • 申し込みフォーム
  • 予約受付フォーム
  • 会員登録フォーム
  • アンケートフォーム

月間回答数や機能に制限はありますが、無料でも運用を始められます。

さらに、有料プランに加入すれば、一斉メール配信や回答データの出力、多人数での利用などにも対応できます。

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

SECURE FORMのファーストビュー

SECURE FORMは、無料でも期間無制限で最大3つまでメールフォームを作成できるサービスです。

SSL暗号化やスパム対策、連続投稿の防止、IP制限などのセキュリティ対策が充実しており、回答データの集計やCSVダウンロードにも対応しています。

また、スマートフォンに最適化されたフォームが自動生成されるので、スマホユーザーが主なターゲットでも安心です。

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

Form Answerのファーストビュー

Form Answerは、EFO対策が施されたフォーム作成サービスです。

EFO対策(入力フォーム最適化)
各種フォームの入力ページを最適化するための施策

デザインパターンを選び、項目の設定を行うだけでホームページのお問い合わせフォームを作成できます。

広告表示がありサポートも非対応ですが、無料プランでもお問い合わせフォームの作成・設置ができます。

また、投稿データのCSVダウンロードや集計機能も搭載されており、顧客分析にも役立つでしょう。

管理ページもモバイル対応なので、スマホでも気軽に操作できます。

ホームページのお問い合わせフォームで成果を出す9つのポイント

ホームページのお問い合わせフォームで成果を出すための代表的なポイントは、以下の9つです。

お問い合わせフォームで成果を出すポイント
  • 必要最小限の回答項目を設定
  • 必須項目と任意項目を設定
  • 入力例を掲載
  • エラー内容をリアルタイムで表示
  • 全角・半角の両方に対応させる
  • 入力事項の確認ページを作成
  • 自動返信機能を搭載
  • レスポンシブ対応させる
  • セキュリティ対策を施す

以下では、各要素を詳しく解説します。

1. 必要最小限の回答項目を設定

ホームページのお問い合わせフォームでは、必要最低限の回答項目を設定しましょう。

回答項目が多すぎると、ユーザーは面倒に感じ、送信前に離脱してしまう原因となります。

例えば、単に疑問点を問い合わせるだけで、所属組織や年齢、性別まで入力するのは非常に手間です。

年齢や性別まで把握すれば顧客分析に役立ちますが、問い合わせの件数が減っては本末転倒です。

単純な問い合わせ目的であれば、氏名・メールアドレス・問い合わせ内容に絞るなど、シンプルな入力フォームを心がけましょう。

2. 必須項目と任意項目を設定

ホームページのお問い合わせフォームでは、必須項目と任意項目を使い分けましょう。

必須項目を最低限に絞ることで、入力項目が多少多くても、ユーザーの心理的なハードルが下がります。

必須項目の内容はもちろん、「任意だが入力ページには掲載する項目」を検討し、離脱率を下げずに効率的に情報収集できる仕組みを作りましょう。

なお、すべての項目が入力必須の場合でも「必須」と記載することが大切です。

ユーザーが任意項目と勘違いしてエラーが発生する事態を防止できます。

3. 入力例を掲載

お問い合わせフォームの入力欄、または上下には入力例を表示しましょう。

入力例があれば、ユーザーが記入内容に迷う時間が減り、スムーズに問い合わせの送信まで行えます。

例えば、電話番号の入力では、ハイフンを記載すべきか悩む方が多いです。

記入例の電話番号にハイフンが記載されていれば、安心してフォームに入力でき、エラーを未然に防止できるでしょう。

4. エラー内容をリアルタイムで表示

入力内容に誤りがある場合は、エラー内容をリアルタイムで表示させましょう。

すべての項目を入力し終えた後にエラーが表示されると、修正に手間がかかります。

最悪の場合、同じ理由(全角・半角の違いなど)で複数の項目がエラーになる恐れもあるでしょう。

リアルタイムでエラーが表示されれば、その場で入力内容を修正でき、それ以降の項目にも反映させられます。

結果として、スムーズに問い合わせを送信できるようになります。

5. 全角・半角の両方に対応させる

ホームページのお問い合わせフォームの入力ページは、全角・半角の両方に対応させることをおすすめします。

お問い合わせフォームのエラー内容のうち、全角・半角の違いによるエラーは非常に多く見られます。

数字は入力する機会が多く、変換も手間なので、全角・半角の両方に対応させることで、ユーザー体験が大きく向上するでしょう。

6. 入力事項の確認ページを作成

入力ページに直接送信ボタンを設置するのではなく、入力内容の確認ページを作成しましょう。

問い合わせ内容やメールアドレスは、誤っていてもエラーとしての検出が難しいです。

確認ページを設けて、入力内容に誤りがないかチェックした後に送信してもらいましょう。

入力内容に誤りがあると、企業は適切な回答ができず、最悪の場合、連絡すら取れないといった事態に陥ります。

また、入力事項の確認ページを作成すれば、スパム対策にも有効です。

7. 自動返信機能を搭載

お問い合わせを受け付けたら、自動返信メールを送信するように設定しましょう。

問い合わせを送信したにもかかわらず何の連絡もないと、「正常に問い合わせが完了しているか」と不安に思われます。

自動返信メールに、正常に受付が完了した旨を記載すれば、ユーザーは安心して企業からの連絡を待てるでしょう。

メールには「○営業日以内に連絡が届きます」など、具体的な流れを記載することで、よりユーザーが安心できる対応となります。

8. レスポンシブ対応させる

ホームページのお問い合わせフォームはレスポンシブ対応に設定しましょう。

レスポンシブ対応
ユーザーが使用するデバイス(PC / タブレット / スマホ)にレイアウトが自動で最適化される設定

入力フォームのレイアウトが見やすければ、各項目の入力もスムーズに進められます。

一方で、レイアウトが最適化されていないと、入力フォームが見にくく、途中で離脱される原因となります。

9. セキュリティ対策を施す

先述した通り、お問い合わせフォームの設置には、セキュリティ面の危険性が潜んでいます。

ホームページにお問い合わせフォームを設置する際は、以下のようなセキュリティ対策を施しましょう。

セキュリティ対策 概要
SSL化 Webサーバーとお問い合わせフォームの通信を暗号化して情報流出を防止する対策
WAFの導入 Webアプリケーションに対する攻撃を検知し、防御する対策
reCAPTCHAの導入 人間とボットを識別し、スパムを送れなくする対策
タイムスタンプの導入 フォームの入力開始から入力終了までの時間を測定し、短すぎる場合はボットと判定する対策
アップロードできる
ファイルの制限
ファイル形式やサイズに制限を設け、不正なファイルをアップロードさせない対策

ホームページ・ブログのお問い合わせフォームに関するよくある質問

よくある質問の画像

ここでは、ホームページ・ブログのお問い合わせフォームに関するよくある質問に回答します。

  • お問い合わせフォームからの迷惑メールの対処法は?
  • お問い合わせフォームに設置すべき項目は?
  • ブログ形式のWebサイトにもお問い合わせフォームを設置すべき?

お問い合わせフォームからの迷惑メールの対処法は?

お問い合わせフォームからの迷惑メール(スパム)対策では、reCAPTCHA(リキャプチャ)の導入がおすすめです。

reCAPTCHAとは、「私はロボットではありません」など、ユーザーが人間であることを確認できた場合にのみ、お問い合わせの送信などの行動を取れるようになるセキュリティ対策です。

ボットによる迷惑メールの自動送信を防ぎ、本当に確認が必要な問い合わせを見逃さなくなります。

WordPressプラグイン「Contact Form 7」を用いたreCAPTCHAの設定手順は、大きく以下の通りです。

  1. GoogleでreCAPTCHAのサイトキー・シークレットキーを取得
  2. Contact Form 7のフォーム編集画面にreCAPTCHAを挿入
  3. 動作確認

無料版でも基本的なスパム対策は十分にできるため、試してみてください。

お問い合わせフォームに設置すべき項目は?

目的や事業戦略によって異なりますが、ホームページのお問い合わせフォームで代表的な項目は以下の通りです。

  • 氏名(必須)
  • メールアドレス(必須)
  • 電話番号
  • 会社名
  • 住所
  • 年齢
  • 件名
  • お問い合わせの種類
  • お問い合わせ内容(必須)

問い合わせから成約の流れから逆算して、必要な項目や必須項目を決定しましょう。

ブログ形式のWebサイトにもお問い合わせフォームを設置すべき?

ブログ形式のWebサイトでも、お問い合わせフォームの設置をおすすめします。

ブログにお問い合わせフォームを設置することで、Webサイトの利便性やサイトの信頼性が向上します。

Googleからユーザー体験に優れたWebサイトと評価され、SEOで高評価を得られる効果が期待できるでしょう。

また、ユーザーに有益なWebサイトと感じてもらえれば、リピート率が向上し、PV数の増加に繋がります。

さらに、お問い合わせフォームを通じて、広告掲載の依頼やWebサイト同士のコラボレーションなどに発展する場合もあるでしょう。

まとめ

本記事では、ホームページのお問い合わせフォームの仕組みや作成方法、成果を出すポイントなどを解説しました。

ホームページにお問い合わせフォームを設置すると、問い合わせ数の増加や業務・顧客分析の効率化などが期待できます。

ホームページにお問い合わせフォームを設置する方法はさまざまですが、プログラミングの専門知識がない場合はWordPressプラグインの活用がおすすめです。

Contact Form 7などのWordPressプラグインを活用すれば、専門知識がない初心者でも本格的なお問い合わせフォームを作成できます。

本記事では紹介した成果を出すためのポイントを踏まえ、効果的にお問い合わせフォームを運用してみてください。

起業時のホームページ作成については「起業ではホームページの作成は必須?おすすめのHPの種類や作成方法を解説」をご覧ください。

初心者も安心してWordPressを始められます

カラフルボックスで30日間じっくり無料体験
▼WordPressの始め方はこちら▼ 【超初心者向けに解説】WordPressブログの始め方【超初心者向け】WordPressブログの始め方を簡単にわかりやすく解説
初心者におすすめのアダルト専用サーバー カラフルボックスを見る