「視覚的に魅力的なフォームを作成するためのヒント」

「視覚的に魅力的なフォームを作成するためのヒント」

お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

概要

日常のウェブサイトで部屋の予約から予定のスケジュールまで、私たちはさまざまなフォームを使用しています。一部のフォームは送信するのが簡単であるが、他のフォームは時間がかかる可能性があります。それでは、同じようなフォームがどのように異なるのかというと、その答えは、フォームのデザイン、スタイル、構造が顧客が企業をどのように捉えるかを大きく左右することにあります。これは、ブランドにプラスの印象を与えるだけでなく、有料リードジェネレーションキャンペーンを実行するためにかかるマーケティングコストを効果的に節約することができます。

簡単な注文フォームを2つのデザインで見てみましょう。
簡単なデザイン

Simple Design

簡素で美しいデザイン
     
  Beautiful form with custom theme

2つの違いは何ですか?
  1. 最初のフォームは、どのフォームかを明示していません。二つ目のフォームは、背景から明らかなように、植物を注文するフォームであることを明示しています。
  2. 最初のフォームは、製品をマーケティングするための戦略を使用していませんが、二つ目のフォームは、フォームの説明でその仕事をきちんとしています。
  3. 最初のフォームのCTA、送信は非常に正式な言葉ですが、二つ目のフォームは、ボタンを押したときに実際に行うアクション(植物を取得!)についてレスポンダーと対話しています。

フォームにおいて、最も重要な詳細は何ですか?

フォームタイトルと説明

フォームのタイトルと説明は、ブランドを紹介し、マーケティングする最良の方法です。説明の1行は、コンバージョンへの第一歩となります。フォームの目的をここに伝える必要があります。フォームの説明や指示を読む確率が他のものよりも高いためです。適切で簡潔な説明を行い、違いを見てください!

Form Title and Description

フォームのヘッダーに追加できるものがあります。ブランドのロゴ! ロゴはブランドの顔ですから、フォームにロゴ、商標カラー、パターン、フォントを含めてブランドのアイデンティティを構築しましょう。 ロゴをフォームに追加する方法について学ぶ

Zylker logo on the form

フィールド 

当然、フィールドはフォームの本体ですが、どれだけ聞くべきかがキーとなります。お客様のプライバシー権を尊重し、必要なものだけを尋ねることが重要です。 例えば、部屋の予約フォームから関係のない住所フィールドを単純に削除するだけで、受信した応募件数が大きく変わることがあります。 必要のない詳細を尋ねるだけでなく、フォームが長くなり、お客様がフォームを放棄する可能性が高まります。
Necessary field    Remove unnecessary fields

もしフィールドが重要であるなら、必須項目としてマークして、回答者がそれらを入力しないことを防ぐことができます。必須項目がある場合は、色を選ぶ際に注意してください。色がなく、コントラストがないと、ユーザーには見えないのに必須項目としてマークされているということが非常に不快な思いをさせることがあります。色の選択は、フォームをより注目しやすくするために重要な役割を果たしますが、フォームを複雑にしないように注意してください。

最初に必須フィールドを見つけられましたか?
Color contrast to spot the mandatory fields

選択フィールド

選択型のフィールドはどんなフォームでも不可避です。それをより簡単で顧客の目にも魅力的にする方法はありませんか?
あなたは、フィールドの質問と回答の色、フォント、スタイル、およびフォントサイズを選択することができます。しかし、ドロップダウンフィールドに含めるオプションが多数ある場合はどうでしょうか。12以上の回答を含むフィールドを作成するのは困難であり、回答者が必要なオプションを見つけるためにリスト全体をスクロールするのも不快です。心配しないでください!私たちは、あなたと回答者の両方のための解決策を持っています。

お客様のために:
  1. 複数の選択肢を グループ化する ことで視覚的にグループを区別できます。 

    Group Choices
  2. 既にオプションのリストが準備できている場合、ドロップダウンフィールドの下で入力する代わりに一括で選択肢を追加することができます。例をチェックして、ドロップダウンに長いオプションのリストを追加する方法をご覧ください。

    Add choices in bulk

  3. グループ内の選択肢をコピーして、似た選択肢を持つ複数のグループを作成することもできます。

    Copy choices

  4. また、グループ化された選択肢を使用してField Rulesを使用することで、グループが選択された場合にのみ関係するフィールドを表示することができます。

    Using Grouped Choices in Field Rules
回答者へ:

代わりに回答者がリストから探している1つの選択肢を見つけるのを難しくする代わりに、入力欄を提供して選択肢を絞り込むようにしましょう。ドロップダウンでこの検索可能なリストを提供する方法については、こちらをご覧ください。

Searchable Dropdown

製品をマーケティングするための画像の選択 

製品を紹介したり、販売したいですか?実際の製品の画像を使用して、お客様が何を購入するかを知ることができます。画像は1,000の言葉にもなるということを覚えておいてください!

Choices without images     Choices with images
客室予約フォームをお持ちですか?画像を使用することで、選択した客室の実際の外観を受信者に提供することができます。
Room images with Image Choices field

レスポンデントに動的フィールドを使って会話をしよう

Dynamic field labels

フォームを埋める間に顧客と話していると、彼らにフレンドリーな体験を与える可能性が高いです。 各顧客のフィールド名をダイナミックフィールドラベルで個人化しましょう。(例えば 名前 )のフィールド入力を、 リッチテキスト オプションを使って、他のフィールドのフィールドラベルに含めるだけです。 詳細はこちら をご覧ください。

送信ボタン

送信 というのは汎用的で退屈な印象を与えます。もしも、より適切なCTA(Call to Action)を探してみましょう。例えば、登録、続行、申請、今すぐ予約、サインアップ、行く!など。顧客とよりよくコミュニケーションをとれる言葉を使いましょう。例えば、 私の席を予約 は、 席を予約 / 席を保留 よりもクリック率が高くなるでしょう。簡単な 今すぐ登録 )を付けることで、レスポンダーが送信ボタンを押す意欲を創出できます。さらに、ブランドを思い出させるような色をボタンに付けることで、少しのフレアを付けることもできます。CTAに注意を引くのに十分な大きさのフォントを使うようにしましょうが、フォームの他の部分を圧倒するほど大きくしないようにしましょう。
Submit button labels

Custom Forms - Zoho Forms   Custom Forms Online - Zoho Forms

フォームページの「レビュー」ボタン、「保存」ボタン、「ナビゲーション」ボタンだけでなく、「送信」ボタンもより意味のあるものにできます。フォームのボタンの変更とカスタマイズについて詳しくはこちらをご覧ください。


長いフォームの構造化 

私たちは、すべてのフォームが簡潔であるとは限りませんことを理解しています。時には、多くの情報を要求することがあり、フォームが長くなる可能性があります。これは、フォームが整理されていないように見える結果、回答者がフォーム入力の経験が面倒であると感じることになり、回答率が低下する可能性があります。 
私たちは、長いフォームにも対応しています! 必要な情報を入力しつつ、フォームを簡単に保つためのいくつかのヒントをご紹介します。

セクション ページ区切り フィールド

最初に、関連するフィールドや質問をまとめるグループフォームを作成します。そして、Zoho Formsの「Page Break」フィールドを使用して、これらのセクションを別のページに分割し、レスポンダーにきれいなフォーム入力体験を提供します。マルチページフォームを使用すると、ユーザーが簡単にフォームをナビゲートでき、短いフォームのイリュージョンを与えることができます。 
Multi-page forms

自分の好みに合わせてナビゲーションの外観をカスタマイズすることもできます。 詳しくはこちら をご覧ください。フォーム内のページをカスタマイズします。

フィールドルール

フォームを短くする方法もあります - フィールドルール! 回答者の入力に基づいて、フォーム内のあるフィールドを表示または非表示にすることができます。この方法で、回答者がフォームを埋めるときに関連するフィールドのみを表示して、フォームの入力体験をカスタマイズしながら、フォームを簡潔にして完了時間を短縮することができます。

条件付きロジックフォームビルダー - Zoho Forms

ハイコンバージョンリードジェネレーションフォームのための最高のデザインプラクティスをご覧ください。

ラジオからドロップダウンに切り替える

レスポンダに複数の選択肢を提供することは、彼らが持っているさまざまなオプションを学ぶための賢い方法ですが、オプションを表示するための適切な選択フィールドを選ぶことが、素晴らしいフォーム入力体験を提供するものです。
例えば、参加者が選択できるコースのリストを持つ単純なコース登録フォームを取り上げましょう。

ラジオフィールドによる選択
長いフォームには、ラジオフィールドによる選択がより多くのスペースを占めます。

Choices with Dropdown field

フォーム内で使用するスペースを減らすため、ドロップダウン形式で同じオプションを提供します。

リストをラジオフィールドにすでに設定しましたか?大丈夫です、フィールドを削除して再作成する必要はありません。クリック一つでラジオフィールドをドロップダウンに変更できます!

Switch to Dropdown

フォームをカスタマイズする時間がないですか?

時間が貴重である場合、フォームを望み通りにカスタマイズする前に共有し、リードを育成することはできない場合があります。
Zoho Formsのプリビルトテーマを使用すると、数秒で美しいフォームを作成することができます。

Pre-built Themes

これは、私たちの事前定義されたテーマを使用して構築されたサンプルフォームのいくつかです!

Pre-built theme example 1


Pre-built theme example 2

それだけではありません。デスクトップ、タブレット、モバイルでテーマがどのように見えるかをプレビューすることができます!
Preview form

    Zoho CRM 管理者向けトレーニング

    「導入したばかりで基本操作や設定に不安がある」、「短期間で集中的に運用開始できる状態にしたい」、「運用を開始しているが再度学び直したい」 といった課題を抱えられているユーザーさまに向けた少人数制のオンライントレーニングです。

    日々の営業活動を効率的に管理し、導入効果を高めるための方法を学びましょう。

    Zoho CRM Training



              Zoho WorkDrive Resources



                Zoho Desk Resources

                • Desk Community Learning Series


                • Digest


                • Functions


                • Meetups


                • Kbase


                • Resources


                • Glossary


                • Desk Marketplace


                • MVP Corner


                • Word of the Day









                                  • Related Articles

                                  • 日本語のテクニカルヘルプ記事のタイトルとして使用するために、概要を日本語に変換しましょう。

                                    お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。 美しいフォームは、受信したエントリー数に大きな違いをもたらすことができます。 Zoho Formsのテーマエディターでは、最小限の努力でフォームを磨くことができます。 ...
                                  • 「フォーム放棄率を低減する方法」

                                    お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。 ...
                                  • 「フォーム内のフォントの重要性」

                                    お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。 概要 素敵なフォームを作成するために、デザイナーのスキルが必要とは限りません。Zoho ...

                                  Resources

                                  Videos

                                  Watch comprehensive videos on features and other important topics that will help you master Zoho CRM.



                                  eBooks

                                  Download free eBooks and access a range of topics to get deeper insight on successfully using Zoho CRM.



                                  Webinars

                                  Sign up for our webinars and learn the Zoho CRM basics, from customization to sales force automation and more.



                                  CRM Tips

                                  Make the most of Zoho CRM with these useful tips.