SEOランディングページを使ってスマホ対応最適化済みの申込みフォームを作る

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

SEOランディングページはランディングページ運営に最適なワードプレステーマですが「入力がしやすく直感的な操作ができる申込みフォームを設置したい」という方にとってもおすすめのテーマです。なぜならSEOランディングページであれば設置したフォームが自動でスマートフォン対応になるからです。

SEOランディングページを使ってスマホ対応最適化済みのフォームを作る方法

項目数が多いフォームを設定している例

たとえば、下記のような『項目が多いフォーム』を運営サイト内に設置している一般的なページは、スマートフォンでは文字が小さく見えるため項目を入力しづらく利用者側も快適に利用できません。実際にスマートフォンでページを開いてスクリーンショットを撮ってみたのでぜひ一度ご確認くださいませ。

パソコン操作なら入力できますが、今の時代大半の方がスマホでインターネットを見ています。そのためスマホ対応していないフォームでは『利用者が離脱(サイトを離れる)する原因』にもなりえます。

国内最大級の広告サービスでエンジニア職

⇒ 今すぐ募集内容をチェック - 株式会社ファンコミュニケーションズ【AD】 -

SEOランディングページでフォームを設置した例

そして、以下が実際に「SEOランディングページを導入したうえでフォームを設置した例」です。上記のスクリーンショットとほとんど同じ項目数ですが、各フォームの見やすさがまったく違いますよね。

入力エラーも自動で表示

ちなみに確認画面へ進むときもし「入力漏れ」があると各項目で「エラー」を表示してくれます。

入力内容の確認画面

下記は実際に「確認画面」へ進んだ例です。ワードプレスでも確認画面は使えます。すべての項目がグレーアウト(灰色になっている)しているので入力した内容をパッとみただけですぐに確認できますね。

送信完了時はメッセージが表示

そして、実際にフォームを送信したあとに表示されるメッセージが下記です。

送信時に自動返信メールも配信

さらに送信後は入力した各項目が自動返信メールで受け取れます。返信メールはフォーム送信後すぐに届くので申込み忘れも防げます。もちろん、メール文面は自由に設定できますので補足も伝えられます。

まとめ

サイト内に設置したフォームがスマートフォン対応していないと多くのユーザーは離脱してしまいます。スマートフォンで項目を入力する際に操作しづらかった「またあとにしよう…」となって結局そのまま申し込まなくなるパターンが大半です。そのため申込みフォームを利用するユーザー側のことを真剣に考えると「フォームをスマホ対応」させておくことは最低限のエチケットとも言えます。特に項目が多いフォームであればあるほどスマホ対応(レスポンシブ化)は必須です。SEOランディングページであれば設置したフォームは『すべて自動でスマートフォン最適化』されますのでぜひお試しくださいませ。

- 新コースでワードプレスを学ぶ【AD】-

念のため本日フォームを設置したデモURLを置いておきます。実際に手持ちのスマートフォンでアクセスしてスマホに最適化されているか併せてチェックしてみてくださいませ。

▼上記でスクリーンショットを撮った設置フォーム(サンプルデモ)
https://wp-labo.com/seo-landingpage/demo-form/

【今すぐ無料プラグインを手に入れる】
無料ダウンロードはこちら

ワードプレス専門家に丸投げする

WPホームページ研究所はワードプレスを中心としたブログ作成・ホームページ制作・オウンドメディア構築・プラグイン設定・調整など幅広いカスタマイズに対応しております。 記事の掲載情報はもちろんお好みの機能をいただければ専属スタッフが心を込めて対応させていただきます。まずはお気軽にお問い合わせくださいませ。

お問い合わせの種類をお選びください(もっとも近い項目)

法人の場合は法人名とご担当者のお名前をご入力ください

返信時のご連絡に利用するメールアドレスをご入力ください

運営中のウェブサイトURLがあればご入力ください

お困りの内容があれば詳しい内容をお聞かせください