ファーストビューの重要性 version 1
:追加された部分
:削除された部分
(差分が大きい場合、文字単位では表示しません)
ファーストビューの重要性
## ファーストビューとは
ファーストビューとは、ユーザーがWebページにアクセスした時に最初に表示される部分、**スクロールせずに画面に表示される部分**。英語だと「Above the fold」と言って新聞の折り畳み線(fold)より上が最初に目に入る範囲という意味。
## ファーストビューの重要性
第一印象は3秒で決まるとよく言われますが、ユーザーはWebページにアクセスして3秒(一瞬)で、
* **読み進めるメリットはあるか**
* **どんな情報を得られそうか**
を判断しています。
例えとして、企業情報ページを載せている2社のファーストビューを比較してみます。
![スクリーンショット 2020-03-04 21.44.14](https://mimemo.s3-ap-northeast-1.amazonaws.com/attachment/821dd7f5-5137-4e46-bcd1-bf8c571cc1f8.png)
![スクリーンショット 2020-03-04 21.46.49](https://mimemo.s3-ap-northeast-1.amazonaws.com/attachment/330e2e08-fd22-48a9-922f-152f6222e54c.png)
両者の違いとして、
1. ファーストビューの情報量。
2. ページのタブ項目が見えるか。
3. メッセージ機能のリンクの位置。
など他にも沢山違いがあるのですが、ここで一番重要なのは**ファーストビューから得られる情報量が多いかどうか**だと思います。
## デザインのポイント
* ファーストビューで**伝えたい要素を明確化**する
* **ユーザーが求めるもの**、**興味をそそる内容**ファーストビューに入れる
* 目立つラベル・バッチを用いてページに**差別化**をもたせる。
* **クリックしたいと思わせる導線**をしっかり設ける。
## 結論・まとめ
ファーストビューでユーザーに見てもらいたいコンテンツをしっかり盛り込み、ユーザ体験を充実させることが重要だと思います。私はサイトを訪れるのは観光と似ていると思います。「ページを移動する」ことは観光地を回るのと似ていて、移動がスムーズでかつ沢山の新しい出会いや発見があればその「旅行」は楽しいものになりますよね。サイトを作る側はユーザに**楽しい体験**がをしてもらえるよう観光案内士として、事前ルートの確認(= ユーザの行動パターンを把握)し、重要スポットの行き先をしっかり示す(他ページの導線を見せる)ことが大事になるでしょう。
共感していただけたら共有していただきたいです。
よろしくお願いします。
ファーストビューとは
ファーストビューとは、ユーザーがWebページにアクセスした時に最初に表示される部分、スクロールせずに画面に表示される部分。英語だと「Above the fold」と言って新聞の折り畳み線(fold)より上が最初に目に入る範囲という意味。
ファーストビューの重要性
第一印象は3秒で決まるとよく言われますが、ユーザーはWebページにアクセスして3秒(一瞬)で、
- 読み進めるメリットはあるか
- どんな情報を得られそうか
を判断しています。
例えとして、企業情報ページを載せている2社のファーストビューを比較してみます。
両者の違いとして、
- ファーストビューの情報量。
- ページのタブ項目が見えるか。
- メッセージ機能のリンクの位置。
など他にも沢山違いがあるのですが、ここで一番重要なのはファーストビューから得られる情報量が多いかどうかだと思います。
デザインのポイント
- ファーストビューで伝えたい要素を明確化する
- ユーザーが求めるもの、興味をそそる内容ファーストビューに入れる
- 目立つラベル・バッチを用いてページに差別化をもたせる。
- クリックしたいと思わせる導線をしっかり設ける。
結論・まとめ
ファーストビューでユーザーに見てもらいたいコンテンツをしっかり盛り込み、ユーザ体験を充実させることが重要だと思います。私はサイトを訪れるのは観光と似ていると思います。「ページを移動する」ことは観光地を回るのと似ていて、移動がスムーズでかつ沢山の新しい出会いや発見があればその「旅行」は楽しいものになりますよね。サイトを作る側はユーザに楽しい体験がをしてもらえるよう観光案内士として、事前ルートの確認(= ユーザの行動パターンを把握)し、重要スポットの行き先をしっかり示す(他ページの導線を見せる)ことが大事になるでしょう。
共感していただけたら共有していただきたいです。
よろしくお願いします。