【13上級編】ビジュアル部分を、より効果的に見せる方法

【Level 13 上級編】

ビジュアル部分を、より効果的に見せる方法
突然、意味不明の画像が出てきて驚いた方もいますね（笑）
手前味噌で恐縮ですが、上の２枚の画像は私が運営しているWebデザインテンプレート配布サイトのトップページで使われているビジュアル部分(画像)です。
　↓このサイトです。　当サイトも、このテンプレートで作られています。

この画像を例に、私がどのように考えて作っているかを説明させていただきます。
画像の作成方法ではなく考え方です。　作り方はうまく説明できんのですわ(笑)

まず全体
キービジュアル→タグライン→メニューの３つを一体化しました。

視線の流れ（導線）
キービジュアル	→　　タグライン（キャッチコピー）　　→	メニュー
.	.	.

一体化することにより、メニューへの誘導がスムーズになるという効果を狙ったつもりなのですが自分では、よくわかりません（笑）　それじゃダメじゃんよ

main

タグライン01		タグライン02

↑ちょっとデカすぎるんじゃないってくらいのキャッチコピーと、その先が見てみたくなるような心理的ギャップまで考えた文章にしましょうね。		↑細い書体を選ぶだけで、洗練されたイメージになります。但し、注目度は低くなるのでキービジュアルに凝りましょう。

キービジュアル	メニューボタン01	メニューボタン02

↑サイトのイメージに合った画像を選びましょう。　ちょっとやりすぎかなと思うくらい強烈で印象的なものがいいでしょう。　このパッケージの写真は誤解されやすいですね（笑）	↑クリックしたくなるかどうかはキャッチコピーにかかっていますが、それと同時にリンクボタンであるとわかるような形状にすることも重要です。別窓で開くリンクは、色を変えて変化をつけました。	↑リンクメニューをビジュアルに溶け込ませた例　文字の可読性が悪くなるので注意しましょう。　左のものと比べると、リンクであることがわかりづらいのでアイコンをつけるなどして工夫しましょう。