WEBデザイナーになるまでのロードマップ無料配布中 >受け取りはこちら

添削前後でどう変わる?成約を生む構成&デザイン解説動画

ポートフォリオの添削

はしこさんへのポートフォリオ添削

▼添削前

▼添削後(3人目の作品)

バナーの添削

本記事では成約させる(クリックさせる)ための構成とデザインのコツを、解説動画を交えてお伝えします。

クリックされるバナーを作るためのコツ
  • 薄い色で野暮ったくならないようにする
  • 「無料」などの訴求は他の色と被らないようにして目立たせる
  • 文字は目に入りやすいように限界まで大きくする
  • 文字が目立ちにくいときは、文字に境界線や虹彩を入れて目立つようにする
  • 目立たせたいコピーには下線を入れて視線誘導をする
  • 背景と文字のメリハリをつける
  • ボタンに三角を入れてコピーに視線を誘導する
  • 文章として続いているものは同じあしらいにまとめて読みやすくする
  • 伝えたい訴求が一瞬で伝わる写真(構成要素も含めて)を選ぶ

実際の解説はこちら