入力フォームの構成・デザインが、意外な途中離脱の原因！【フォーム分析事例１】

入力フォームでのコンバージョン率改善には、ユーザーに途中離脱をさせず、フォームの入力完了率（確定率）を上げることが一番重要なポイントです。

途中離脱させないフォームにするためには、どういった理由で離脱やエラーが発生しているのか、原因を突き止めなければなりません。

一般にEFO（入力フォーム最適化）を利用すると、コンバージョン率はある程度改善されます。が、数多くのフォームを分析してきた中で言えることは、EFOの入力支援などの便利な機能だけでは改善できない問題点が他にも多く潜んでいる、ということです。

フォーム改善を進めるにあたりまず重要なことは、ユーザーがフォームをどのように利用しているか、詳細なログデータを取得し、そこから問題点や改善点を探ることです。

データを解析し、読み取った仮説を立て、それを実際にフォームや導線の確認をしながら検証していかなければなりません。

ここでは、実例データを用いて、入力支援だけでは改善できない離脱ポイントや落とし穴となるポイントについて解説します。

このフォームのログデータ上では、全体的に途中離脱率の高い項目はそれほどありませんが、なぜか「お支払い方法」のみ途中離脱率の数値が飛び抜けて高くなっています。

通常、ほぼ問題なく項目を入力できるフォームの離脱率は1%未満のごくわずかな数値となります。
この数値が高い場合、フォーム、もしくは項目自体に何らかの問題が潜んでいると考えられます。

ログデータを確認すると、この途中離脱に繋がるエラーのタイミングは「入力後」ではなく、「submit時」に発生しています。

エラー条件は、「必須エラー（必須項目であるが、未入力でエラーとなる）」となっています。

では、このログデータを前提として実際のフォームを確認します。

実際のフォームでの、離脱率の高い入力項目はこのようになっています。

ログデータをもとに仮説を立てると、ユーザーは、フォーム上部から問題なくスムーズに入力して進んでいますが、このお支払方法では、項目を選択しないまま、確認画面のボタン（submitボタン）をクリックし、必須エラーと表示されていると考えられます。

この「お支払方法」の項目は個人情報を入力した上部のフォーム（テーブル）とは別のテーブルで表示されており、 ユーザーはお支払方法までのテーブルで入力すべきフォーム項目が終了したと思っているかもしれません。

項目名に必須マークは表示されていますが、お支払い方法の項目それぞれが、デザイン的な要因で、選択項目ではなく、お支払い方法それぞれの説明に見えてしまっている可能性があります。

またこのフォームの場合、必須項目の背景色を、薄めのイエローで設定しており、 このカラー設定が、ラジオボタンの選択必須項目であることよりも、一般的な説明テキストエリア（説明枠）といったイメージを与え、入力をスルーさせてしまっているのかもしれません。

入力フォームでは、入力項目全体が一つのフォームであることをデザイン的に見せる方が、ユーザーにとってはわかりやすい場合があります。

すべての入力項目を一つのフォームテーブル内に収め、最終入力箇所がどこなのかをわかるようにすることも大切です。

また、補足となりますが、お支払方法をここでクレジットカードを選択すると、カード情報を入力させる入力項目が新たに表示されます。

ユーザーは、会員登録の際に、必ずしもクレジットカードが必要とは意識していない可能性があります。

そのため、この最終項目の場面で、今手元にクレジットカードがない、カード情報が外出しているのでわからない、という可能性も考えられます。

データからは、クレジットカード情報入力項目での途中離脱率は高くありませんでしたので、現状ではそれほど問題はないかもしれません。
しかし、このような部分においても、後ほどクレジットカードを入力できるような仕組みにしておくこともユーザビリティの高いフォームとなるでしょう。