離脱を減らす寄付申込フォームの情報設計 5つのポイント

寄付の申込をサイトのフォームで受け付けている非営利組織・非営利団体は多いと思います。しかし、トップページやミッション、活動内容等のページには力を入れているが、寄付申込フォームはただ設置している状態になっていないでしょうか？

これは非営利セクターに限らないのですが、フォームの品質はCV（コンバージョン）に直結する超重要事項です。

キャンペーンやプロモーションをうって集客は成功しても、フォームの離脱率が高ければその費用を垂れ流しにしているに等しいのです。そこでこの記事では、離脱を減らす寄付申込フォームの情報設計のポイントについてまとめました。

ポイント1. スマートフォンに最適化する（モバイルファースト）

総務省の情報通信白書によれば、スマートフォンによるWebサイトへのアクセスは全体の6割を越えています。また、Googleは検索対象ページの半数をMFI（モバイル・ファースト・インデクシング）に切り替え済み」と発表しています。

フォームも例外ではなく、大多数のユーザはフォームをスマートフォンで利用します。そのため、フォームのスマートフォン対応はSEO（Search Engine Optimization: 検索エンジン最適化）の観点からも、EFO（Entry Form Optimization: エントリーフォーム最適化）の観点からもとても重要です。

スマートフォン向けのEFOの主要な方法は次の通りです。

• 入力フィールドは横幅いっぱいで表示する
• 最適な入力モードで表示する
• 項目数を極力減らし、なるべく必須項目のみにする
• 住所は郵便番号から自動入力する
• 半角、全角、ひらがな、カタカナの変換は自動で行う
• プレースホルダを使って入力例を示す
• etc…

ポイント2. 寄付金額、クレジットカード情報の入力はフォームの先頭に配置する

寄付申込フォームの場合、寄付金額を一番最初に配置します。また、寄付金額の指定はドロップダウンUIを採用して、ユーザは選択するだけで指定できるようにします。
こうすることで、ユーザにとって最も楽に入力できる項目をフォームの先頭に配置し、ユーザにスムーズにフォームの入力を進めてもらえます。なお、寄付金額指定の近くには各寄付金額でどんな支援が可能になるかを示すとより良いです（例: 「1,000円/月の寄付で子供1人に1時間の授業を提供できます」）。

また、2番目には決済方法の指定を配置します。特にクレジットカード情報の入力は先に配置します。なぜなら、ユーザが使いたい決済方法やユーザの持っているクレジットカードのブランドが使えるか否かを先に示さなくては、ユーザにとってフォームの他の項目の入力が無駄になってしまうリスクがあるからです。

ポイント3. 決済は一画面で完結させる

フォームの画面遷移が増えるほど、ユーザが途中で離脱してしまう可能性はあがります。
ですので、寄付申込フォームでは入力項目を最小化するとともに、なるべく一画面で完結させるようにします。

その際、特定商取引法が示すように

ア． 最終的な申込みにあたるボタンのテキストに「私は上記の商品を購入（注文、申込み）します」と表示されている。
イ． 最終的な申込みにあたるボタンに近接して「購入（注文、申込み）しますか」との表示があり、ボタンのテキストに「はい」と表示されている。

に添うように申込ボタンのテキストには留意します。例えば、「送信」のような購入にあたることが不明瞭なテキストは用いないようにします。

ポイント4. 余計な情報は表示しない

ユーザがフォームの入力に集中できるように、余計なボタンやリンク、情報などは表示しないようにします。デザインテイストは他の画面とあわせる必要がありますが、ヘッダやフッタ のナビゲーションも極力削ります。

ポイント5. 離脱の解析を行い、フォームをブラッシュアップしていく

最初から最適なフォームを構築することは不可能です。運用しながら、様々な施策を試しながら地道にCVR（コンバージョン率）をあげていくことが大切です。具体的には、Google Analytics などの解析ツールを用いて、ユーザがどこで離脱しているか計測を行い、フォームを継続的にブラッシュアップしていきます。

まとめ

寄付申込フォームの離脱を減らす5つのポイントをみてきました。全てのポイントに通底していることはユーザにいかに楽をして入力をしてもらえるかです。

フォームの設計ではついつい「どんなデータを得たいか？どんな運用をしたいか？」などの組織・団体側の視点で組み上げてしまいがちですが、ユーザ視点でフォームを見直すことで様々な改善案が浮かんでくることをご理解いただけたと思います。

　進地 崇裕