画像や動画はもちろん、パララックススライダーを設定可能なヘッダーコンテンツ

NOELのヘッダーコンテンツには画像や動画(MP4/Youtube)はもちろん、パララックススライダーを設定できる機能をご用意いたしました。

パララックスとは視差効果を生むWebデザインで、部分ごとに異なるスピードや異なるエフェクトで変化するような視覚効果のことです。その効果を発揮するスライダーをトップページのヘッダーコンテンツに設定できる機能を実装しました。

トップページ

ヘッダーバーやグローバルメニューは背景が透過して表示される仕様になっており、クリーンで清潔なイメージを与えることが可能です。それは同時に、ウィンドウを出来るだけ大きく使って画像や動画を表示できるということでもあるので、視覚に与えるインパクトも絶大です。

さらにNOELではヘッダーバー上部にボタンを設置できる機能も実装しているので、訪れたユーザーがダイレクトにに目的のサービスを予約したり、問い合わせができる工夫がされています。ボタンの背景色や文字色の変更などはワンタッチで可能です。

サイトのヘッダーコンテンツは店舗で言うと、看板にあたる非常に重要な役割を持ちます。特にユーザーが初めて目にする部分「ファーストビュー」の出来は直帰率(全てのセッションのうちそのページの閲覧のみで離脱した割合)に大きく影響を及ぼす要素です。ヘッダーコンテンツが魅力的であるということは、ユーザーに何らかの期待を抱かせ、次のステップを誘導する手助けにもなります。

画像スライダーや、動画(YouTube)だけでなく、パララックススライダーを適用することができるNOELでは、短い時間で何のサイトなのか、サービス内容は何か、どのような雰囲気かといったことを明確にユーザーにアピールできます。※モバイルファーストの観点からスマートフォンでは静止画の代替画像が表示される仕様となっています。

また、単一の画像スライダー(最大で5つ設定可)を適用した場合でも、ズームイン/アウトのアニメーション効果によって静止画でも臨場感あふれるムードを演出することができます。

その他、画像スライダーにはスライダーに乗せるキャッチフレーズや説明文、フォントサイズやカラーの調整機能、オーバーレイ(背景画像に重ねる色)などスライダーを美しく見せる機能が標準で備わっています。

関連記事