ファーストビューとヒーロヘッダー

ウェブサイトにアクセスした時に最初に見える範囲のことを「ファーストビュー」と言いますが、ファーストビューはユーザーにどういった印象を与えるか、何を訴求するか、どのコンテンツへ誘導するかを決定する重要な表示領域です。

この領域を画像や動画などで画面いっぱいに覆い、瞬時に会社や商品のイメージを印象づける手法のことを「ヒーローヘッダー」と呼びます。以前はスペシャルサイトなどで使用するなど限定的な表現手法でしたが、インターネット回線の高速化やレスポンシブデザインとの相性の良さ(後述)によって、現在では業種を問わず多くのウェブサイトで採用されています。

参考:株式会社万
参考:C.S.G | キャブステーショングループ

なぜヒーローヘッダーが普及したかというと、ウェブサイトをパソコン、スマートフォン、タブレットに対応させるレスポンシブデザインの影響が大きいと思います。レスポンシブデザインでは様々な閲覧環境で同一のデザインでなくてはなりませんが、どの環境でも同じデザインで画面全体を覆うことのできるヒーローヘッダーは相性が良かったのです。

良いことづくめのように見えるヒーローヘッダーですが、大きい画像を複数枚配置したり動画を使用する場合には、スマートフォン版では画像であれば容量の小さいもの、動画であれば静止画に変換したものを切り分けて表示するなどの配慮が必要になります。また、記事が主役であるメディアサイトや、複数の商品を見せなければならないECサイトでの使用も控えたほうが良いでしょう。

ランガレウェブのサイト制作