スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

    ウェブプログラミング講座

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

Homeウェブデザイン基礎講座 > フルスクリーンの背景画像を使用することの利点と欠点

フルスクリーンの背景画像を使用することの利点と欠点

投稿日:2015年06月12日

このチュートリアルでは、フルスクリーンの背景画像を使用することの利点と欠点をご紹介します。

Step1:はじめに

ほとんどデザイン要素の無い単純なHTMLのウェブデザインから、画像をたくさん用いたデザインへ、そしてまた必要最小限のウェブデザインに戻りつつある現在のトレンドという、ウェブデザインの進化を目にするのは常に興味深いものです。
ウェブデザインには2〜3年毎に好まれるトレンドのサイクルが明らかにあります。

オンラインで目にする受賞歴のあるウェブデザインの多くでは、ウェブサイトの背景として、1枚の巨大な画像が使われていて、画面の横幅いっぱいに広がっています。
これは何年も前にもウェブデザイナーが試みていたことですが、コンピュータの処理能力により不可能でした。
ファイルのサイズが単純に大きすぎて、読み込みに時間が掛り過ぎたのです。
しかし現在では高速インターネットの普及により、こういったデザインが実現可能になったのみならず、顧客の視点からも大いに望ましいものとなっています。

オンラインカジノ用ウェブサイトテンプレート
オンラインカジノ用ウェブサイトテンプレート



Step2:それはなぜでしょうか?

それは、ユーザーがサイトを訪問した際に、1枚の画像を背景として使っているサイトは強烈なビジュアル的インパクトを与えるからです。
現在では画像の読み込みを待つ必要もなく、画像が持つ直観的な効果により、大きな画像が使われていない場合と比べて、ユーザーはより長くサイトを眺めることになります。
訪問者を長くサイトに留めることが出来れば、サイトに関心を持たせることが出来る可能性も高まるという利点があります。
つまり、1つの画像を使った背景は多くの人に、ウィンウィンの関係を生み出すのです。

これは単なる我々の根拠のない推測ではありません。
メインのデザインとして1枚の画像を使っている最近のサイトで、有名な賞を受賞した例を挙げると、『ホビット 竜に奪われた王国』や自動車業界のサイトなどがあります。

工業用ウェブサイトテンプレート
工業用ウェブサイトテンプレート





Step3:あなたのサイトの背景にフルスクリーンの画像を使用すべきでしょうか?

それはあなたがターゲットとする視聴者によりますが、一般的に言って、1枚の大きな画像をサイトの背景に使用することにより、訪問者の関心を引くことが出来ます。 そういったサイトは効果的に訪問者の関心の度合いを増やし、最も優柔不断なウェブサーファーの眼をも捕えるでしょう。
これが重要なのです。脳の働きが追い付くのに充分な時間、人間の目を捕らえ、サイト上の宣伝文句を理解させるのです。

個人用ウェブサイトテンプレート
個人用ウェブサイトテンプレート

訪問者の関心を捕えることに成功すれば、サイトのオーナーが望むように、どこかへ導く、販売する、電話をかけさせるといった訪問者のコンバージョンへと拡大させて行くことができます。
ただ、訪問者を30秒以上サイトに集中させることさえ出来れば良いのです。
そのくらいサイトに集中させることが出来れば、結果として、ウェブサイトのコンバージョン率が飛躍的に上がることが期待できます。



Step4:欠点はないのでしょうか?

まず最初に、こういったデザインは、あなたの立場によっても違ってきますが、多かれ少なかれ、創造性を抑圧する可能性があるということが挙げられます。
こういったウェブサイトが賞を取っているのを見た顧客は、例えそれがウェブコーディング史上最悪の選択だったとしても、自身のウェブサイトに似たようなデザインを要求するでしょう。
1枚の大きな画像を使用しているサイトは、創造性の抑圧に加え、画像が生み出す最初のインパクトの効果が薄れてしまうと、ユーザーエクスペリエンスが損なわれてしまうという可能性もあります。

インテリア&家具用ウェブサイトテンプレート
インテリア&家具用ウェブサイトテンプレート

SEO(サーチエンジン最適化)の世界での最近の変化により、サイトの表示速度が良くも悪くもサーチエンジンのランキングに影響します。
つまり、いくつかの画像はかなり大きなサイズに広がって表示されるということを頭に入れながら、画像ファイルのサイズの最適化を限界まで行う必要があります。

従って、インパクトのある見た目を保ちながら、同時に、ユーザーが苛立って髪をかきむしることなく数分以上使用するに耐えうるサイトであるということのバランスを取る必要があります。
そのため、スクロールバーが無いこと、画像が素早く表示されること、全ての画像がサイトのトーンやスタイルと合っていることがとても重要です。
派手な画像や芸術的な画像の使用はそういった意味で全く良い結果を生まないでしょう。



引用:Web Design Library 著者:AliceL 翻訳:幕澤



スポンサードリンク

コメント

ランダム記事5件

2016年5月の人気記事ランキング