フォーム磨きも大事!スマホフォームでの最適な見せ方

フォーム磨きも大事!スマホフォームでの最適な見せ方

こんにちは、最近、脱毛サロンに行ったら、これ以上日焼けするともう施術できませんと言われました。かもめです。

見た目を気にするなら、努力も必要だという事をひしひしと感じているこの頃。
そして見た目と言えば、フォーム。そこで今回は、前回に引き続き、スマホフォームの見せ方に関してです。

この記事「ブルース・リーに教わる、スマホフォームの改善」にもあるように、スマホフォームは、全体のページを短くしたほうが良いと言われています。

近年、スマホが普及し、ほとんどのサイトがスマホ対応していますよね。その中でも、スマホ対応の方法として、レスポンシブ対応があります。

レスポンシブ対応をしたフォームによく見られる、もったいないフォームの見せ方を紹介します。

もったいないスマホフォームのレイアウト表示

image06

ここでのもったいないポイントは、縦に項目が並んでしまってページ自体が長くなっていることです。

スマホフォームの良い表示例1

image04

こちらのフォームは、電話番号項目を1項目にまとめ、縦も短くすっきりとした印象です。

スマホフォームの良い表示例2

image05

3つの項目を横に並べ、縦に長くならないように工夫をしています。

レスポンシブ対応の落とし穴

レスポンシブ対応は、デザインが変わってもPCとコンテンツが同じ内容なので内容の修正が楽だというメリットもありますが、デバイスの大きさに合わせ、自由にデザインを変えることができず、デバイスの大きさによっては、今回ご紹介したような思わぬ落とし穴が出てくることもあります。

レスポンシブ対応をする時や、スマホサイトを作ろうとする時は見せ方にも要注意です!
これがフォーム磨きですよ!

スマホ対応を今後お考えの方は、是非、フォームコンバータもご覧ください!

コメント