![Web-Knight[ウェブナイト]](https://web-knight.net/wp-content/uploads/2019/05/rogo_new.png)
売れるメイン画像デザインはここをおさえる！
ホームぺージの「顔」となるメイン画像（ファーストビュー）は、おそらくサイトのオーナー様にとっても一番といっていいほど気にするところではないでしょうか？
また制作側にとっても実績として一番力を入れたいパーツです。おそらくここ数年はメイン画像についての見せ方のトレンドは変わるとしても、その役割は変わらないと予想できます。
しかしこれほど重要なパーツでありつつも、残念ながらうまく機能せず、直帰率を助長してしまっているケースが多々見られます。そこで、今回はより再現性のある内容でメイン画像のポイントをご紹介していきます。
【関連記事】成功する直帰率・離脱率改善の秘訣！反響のあるメイン画像の３つ構成
さて、反響（コンバージョン）のあるメイン画像の構成は、ずばり「キャッチコピー、写真、申し込み＆資料請求ボタン」という３要素からなります。
サイトオーナー様のサービスにもよりますが、魅力的なコピーと写真があって、その近くに何らかのボタンがあれば、当然ユーザーの行動障壁はさがります。
スマホでも同様で、上記の３要素がそろっていることで、ユーザーのアクションを高い確率で誘導します。
画像には商品写真を優先的に入れる
これはバナーを作成するコツとしても言えることですが、モデルさんなどの人物写真よりも「商品の写真」の方がボタンを押してくれます。
ただし、無形のサービスを提供しているwebサイトはどうしたら良いのでしょうか。
その場合は「サービスを提供している最中の写真」だったり、サービスを「受ける前と受けた後の比較写真」をわかりやすく載せることがユーザーを引き付けます。
私はよく無形サービスを提供するクライアントのメイン画像を作成することが多いのですが、サービスを受ける前と後の比較写真がクリックされやすいと感じています。
ファーストビューにCVボタンを配置する
繰り返しになりますが、メイン画像のエリア内に何らかしらのコンバージョンにつながるボタンを置くことをオススメします。
これはとくに他のページに「問い合わせフォーム」がある場合に有効です。
また、フォームが同ページ内にあるケースも増えてきているので、同ページ内にある方が反響は良い傾向にあります。
ボタンの色は何色がいいのか
ここでよくテーマとなるのがボタンの色です。一体何色がいいのでしょうか？
今年（2019年）から現在（2019年7月時点）でのランディングページのボタン色の傾向を調べたところ、下記のような結果となりました。
| グリーン | 21 |
| オレンジ | 4 |
| レッド | 2 |
| ピンク | 2 |
| グレー | 1 |
| ゴールド | 1 |
6割強がのサイトがグリーンとなっています。
一番目に留まる色は「レッド」なのですが、なぜグリーンが多いのでしょう。
それは、レッドは「禁止」や信号の「止まれ」という社会的認識が働いているためと推測されています。
Firefoxを開発しているMozilla者の調査でも緑色のボタンが最もクリック率が高かったという話があります。
というわけで、ますますグリーンのボタンの傾向が主流となってきています。
しかしながら、一辺倒にグリーンが「最善」というわけではありません。
全体のデザインから見てそのボタンが「目に留まりやすいか」が一番重要です。
ボタンの基本には大きくわかりやすく
上品なデザインのページの場合、ありがちなことですが、ボタンが控えめに小さい場合があります。
デザインを強調したいという思いからボタンを小さくしてしまうと、ユーザーはそのボタンを認識できない可能性が出てきてしまいます。
また、ユーザーの潜在意識として小さ目なボタンは「売る自信がない」と捉えられてしまうこともあり、極力大きめのボタンを用意してあげることが大切です。
かと言って、あまりボタンに動きをつけるなど過度な目立ち方をさせると、ユーザーを罠にかける「詐欺商材」という認識を持たれやすいため要注意。
あくまで私や周りの意見ですが、あくまで「胡散臭くないボタン」を心掛けていきましょう。
