デザインでこんなにもユーザビリティが変わる!新機能”CSS変更機能”のご紹介

  • 2016年11月29日
  • by 
デザインでこんなにもユーザビリティが変わる!新機能”CSS変更機能”のご紹介

こんにちは。紅葉で木々が色づき、自然好きにはたまらない季節になってきました。
自然派20代女子のミヤです。

見た目で変わる印象

見た目で人の印象ってとても変わりますよね!
髪の長い女の子が、いきなりショートカットに変わっていたら、思わず「ドキッ」とする人も多いはず。

この”見た目”ですが、皆さんご存知のとおり入力フォームにおいても重要です。
でも、実際にデザインを変更するとなると結構手間ですよね。。

そこで今回は、見た目を簡単に変えられる「CSS変更機能」の事例をご紹介します!

事例1

とあるスマホサイト会員登録フォームのボタンデザインを、CSS変更機能で変更しました。

image05

「会員登録情報を直接入力」とありますが、チェックボックスの下にボタンが無く、どこから入力ページに進むのか、ぱっと見わかりづらいです。

そこで、ボタンを目立たせて、文言を変更したところ、CV率が0.6ポイント改善、次ページへの遷移率は8.3ポイント改善しました!

事例2

二つ目の事例は、PCサイト会員登録フォームです。

このフォームは一番初めの項目が入力難易度の高い「メールアドレス」からはじまります。
項目の幅も狭く、何となくごちゃごちゃして見えます。

また、任意項目がずらーっと続き、かなりスクロールしてようやく送信ボタンが見える。。。
ぱっと見、面倒に感じてしまいますよね。

image07

このフォームを図のように変更したところ、直帰率0.2ポイント減少、途中離脱率0.6ポイント減少、そしてCV率は1.2ポイント改善しました!

こちらの事例に関しては、項目の順番を入れ替えたり、項目の幅を変えたり、送信ボタンを常にページ下部に見せるようにしたりと、改修並みの大幅デザイン変更でしたが、全てCSS変更機能で設定を行っております。

やっぱり見た目って大事

ちょっとしたデザイン変更で、ユーザビリティを改善することができます。
また、デザインを考える際には、「ユーザをいかに悩ませないで、スムーズにサイトを利用してもらえるか」が重要です。

ぜひ、いろんなデザインを試してみて、一番「いい印象」を与えられるようなサイトデザインを見つけましょう!

CSS変更機能の詳細はこちらから

【週刊bitWave】(メルマガ)始めました!
登録はこちらからメールアドレスを入力してお申込みください。

ご登録いただいたメールアドレスは 【週刊bitWave】の更新情報の配信にのみ使用します。

個人情報の取扱いに関しては、「プライバシーポリシー」をご確認ください。解除はいつでこちらから行うことが可能です。

あなたにおすすめ

CRO | コンバージョン率最適化の手法(第11回)... 今回は「ランディングページの適した長さ」ついてご紹介させていただきます。 <前回のおさらい『CRO | コンバージョン率最適化の手法(第10回)』> ランディングページは長いほうが良い? 訴求ポイントだけを抑えたシンプル...
フォームデザイン実証研究 送信ボタン編... こんにちは! 最近の悩みは山登りをするとひざの痛みが気になること、、、 本日のブログは自然派20代OLことミヤが担当させていただきます。 さて、サイトでCVを上げるためには徹底的にテストを繰り返していくことですが、 今回は日...
まかないこすめ|美肌のGOLDAYSで有名な金箔屋のおもてなしを体感!... こんにちは!暑すぎて溶ける~と思っていたら毎日雨! 気まぐれな都内の天気に振り回されて夏バテ気味のふじこです! 早速ですが、先日弊社お客様「まかないこすめ」様の新商品発表会に参加させていただきました。 金箔と美容?とお考えの方もい...
上から目線で精神勝利するSEO SEOがGoogleに依存する以上、どんなに頑張ってもGoogleには勝てない。 Googleを騙してやろうとか、使ってやろうなどと考えたところでたかが知れている。 悲しいかな、3歳児が母親にする小さな反抗程度の影響力でしかないのだ...