EFO施策とは
EFOとは、Entry Form Optimizationの略称で「エントリーフォーム最適化」のことを意味します。
EFO施策では、Webサイトのお問い合わせや会員登録などの入力フォームにおいて、ユーザビリティをより良くすることで入力未完了でのページ離脱を防止したり、コンバージョン完了率高めたりするような施策を打ち出していきます。
一般的にEFO施策を進めていく際には専用のツール導入やフォーム改修を行っていきます。
EFO施策を無料で実践することは可能
EFO施策は無料で実践することができます。
前提条件
EFO施策を無料の範囲で実施していくには3つの前提条件を満たしている必要があります。
◆html,cssの基本知識がある
◆自社サイトのhtmlファイル、cssファイルを自由に変更できる
◆JavaScriptで作成されたツールの実装ができる
EFO施策ではエントリーフォームのデザインや機能を、入力がしやすいように整えていくことが主な施策となります。したがって、サイトページのデザインを変更する為の基本知識や、それができる環境は必要です。
EFO施策を無料で実施する手順
では、実際にEFO施策を無料で実施していきます。
準備
EFO施策を無料で実施していく際にはアクセス解析ツールが必要です。
本記事では、アクセス解析ツールとしてGoogleアナリティクスを紹介します。
Googleアナリティクスとは
「Googleアナリティクス」はGoogleが提供するアクセス解析ツールです。
有料版もありますが、無料版では以下の情報を計測することが可能です。
・PV数（ページが閲覧された回数）
・UU数（サイトを訪問したユーザー数）
・閲覧されている際のデバイス（パソコンorスマホなどデバイスの割合）
これらのデータを見ることで、どの程度離脱が発生しているのか、どんなデバイスから閲覧されているのかなどさまざまなデータを把握することができます。
それによって、より効果的なEFO施策を講じたり、その効果を確認することができるようになります。
取り組み
EFO施策の取り組みは以下の2つがあります。
・エントリーフォームのデザインを変更する
EFO施策の中では一番初歩的な取り組みになります。
EFO施策といえば、エラー吹き出しを表示させたり、成功サインマークを表示させたりなどがありますが、たいそうなツールを導入するよりもまず、入力者にとってフレンドリーなエントリーフォームであることが大切となります。
・ブラウザの既存機能(フォームバリデーション)を活用する
ChromeやEdge,safariといった各ブラウザには既存の入力補助機能(バリデーション)が存在します。
既存のフォームに対してhtmlで若干の記述変更を加えるだけで以下のような機能の追加が可能です。
ここでは代表的な機能を4つ紹介します。
※ブラウザによってサポート度合が違う為、ブラウザによっては動作しない事もあります。
入力補助機能①：キーボードタイプの指定
スマートフォンなどで項目を入力する際、電話番号なら数字専用のキーボード、メールアドレスならばメールアドレス用のキーボードが自動で立ち上がる機能です。
・設定の方法
inputタグなどの項目に付与するtype属性にその項目の種類に沿った属性値を付与する事で機能します。これはhtml5から可能になった機能です。
例)電話番号
<input type=”tel”id=”tel” placeholder=”090-1111-2222”>
入力補助機能②：IMEモードに自動切り替え
パソコンで項目入力時に、入力モードを自動で切り替えてくれる機能です。
※利用できるブラウザは主にInternetExploreやfirefoxとなります。
・設定の方法
対象項目(テキストエリア)に対して、CSSでime-modeプロパティを付与します。
日本語入力モード、英数字入力モード、英数字入力固定モードなどの指定が可能です。
例)氏名
【html側の設定】
<input type=”text”id=”name” placeholder=”山田太郎”>
【CSS側の設定】
#name {
ime-mode: active;
}
入力補助機能③：エラーメッセージを表示させる
必須入力の項目が空の状態で送信された場合にエラーメッセージが表示される機能です。
・設定の方法
inputタグにrequiredを加えるだけで実装が可能です。
例）
<form>
<input type=”text” required>
<input type=”submit”value=”送信”>
</form>
入力補助機能④：パターンマッチング
設定した入力パターンと入力値を照合し、一致しない場合はサブミットボタンを押した時にエラーメッセージを表示させる機能です。
・設定の仕方
pattern属性の値に正規表現で入力パターンを追加するだけで実装が可能です。
例）
<form>
<input type=”text” pattern=”[0-9]{10-11}” required>
<input type=”submit”value=”送信”>
</form>
（ご参考）優良なEFOツールを紹介
では最後にEFOツールをご紹介します。
有料ツールとの違い
前章でご紹介した通り、サイト編集さえ可能であれば、難易度の高い技術力がなくともEFO改善に向けた施策はある程度は可能です。
ご参考までに、本章では有料ツールにした場合のメリットについて紹介します。
◆有料EFOツールメリット①：計測ツールが充実している
EFOに特化したツールの場合、Googleアナリティクス以上により詳細な情報（入力項目ごとの計測情報や離脱の種類など）を得ることができ、精度の高い施策を打ち出すことが可能です。
◆有料EFOツールメリット②：利便性が高い
さらに複雑な機能を手軽に実装することができ、専門知識を持ったスタッフを社内でしなくても高度な設計が可能です。
またツールによっては、改善案までサポートしてくれるサービス提供もあり、分野に特化したアドバイスを獲得することができます。
EFOツールについてはこちらの記事をご参照ください↓
関連記事： おすすめのEFO（入力フォーム最適化）ツール11選！比較のポイントを押さえて紹介！
まとめ
本記事では、特別なツールを使わずに無料でできるEFO施策の方法について紹介しました。
EFO施策の意義はいかにユーザーに離脱されずにフォームを入力してもらうかにあります。そのためにはユーザーに負荷をかけないように施策を実行していく必要があります。本記事でご紹介したとおり、アクセス解析や既存の機能を駆使して無料でEFO施策を実施していくことは可能です。手動でいいからまずは自分でやってみたいという方であればまずは無料で始めてみてはいかがでしょうか。
