2023年12月4日8 分

お問合せフォームの作り方と6つのポイント

最終更新: 2023年12月7日

公開日 2019年2月26、更新日 2023年12月4日

ビジネスが成長する過程において、新規リードの獲得は欠かせません。ホームページ上のお問い合わせフォームは 24 時間受け付けることが可能で、なおかつ電話お問い合わせと比べて行動へのハードルが低いため、新規リード獲得のために必ず設置したい機能の一つです。

お問合せフォームは、単に顧客からの質問に回答するためだけでなく、資料請求や見積依頼などの要望に応えたり、またはあなたのビジネスに対してのフィードバックを貰うためにも活用することができます。

この記事では、お問い合わせフォームの導入を考えている方や、これからホームページを作成する方向けに、お問い合わせフォームの作り方と、注意したい 6 つのポイントを解説していきます。


 
目次

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

コーディングして Web サイトに追加

Googleフォームを埋め込んで使用する

Wixでお問い合わせフォームを作成

お問い合わせフォーム作成の6つのポイント

01. 簡潔で分かりやすいフォーム構造

02. 必須項目・任意項目を設定する

03. 分かりやすいエラーメッセージとヒントの提供

04. 希望の連絡受け取り方法の設定

05. 確認画面の導入

06. 自動返信メッセージを設定

\本格的なホームページを Wix で作成/

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

01. コーディングして Web サイトに追加

HTML・CSS の技術を持っている場合は、HTMLを編集することでお問い合わせフォームをホームページに追加することができます。お問い合わせフォームの構成は比較的シンプルであるため、シンプルなデザインであれば比較的簡単に作成することができます。

メリットは、完全にカスタマイズすることが可能でデザインや機能を自由に調整できる点です。しかし、自分で作成する場合には、受信したお問い合わせを保存するサーバーの設定や reCAPTCHA(リキャプチャ)といったスパム対策など追加の対策が必要になります。

reCAPTCHA とは

「私はロボットではありません」というボックスにチェックマークを入れるよう訪問者に要求し、人間とロボットを区別するための簡単なテストです。Google が提供する無料ツールで、スパムや自動不正行為などからサイトを保護します。

02. Googleフォームを埋め込んで使用する

お問い合わせフォームを作成するおすすめの方法は、Google フォームを利用することです。フォームのデータは Google スプレッドシートに自動的に保存されるため、データをまとめる際にも便利です。しかし、デザインの自由度が低く、ホームページとの一貫性を維持することは難しくなります。

Google フォームをホームページに埋め込む手順

  1. Google フォームを作成

  2. フォームの送信設定をクリック

  3. 埋め込み用HTMLコードを作成

  4. お使いのホームページエディタの HTML コード埋め込みエリアに挿入

ホームページのデザインに合わせてカスタマイズしたい場合は、お問い合わせフォーム作成サービスやプラグインを導入することがおすすめです。ホームページを Wix で作成した場合は、次に紹介する手順でカスタマイズ可能なお問い合わせフォームを作成することができます。

03. Wixでお問い合わせフォームを作成

Wix では、お問い合わせや注文といった用途ごとに用意されたテンプレートから、お好きなお問い合わせフォームを作成することができます。また、エディタ上でデザインを自由にカスタマイズできます。受信したデータはすべて Wix コンタクトにリアルタイムで保存・反映されます。

  1. Wix エディタでサイトにアクセスします。

  2. エディタ左側で「追加」アイコンをクリックします。

  3. フォーム」をクリックします。

  4. フォーム」下でフォームを選択し、サイトにドラッグします。

\高機能なホームページを Wix で作成/

お問い合わせフォーム作成で注意点6つ

お問い合わせフォームを作成して、リードを獲得するためには、以下の6つのポイントに注意すると効果的です。

01. 簡潔で分かりやすいフォーム構造

フォームは短く、入力する内容がすぐに理解できる構成にしましょう。簡潔なお問い合わせフォームの方が、ユーザーがフォームを送信する可能性が高まるでしょう。

必用最低限の項目のみに抑えることで、ユーザーが気軽にお問い合わせフォームを送信できます。また、ユニークなデザインは避け、誰もが見慣れたデザインにすることで直感的に入力できることが、良いお問い合わせフォームのポイントです。

ミニマルなフォームにする方法の1つとして、ドロップダウンメニューやチェックボックスを使った形式にする方法があります。たとえば、日時や、希望の連絡方法などのクリックだけで回答ができるような項目は、わざわざ入力してもらうのではなくチェックボックスを活用しましょう。ユーザーにとっての余計な手間を省くことができます。

タイピング入力を最小限に抑えるべきもう一つの理由として、モバイル機器を使用してのアクセスが増加していることが挙げられます。モバイル機器からのタイピング入力はデスクトップよりもはるかに手間がかかります。あらゆるブラウザに適用するため必要最低限の作業でフォーム送信ができるよう心がけましょう。

02. 必須項目・任意項目を設定する

ユーザーに求める情報を正しく入力してもらうために、必須項目と任意項目を設定しましょう。必用最低限の項目を必須項目とし、それ以外は任意項目とすることで、記入の途中で離脱されてしまうことを避ける工夫をしましょう。

どの項目を必須項目とするのか、任意項目とするのかについては、競合他社のお問い合わせフォームをリサーチしながら決めるようにしましょう。一般的なお問い合わせフォームでは、通常、氏名とメールアドレス、メッセージ本文が必須項目とする場合が多いです。

必須項目をユーザーにわかりやすく示すことは、フォームの効果を高める重要な要素です。目立つ赤や黄色を使用し、フォーム内の必須項目が強調されるようにデザインしましょう。また、必須項目を米印で示すのではなく、「必須」という言葉をラベルに使用することでよりわかりやすいデザインにすることができます。

03. 分かりやすいエラーメッセージとヒントの提供

ユーザーがフォームに誤りを含めた情報を入力した場合、分かりやすいエラーメッセージを表示し、どの項目が問題なのかを具体的に伝えます。例えば、電話番号の形式が正しくない場合、「ハイフンなしで入力してください」といったエラーメッセージが表示されるようにしましょう。

同時に、各項目には記入例を表示し、入力する内容とフォーマットが具体的にわかるようにしましょう。例えば、日付の入力フォームには「yyyy/mm/dd」といったフォーマットの記入例を記載します。

04. 希望の連絡受け取り方法の設定

希望の連絡受け取り方法にいくつか選択肢を用意することで、ユーザーが便利なコミュニケーション手段を選べるようになります。このポイントは特に重要で、ユーザーが普段利用している手段でコミュニケーションをとれるようにすることで、リードの獲得率を向上させることが期待できます。

例えば、希望の返信受け取り方法では、メールだけでなく Facebook などの SNS や電話なども選択できるようにすることで、ユーザーへとリーチできる可能性がより高くなります。

05. 確認画面の導入

フォーム送信前に確認画面を導入することで、ユーザーが入力した情報を最終確認できるようにします。この確認画面では、誤りを発見しやすくするだけでなく、ユーザーにとっても安心感を提供します。あわせて、ユーザーが誤りを発見した場合に、すぐに修正できる仕組みや、送信後のフォーム回答内容を編集できるような仕組みにすることでさらに丁寧な印象を与えることができるでしょう。

06. 自動応答メッセージ

ユーザーがフォームを送信すると、自動的に受信確認やお礼のメッセージが送られるように設定します。この自動応答メッセージは、ユーザーに感謝の意を示すとともに、フォローアップステップへの誘導も行います。

メッセージ内では、送信された内容を確認し、お問い合わせ内容に基づいた参考情報や次のステップに関する案内を提供することで、ユーザーとの対話を円滑に進めることができます。

Wix フォームの機能

Wix フォームなら、自動応答メッセージを送信するオートメーションはもちろん、フォーム送信後にあなたからのお礼のメッセージを受け取ることができる「お礼ページ」やポップアップバナー等の追加もできます。

まとめ

使いやすいお問い合わせフォームは、顧客との信頼関係を築くための第一歩です。ホームページデザインと統一されたデザインのお問い合わせフォームは、信頼できる印象をもたらすことができます。

Wix でホームページを作成し、カスタムメイドのお問い合わせフォームをデザインしましょう。お問い合わせ内容は、Wix が提供する CRM 機能で管理することが可能です。ライブチャットやメール、Facebook など、さまざまなツールを通して送られてくるお問い合わせを Wix 内で一括管理・返信することができます。

\本格的なホームページを Wix で作成/

おすすめ参考記事

▶️ ホームページの作り方の基礎と作成手順

▶️ ホームページを構成する基本要素とパーツ名称
 
▶️ 高性能な予約管理システムを導入する方法:Wix ブッキング

編集者:Miyuki Shimose

SEO & ブログコンテンツマーケター