コンバージョンレートを格段に上げるボタンデザインのコツ！

「資料請求」「商品を購入」「会員登録」などのアクションを、いかにユーザーから引き出すかは、デザイナーにとって大きな課題です。もちろん、サービスや商品が魅力的なものであることや、ユーザビリティの高いページを設計することは言うまでもありませんが、アクションの入口となるボタンのデザインを改善することで、大きな成果をあげられることもあります。

ここでは、サイトに訪れてくれたユーザーを、コンバージョンに繋げるためのボタンについて考えていきましょう。

ユーザーのアクションを引き出すためのポイント

1. 色や大きさでボタンを目立たせる

ボタンを目立たせるベーシックな方法は、まわりとのコントラストの差が大きくなるように色を計画することです。たとえば、背景色が白やグレーなどの場合、ピンクや赤などのビビッドで強い色がいいでしょう。逆に背景色が黒など強い色の場合は、ボタンの色を白や黄色などにしてコントラストの差を確保しましょう。

また、ボタンそのものを大きくしたり、まわりにホワイトスペースを取ったりして目立たせるのも効果があります。

2. 他のボタンとデザインを変える

コンバージョンに関わるボタンは、他とデザインを変えるのもひとつの方法です。たとえば、アイコンや自社のキャラクターなどの画像を入れたり、アニメーションによる演出を加えたりすることで、より目立たせ、ユーザーの興味を引くことができます。

3. おトク情報を加える

ECサイトの場合、ユーザーにとって有益な情報をボタンに表示することで、興味を引くのも有効な方法です。例としては「本日限り50%OFF」「今なら送料無料」「サイトだけの限定商品」などのようなおトク情報があげられるでしょう。実店舗で店員さんが商品を勧めるときの文句を表示すると考えると、分かりやすいのではないでしょうか。

4. 手軽さをアピールする

資料請求や会員登録のボタンの場合は、手軽さをアピールする方法があります。たとえば「3ステップで簡単登録」「無料で資料請求」などのフレーズをボタンに入れ込むことで、アクションのハードルを下げるようにしましょう。

「資料だけならお金はかからない」と分かりきっている場合でも、「無料」という言葉をあえて表示させることで、ユーザーに手軽さをアピールできる効果があります。

5. ロード中でも状況を知らせる

ユーザーのインターネット環境が必ずしも高速であるとは限りません。読み込みに時間がかかる場合に備えて、ロード中の状況を知らせることができるような設計にしておきましょう。

ボタンを押してすぐに反応がないと、ユーザーによってはボタンを連打したり、そのままあきらめたりするケースも少なくありません。矢印がくるくる回るアイコンを表示させるだけでも効果があるので、「何かが動いている」ことが分かるようにしておきましょう。

ユーザーの背中を後押しする役目

検索やリンクを通してわざわざページにたどり着いたユーザーは、すでに商品やサービスに対して何らかの興味を持っていることが少なくありません。その興味を後押しして、コンバージョンに繋げるのがボタンの役目と言えます。今回ご紹介した 5つのポイントを参考にして、ユーザーの背中を後押しできるボタンを作っていきましょう！

参考サイト：
Call To Action Buttons
Principles for Successful Button Design