schoo授業感想「WEBデザインの命:ファーストビュー制作」

schoo授業感想「WEBデザインの命:ファーストビュー制作」

オンライン動画学習サービスの「schoo(スクー)」。
授業の受講感想記です。

今回の授業は、
*Webデザイン実践 デザインの命ファーストビュー制作:サイト例
*Webデザイン実践 デザインの命ファーストビュー制作:実演編
https://schoo.jp/class/2190

全8回シリーズの3回目と4回目、田中先生の録画授業です。

sblog20160918a

WEBデザインで一番大事な部分、ファーストビューの制作についてです。

ファーストビューとは?

「ファーストビュー」とは、ブラウザでWEBサイトを開いたときに、一番最初に目に飛び込んでくる領域のことです。
ヘッダーやトップ画像の部分が該当します。

閲覧者が何らかの意図でWEBサイトを開いて、ファーストビューに求めるものが見当たらない場合、即離脱してしまう可能性が高いとのこと。

同種のサイトなんて世の中には幾らでもありますからね。
「ここ駄目だ。次行こ」みたいな感じです。
即Uターンです。

授業では、このファーストビューの必要構成要素や、良いサイトの実例などを解説しています。

良いファーストビュー

良いファーストビューの基準は、

◇そのサイトの概要がパッと見て伝わるか?
◇1秒以内で理解できるか?
◇具体的であるか?

こういう基準で、過去の自分が制作したサイトを振り返ってみると、ちょっと忸怩たるものがあります。

制作する側は、出来るだけサイトを格好良いものしたいわけですが、どうしても主観的になってしまいがちです。
閲覧者目線を忘れがちになりますね。

よく言われるのが、サイト閲覧者がそのサイトをじっくり見るか即離脱するか、決める時間は7秒以内だということです。
第一印象が大事です。

ファーストビューの必要構成要素

ファーストビューの必要構成要素は、

◇サイトのメリット
◇ナビゲーション
◇SNSボタン

一番大きいのは「サイトのメリット」でしょうか。
パッと見て、このサイトを見ることに何のメリットがあるのか、
概要が一瞬で伝わらないと駄目だということですね。

「SNSボタン」の設置は、地味なように見えて意外に効果があるようです。
こういうブログ記事もあります↓

バズるサイトの6割はファーストビューにSNSボタンを設置していた!

求められる技術

良いファーストビューサイト制作に求められる技術は、

◇視覚伝達技術
◇アクセシビリティ・ユーザビリティ
◇サイトの表示速度を上げる

WEBサイトの制作って、突き詰めれば「情報整理」だと思いますが、特にファーストビューではプロの腕の見せ所ってことでしょう。

あと、サイトの表示速度は大きいですね。
特に最近多いトップに背景動画が流れるサイトなどは、読み込みにモタモタしていると、即離脱されてしまいます。

閲覧者目線で検証する

授業では「実践編」ということで、某サイトを例にとって、ファーストビューの重要性について解説されてます。
これはとても分かりやすかったです。

ってか、大手のサイトであっても、こういう致命的なミスを犯しがちなんだなあと思いました。

お客さん目線、閲覧者目線でWEBサイトを見つめ直すのは大事ですね。

 

関連記事

 

WEBサイトをWordPressにて低価格・高品質で作成します

ご希望内容をお伺いした上で、金額・納期をお見積もりいたします。

お見積もり・ご注文はクラウドソーシングの「ランサーズ」にて承っております。
*ランサーズのアカウント(無料登録)が必要となります。

  • 使用するWordPressテーマは、当方にてライセンス権を購入済の「Swell」「Lightning有料版」「Katawara」の3つの中から選択する形となります。
  • お見積もり後、金額・納期が折り合わなければ発注しなくても大丈夫です。