アーム代表の伊藤です。
入力フォームで離脱を防ぐ設計の基本は、項目をその場で必要なものだけに絞り、必須と任意で迷わせず、エラーはその場で直し方まで伝え、スマートフォンで片手で完結させるの4点です。
ECではカゴ落ちが平均70.22%にのぼり、離脱理由の17%は手続きが長い・複雑だからという調査があります（Baymard Institute）。この記事は、最初の表で改善の全体像をつかみ、4つの原則と離脱の原因まで最短でたどれる構成にしています。
貴社のフォームがNGでないか、7要素でチェックする
- 要素は項目数からボタンまで7つ
- 改善効果が最大なのは項目数
- 次は4つの原則で順に直す
EFO（入力フォーム最適化）としてよく語られる要点を、要素ごとに整理しました。まずこの表で、貴社のフォームがNG側に当てはまっていないかを確かめてください。
要素 | やりがちなNG | 改善の方向 |
|---|---|---|
項目数 | 後で使うかもしれない情報まで必須にする | その場で本当に必要な項目だけに絞る |
レイアウト | 横2カラムで詰め込む | 縦一列に並べ、視線を上から下へ一本に |
ラベル | プレースホルダーを項目名の代わりにする | ラベルは入力欄の外に固定し、関連項目をグループ化 |
必須・任意 | どちらか分からない、または全項目が必須 | 必須と任意をひと目で見分けられる表示に |
エラー | 送信後にまとめて表示、内容が曖昧 | 該当欄の近くに、直し方まで具体的に表示 |
入力補助 | すべて手入力させる | 郵便番号からの住所補完や入力形式に合うキーボードを用意 |
ボタン | 送信の隣に同色のリセット、文言が「送信」だけ | 主ボタンを目立たせ、文言で結果を伝える |
このうち改善の効果がもっとも大きいのが項目数です。次の4つの原則から順に直していきます。
入力フォームのUIデザインを改善する、4つの原則
「あると便利」な項目は、削るか任意にする
改善の効果がもっとも大きいのが項目数です。営業やマーケティングが「あると便利」と言う情報を全部入れると、フォームはすぐ膨らみます。判断基準はシンプルで、その項目が無いと次の一歩（折り返しの連絡や見積もり）が進まないか、です。
進むなら任意にするか、いっそ外す。役職や従業員規模のような情報は、最初の一通のやり取りの中で自然に聞けます。
この「聞き方」まで含めて項目設計です。アーム自身のフォームでも、予算欄を自由記述の必須にしていた時期、届いた問い合わせ3件のうち2件の予算欄は「ご相談」「0」でした。欄は埋まっているのに、情報としては死んでいるわけです。
2026年8月の作り直しで選択式に変え、「まだ決まっていない」を正規の選択肢として用意しました。答えにくい必須項目は、外すか、答えやすい形に変える。どちらかです。
「減らすと質が落ちる」という声にどう答えるか
項目を削る提案をすると、社内から「質の低い問い合わせが増えるのでは」という懸念が返ってくることがあります。完了率と問い合わせの質は、別の指標として切り分けて考えるのが実務的な答えです。項目を減らして増えるのは、それまで面倒で離脱していた、もともと興味のあった層の問い合わせです。質が下がるのではなく、埋もれていた需要が拾えるようになります。
ただし、削れば削るほどよいわけでもありません。申し込みフォームのように当日の運営に使う情報まで削ってしまうと、今度は現場が困ります。削ってよい項目と、運用に必要で残すべき項目は別です。判断基準は、その項目が無いと次の一歩（連絡・受付・準備）が具体的にどこで詰まるかを、運用担当に確認すること。ここを飛ばして数だけ減らすと、フォームは軽くなっても現場が重くなります。
必須と任意をひと目で分け、書き方の例を添える
必須と任意が、ひと目で見分けられること。そして各欄に、どう書けばいいかの入力例を添えること。プレースホルダー（欄の中の薄い文字）は入力を始めると消えるため、項目名の代わりには使わず、あくまで例示にとどめます。
この小さな配慮が、ユーザーの「これで合っているか」という不安を減らします。
エラーは、その場で、直し方まで伝える
エラーは、該当する欄のそばで、何をどう直せばいいかまで伝えるのが原則です。「入力内容に誤りがあります」だけでは、ユーザーは犯人探しを強いられます。「電話番号はハイフンなしで入力してください」まで書く。
入力途中に赤字を出し続けると急かされて逆効果になるので、指摘は入力欄から離れたタイミングか送信時に寄せます。
スマートフォンで、片手で完結できるようにする
スマートフォンで、片手で、最後まで完結できることを基準にします。1カラムの縦並び、指で押しやすいボタンサイズ、入力形式に合ったキーボード（メール欄では@が近い配列、電話欄では数字キーパッド）、そして自動入力への対応。パソコンの画面だけで完成を判断しないことが、いちばんの近道です。
入力フォームで離脱が起きる4つの原因
- 原因は項目数・見えにくさ・スマホ・不安の4つ
- 15項目のBtoBフォームを絞り込み改善
- 送信直前は同色リセットボタンが罠
原因は、項目の多さ、現在地とエラーの分かりにくさ、スマートフォンでの押しにくさ、送信直前の不安の4つに整理できます。
15項目のBtoBフォームを絞ったら、完了率が上がった
フォームを開いた瞬間に入力欄がずらりと並んでいると、人は中身を読む前に「面倒だ」と判断します。
実際の案件でも、任意項目まで含めて15項目あったBtoBの問い合わせフォームを、商談に本当に必要な項目へ絞り込んだところ、完了率が改善したケースがあります。
項目をひとつ減らすことは、問い合わせをひとつ拾うことだと考えると、判断がしやすくなります。
エラーが上にまとまっていると、探す・戻るを強いられる
入力中のフォーカスが目立たない、エラーがフォームの一番上にまとめて出る、送信して初めて間違いが分かる。こうしたフォームは、ユーザーに「探す」「戻る」「やり直す」という余計な労働を強います。人はストレスを感じた回数だけ離脱に近づきます。
PCで確認しただけのフォームは、スマホで別物になる
パソコンで作ってパソコンで確認したフォームは、スマートフォンで別物になります。ボタンやチェックボックスが小さくて押し間違える、横に2列で並んでいて指がぶつかる、電話番号欄なのに文字キーボードが開く。
利用の主役はスマートフォンですから、ここが弱いと大半のユーザーを取りこぼします。UI全体の使いにくさとして捉え直したい場合は、UI/UX改善しても「使われない」のはなぜ？成果が出ない原因の切り分けと直し方もあわせてご覧ください。
送信の直前に、不安と操作ミスが待っている
送信ボタンの隣に、同じ見た目のリセットボタンを置かない。これは基本ですが、既存のテンプレートやツールの初期設定のまま放置されている現場を何度も見てきました。加えて、入力した情報がどう扱われるかが書かれていないと、慎重な人ほど最後の一押しをためらいます。
入力フォームのUIデザインとは、完了率を上げる設計そのもの
- カゴ落ち平均70.22%・Baymard調査
- スマホ利用74.4%・PCは46.8%
- 完了率1割上昇で問い合わせも1割増
入力フォームのUIデザインとは、見た目を飾る作業ではなく、ユーザーが迷わず最後まで入力を終えられる状態を設計することです。装飾ではなく、完了率という数字に直結する機能だと捉えてください。
カゴ落ち平均70.22%、離脱理由の17%はフォームのつくり
まず、フォームの出来がどれだけ事業の数字を動かすかを数字で見ておきます。ECの領域では、独立系のUX調査機関Baymard Instituteが50件の調査を平均した結果として、平均70.22%のカゴ落ちが起きていると報告しています。
同じ調査で示されている理由別の内訳は、単に見ていただけという回答を除いた離脱理由を母数にしたもので、そのうち17%が、購入手続きが長い、あるいは複雑であることを理由に挙げています（出典: Baymard Institute「Cart Abandonment Rate Statistics」（2026年閲覧））。
買う気で商品まで選んだ人の一定数が、フォームのつくりだけで消えるということです。
スマホ入力が74.4%。PC基準の確認では見抜けない
もうひとつ、そのフォームがどんな画面で入力されるかも押さえます。
総務省の調査では、個人がインターネットを利用する端末はスマートフォンが74.4%で、パソコンの46.8%を大きく上回っています（出典: 総務省「令和7年版 情報通信白書」（令和6年通信利用動向調査））。
フォームは、まず小さな画面で片手で入力される前提で設計する必要があります。
完了率が1割上がれば、問い合わせが1割増える
フォームの数字は、そのまま損益計算書につながっています。完了率が1割上がれば、同じ広告費のまま問い合わせが1割増える。しかも増えるのは、内容を理解したうえでフォームまで進んだ人の問い合わせですから、商談にもつながりやすい。
フォーム改善は、新しい集客を足さずに売上の取りこぼしを止める施策です。穴の空いたバケツに水を足す前に、穴をふさぐ話に近いと考えてください。
入力フォームは思いつきで直さない。測って、1点だけ変え、また測る
- 指標は到達率・開始率・完了率・CVR
- 仮説は1つずつ・変更も1点だけ
- 一度に全部変えると原因が分からない
思いつきで直すと、良くなったのか悪くなったのか分からなくなります。まず測り、一つずつ直し、また測る。この順番を守るだけで、改善は説明のつくものになります。
指標 | 見るもの |
|---|---|
フォーム到達率 | ページ訪問者のうち、フォームまで来た人の割合 |
入力開始率 | フォームを見た人のうち、入力を始めた人の割合 |
完了率（離脱率） | 入力を始めた人のうち、送信まで終えた人の割合 |
CVR | 訪問者のうち、問い合わせや申し込みに至った人の割合 |
- 完了率の「（離脱率）」は、完了率の裏返しの値を指す。
手順はこうです。まず、どの欄で人が離脱しているかを計測ツールで特定する。次に、その欄について原因の仮説を1つ立てる（項目が多い、エラーが不親切、など）。そして仮説に沿って1点だけ直し、一定期間また計測する。
一度に全部変えると、どの変更が結果を動かしたのか分からなくなります。フォームは、公開したら終わりではなく、公開してから育てる対象です。
入力フォーム改善でよくある3つの失敗
- 見た目優先で入力欄の境界が不明瞭
- PCのみ確認しスマホの押しにくさ見逃す
- 数字を測らず感覚で改修を語る
最後に、現場で繰り返し見てきた失敗を挙げます。自分のフォームに当てはまらないか、点検してみてください。
- 見た目のおしゃれさを優先し、入力欄の境界やボタンが分かりにくくなる
- 確認画面を丁寧に作りすぎて、画面遷移が増え、かえって離脱を招く
- 「とりあえず項目を増やしておく」を続け、誰も使わない欄が残り続ける
- パソコンだけで確認し、スマートフォンでの押しにくさに気づかない
- 数字を測らずに改修し、良くなったかどうかを感覚で語ってしまう
社内で使う管理画面や業務システムのフォームも、原因の構造は同じです。毎日使う画面ほど、小さな入力の手間が積み上がってコストになります。
入力フォームでアームが見るのは完成度でなく、完了率が動くかどうか
- 全面刷新でなく漏れ箇所から切り分け
- 2026年8月に自社ドメインのフォームへ移行
- 受注につながった問い合わせの経路はAI
アームは、フォームを「きれいに作る」対象ではなく、「事業の成果につなげる」対象として設計します。作れることではなく、選ばれること、そして数字が動くことを起点に考えます。
作り直す前に、どこで漏れているかを切り分ける
フォームが振るわないとき、いきなり全面リニューアルに走るのは危険です。到達率が低いのか、入力途中で落ちているのか、送信直前でためらっているのか。漏れている場所によって打ち手はまったく違います。医者が痛む場所を確かめてから処置するのと同じで、まず切り分けます。
色や余白でなく、聞く項目と順番から見直す
フォームの使いにくさは、色や余白だけの問題ではありません。何を、どの順番で、どこまで聞くか、という情報設計の問題であることがほとんどです。
アームはディレクターを挟まない一気通貫の体制で、課題を直接聞いたデザイナーがそのまま設計します。だから、聞くべき項目の取捨から画面の見え方まで、一貫した判断で整えられます。
フォーム単体でなく、集客からの一続きで考える
フォームは、集客の出口です。どんな人が、どの広告やページから来て、何を期待して入力しようとしているか。その流れの中でフォームを見ると、削るべき項目も、添えるべき一言も見えてきます。
サイト全体でリード獲得を伸ばす視点と、LPの入口から成果までの設計は、それぞれこちらにまとめています。
フォームを、計測装置としても設計する
もうひとつ、2026年8月に自社のフォームを作り直して確信したことがあります。フォームは入力の場であると同時に、事業判断の材料を集められる計測装置だということです。
アームの問い合わせフォームは長らく外部のGoogleフォームで、送信がGoogleのドメイン上で起きるため、GA4では問い合わせの実数が測れませんでした。
自社ドメインのフォームへ移行し、送信完了ページへの到達を計測のゴールに設定したことで、初めて「何件の相談が来たか」が数字になりました。
流入経路の選択肢に、AIを並べてみた
あわせて「どこでアームを知りましたか」という項目を、検索エンジンやSNSに加えてChatGPT・Gemini・Claude・AIによる概要・Perplexityまで分けたチェックボックスにしました。
AI経由の訪問はGA4でもSearch Consoleでも正確に測れないため、フォームでの自己申告が、AI経由の問い合わせを捕捉できる実質唯一の計測点です。
8社を読み比べたら、AIの選択肢は2社だけだった
2026年8月に制作会社8社のフォームを実際に読み比べたところ、「AIで知った」という選択肢を置く会社がすでに2社ありました。
実際、アームで唯一受注につながった問い合わせは、この欄が「AI」でした（母数3件の話なので、傾向ではなく一場面として書いています）。
入力フォームの改善は、要件の整理からで構いません。今のフォームのどこで人がこぼれているか分からない段階でも大丈夫です。入力フォームの改善について相談する
よくある質問
入力フォームの項目は、少なければ少ないほどよいのですか。
基本は少ないほど完了率は上がりますが、目的は「必要な情報を、負担を最小限にして受け取ること」です。商談や折り返しに必須の項目は残し、あると便利な程度の項目を任意にするか外す、という取捨で考えてください。
プレースホルダーは使わないほうがよいのですか。
項目名の代わりに使うのは避けてください。入力を始めると消えてしまい、何を入れる欄だったか分からなくなるためです。ラベルは欄の外に固定し、プレースホルダーは入力例の提示にとどめるのが安全です。
フォームの改善は、どこから始めればよいですか。
まず計測です。どの欄で人が離脱しているかを特定してから、その1点に絞って直します。当てずっぽうで全部を変えると、効果の検証ができなくなります。
入力フォームのUIデザインとフォームデザインは同じ意味ですか。
ほぼ同じ意味で使われます。本記事では、見た目の装飾だけでなく、項目設計やエラー設計、スマートフォン対応まで含めた「使い勝手の設計」全体を指しています。
スマートフォン対応で、特に気をつけることは何ですか。
1カラムの縦並び、押しやすいボタンサイズ、入力形式に合ったキーボードの表示、自動入力への対応の4点です。パソコンだけで確認を終えず、実機で片手入力を試すことをおすすめします。
入力フォームのUIデザインは、飾りでなく完了率という数字の設計で決まる
入力フォームのUIデザインは、飾りではなく完了率という数字の設計です。項目を絞り、縦一列で迷わせず、必須と任意を明確にし、エラーはその場で直し方まで伝え、スマートフォンで片手で終わる。そして、直したら必ず測る。この積み重ねが離脱を減らします。
アームは、入力フォームを含めたUIの設計と改善に取り組んでいます。どこから手をつけるか判断がつかないときは、よければご相談ください。今のフォームの画面を見せていただくところからで構いません。フォームのどこで離脱しているか相談する
