ファーストビュー
ページが表示された際にスクロールせずに見える範囲の情報すべてをいいます。
概要
ファーストビューは、Webページを開いたときに全くスクロールせずに見える範囲の情報すべてをいいます。
ファーストビューに表示された情報によって、多くのユーザーが直帰するかサイトを回遊するかを判断します。
よって、このファーストビューの情報の使い方によっては直帰率の改善や改悪につながる要素が強いといっても良いでしょう。
デザイナーも、特にファーストビューにはこだわりや視認性などに気を遣わなければなりません。
トップページが値段が高く、デザインにおいても最も時間がかかる要因である理由です。
業界によってもトップページのファーストビューに様々な差や変化に富んでいるので、トップページのデザイン集を見るだけでもかなり面白いのと発見も多いのでお勧めです。
類似のものとして、広告から流入するタイプのランディングページも実に様々な「ファーストビュー」がそろっています。
この用語のメモ
ファーストビューを閲覧したことにより数秒で閲覧するかどうかが判断される世界です。
それゆえに、デザインも大事ですがキャッチ・コピーがサイトの良し悪しを最も左右します。
最近ではバックに動画を用いて真ん中に文章を大きく表示する手法であったり、文字が少しずつ表示されて読ませるように工夫をしているサイトも見受けられます。
特に、ここ最近の傾向としては極力不要な情報を省き、なるべく表示する情報量や色数を制限し視認性とトンマナを維持したサイトも多いです。
個人的には「数字に表れないSEO施策」という位置付けで考えています。
この用語の使いどころ
サイトの立ち上げ時やサイトのアクセス改善に取り組む際、またはランディングページ制作時においては頻繁に改善を要求される内容の一つです。
前述したように、キャッチ・コピーを変更してほしいとか、初めに見えるボタンの色を変えてほしいとか等のちょっとした修正から動画や画像・又はレイアウトなどを全替えするなど、トレンドによって大きく変えることもあります。
せっかく中身が優れたページを作っても、トップページや閲覧開始ページからすぐ直帰してしまっては単なる宝の持ち腐れになってしまいます。
作ったものがしっかり脚光を浴びるためにもファーストビュー、もとい画面に表示される情報の見え方にも気を配ることが肝要です。
また、こういった施策はユーザビリティの向上にもつながります。
デザイナーも含め「SEOが全員でチームで取り組むべき理由」と考える一つのシーンだと思います。
関連用語
- ヒートマップツール
- アクセス解析
- ABテスト
Web担当・運営・解析・SEO問題集の例題問題
ファーストビューに関連するジャンルの練習問題を掲載しています。Web担当・運営・解析・SEO問題集一覧から各ジャンルの問題にチャレンジできます。
クリックすると問題の答えと解説が見れます。
- iframeタグ
- strongタグ
- textareaタグ
- fontタグ
この答えの解説
fontタグは、HTML5では廃止されました。
CSSのfont属性でサイズ調整やカラー調整を行い、要素のフォントに装飾をつけましょう。
- divタグは段落タグと言い、タグの中に文章や画像などのコンテンツが入る
- h1タグはタイトル名が入るタグである
- pタグは段落タグと言い、タグの中に文章や画像などのコンテンツが入る
- ulとliはリストタグで、順序があるリストである
この答えの解説
pタグが段落タグと呼ばれます。
divタグは汎用タグ、h1は見出しタグ、ul・liタグのulはunordered listの略で、順序のないリストを示しています。
- imgタグ
- marqueeタグ
- spanタグ
- aタグ
- divタグ
この答えの解説
pタグはインラインタイプのタグなので、ブロックレベルタイプのdivタグやulタグは構文上入れ込むことができません。
- ユーザーが体験したサイトの情報を公開すること
- ユーザーのために技術者やデザイナーが経験を得ること
- ユーザーがWebサイトなどのサービスや情報を利用することで得られる経験のこと
- 閲覧されたユーザー数に応じて技術者が得られる経験を数値化したもの
この答えの解説
ユーザーエクスペリエンスは、製品やサービスを使用することで得られる経験のことを言います。
Web分野においては、如何にしてWeb内におけるサービスやコンテンツに満足できるサイト構築を達成できるかが大切で、マーケティング担当やディレクター担当、特にサイト構成を作るメンバーにおいて最も要求される要素になります。
- ブランドサイト
- コンテンツサイト
- ポータルサイト
- コーポレートサイト
- 個人サイト
この答えの解説
複数媒体が提供しているニュース・地域情報などの「情報」の玄関口として、Webサイト(ブラウザ)を立ち上げたときに表示されるサイトのことをいいます。
GoogleやYahoo!などがこのポータルサイトに当たります。
- ベンチマーク→デザイン→情報設計→構成・導線設計→コーディング→校正・公開
- 構成・導線設計→デザイン→情報設計→ベンチマーク→コーディング→校正・公開
- 情報設計→ベンチマーク→構成・導線設計→デザイン→コーディング→校正・公開
- ベンチマーク→情報設計→構成・導線設計→デザイン→コーディング→校正・公開
この答えの解説
サイト制作の前にまずベンチマークを行い、競合他社の状況を知るところからスタートします。
その後、自社の持っている情報をどう見せたいかを決め、そのためのサイト構成やサイトの目標達成のための道筋(導線)を決めていきます。
ここまでが基本的にディレクターの腕の見せ所で、その内容に沿ったデザインを依頼し、ブラウザ表示時の再現度の高い(質の高い)コーディングを行い、品質チェックを行った後公開となります。
例外はありますが、基本的にはこの流れで制作工程が進みます。
- 自サイトに訪れた最初のページ
- ブックマークをされているページ
- キャンペーンを行っているページ
- 着地(成果を上げた)ページ
この答えの解説
ランディングページは、ユーザーがサイトに訪れた最初のページを指します。
広告代理店等では特にLP(エルピー)制作などと略して使われることが多いです。
インターネット広告などから遷移したキャンペーン等の一枚物ページは結果、「訪問者が最初に接触するページになるため」に便宜上ランディングページと言われています。
しかし、定義としてはあくまで「ユーザーがサイトに訪れた最初のページ」であるため、レポート作成時には直帰率と離脱率の違いと共に扱いに気を付けるべき内容だと考えられます。
- セグメントが反映されたデータはエクスポートもできる
- セグメントは最大4つまで同時表示できる
- セグメントは500個まで設定できる
- セグメントはアクセス時間や特定の参照元など細かい設定ができる
- ユーザー属性毎に詳細に情報を抽出できる
この答えの解説
セグメント設定は、一ユーザー、一つのビューにつき100個までと決められています。
それ以上のセグメントは作成できないため、不要なセグメントを整理する必要があります。
- ある期間のうち1回の訪問分で見られたWebページの数
- ある期間のうち1回の訪問分で遷移したWebページの数
- ある期間で見られたWebページの数
- ある期間で訪れた人数
この答えの解説
ページビューとは、ユーザーがWebページを開いた数(=見られた数)を示します。
関連タグ【Web制作】に関するよくある質問
Web制作に関するよくある質問を抜粋しています。Web制作に関するよくある質問はこちらから。
Webサイトの制作は、現在では分業化が当たり前になってきているため全てを習得しなければいけない訳ではありません。
そのため、デザインからやらないとダメ、コーディングからやらないとダメ、というのはなく、覚える順番は任意で決めてもらって問題ありません。
ことWebに関して言えば、覚えるというよりかは「盗んでいく」というスタイルが、覚える作業としては適切ではないかと思います。
今でこそ、SEOを中心にコーディングを組むことが大半になってきているため言える話になりますが、Webサイトの一ページ一ページは「本」を作る意識を持って取り組んでいます。
ちゃんとタグにも「タイトル(表題)」や「見出し」、「段落」など、「作文」や「国語」にまつわる言葉が多く出てきますね。
Google側も同じように「記載されている内容」が「どの場面」で「どれぐらいの分量」の情報が「検索された内容に対し正確性があるか」が重要です。
コーダーやライターはその辺りを意識することが大切です。
デザイナーは、Googleよりも人間側が認知する視覚情報がもっともウエイトを占めるため、分かりやすさとトレンドをいかにストレスなくユーザーに供与できるかが大事で、ユーザーエクスペリエンスの精度に関わります。
Webサイトは、成長を前提に作ることが大事です。そういう意味では、いつまでもページが増え続ける「1巻だけの本」を作り続ける意識が必要ではないかと考えます。
全体的な工程としては、「打ち合わせ」「納期・見積」「サイトマップ」「構成案(ワイヤフレーム)作成」「デザインカンプ」「デザイン制作」「コーディング」「校正・テスト・品質管理」「公開」「運営・運用」をトータルとした工程になります。
これだけでもかなりの工程数になるかと思います。
各工程には普通、「納期」を設定しているため、各工程が遅れてくると、他の工程のスケジュールが圧迫されてしまい、タイトなスケジュールをこなさなくてはならなくなります。
ディレクターは主に前半の「打ち合わせ」から「構成案(ワイヤフレーム)作成」までを担い、あとは品質チェックや進行管理を中心に行います。
デザイナーは「デザインカンプ」及び「デザイン制作」、コーダーは「コーディング」と「校正・テスト」をそれぞれ担う形となり、Web制作の分業化が進んだ今、ざっくりですがこういった形で業務が行われています。
関連タグ【マーケティング】に関するよくある質問
マーケティングに関するよくある質問を抜粋しています。マーケティング・Web運営に関するよくある質問はこちらから。
運営は一日でうまく行くわけがありません。スタートがいくら良くても放置してしまえば廃れていきます。
サイトを大きくすることは、よりお客さん(クライアントやエンドユーザー)の実態に近づくことになるため、繰り返しユーザーの分析を続け、満足の行くサイトにするには最低1年~1年半の長期戦になることを想定しましょう。
この期間をトータルで見て「プロジェクト」として取り組むことが大事です。
一言で言えば、「ブラックハットSEO」全般に言えることです。
検索結果を欺くような対策は、かなり早い段階でGoogle検索エンジンからの「手動による対策」が行われてしまいます。
具体的には不要な外部リンクの設置やコンテンツの書き写しなどが上げられます。
この対策が横行していたときは、本来検索結果に上がってはいけないものが検索結果に表示されてしまうため、Google検索エンジンのリソースを大幅に消費してしまう事態を招いていました。
最近では不要なサイトはインデックス登録自体がされないように対策されているため、なかなかインデックスが増えてこない場合はサイト全体の情報品質を疑ってみたほうが良いかもしれません。
大前提として「Webを大して知らない人でも分かりやすい」ものである必要があります。
数字を伝えるのももちろん大事ですが、何より「専門用語」をいかに使わずに説明や例えばなしができるかにかかります。
その場にいるメンバーの理解・共有が進めば改善にむけたスピードは早まり、決済決断は早まり、サイトの改善は早く進められます。
ひいてはビジネスチャンスのタイミングを増やすことにも繋がります。
自社企業サイトの運営だけを主体とした業務であるならば、「Googleアナリティクス主担当」「更新作業主担当」「他部署連携主担当」の3人体制であれば、よほどの業務量でない限りは問題ありません。
但し、ECサイトになると「商品企画」「SEO」「広告運用」「梱包発送」などなどかなり裾野が広がり数十名規模の人材が必要になります。
競合他社のベンチマークがまず挙げられると考えています。
Webサイトのデザインを作成するときもテーマ別に参考になるサイトを見てデザインを起こすことが多いです。
もちろんマーケティングにおいてもできるだけ同じか、似た商材を扱う競合他社をしっかり知る事が自社サービスの醸成につながる近道です。
関連タグ【アクセス解析】に関するよくある質問
アクセス解析に関するよくある質問を抜粋しています。アクセス解析に関するよくある質問はこちらから。
一例ですが、特定の地域や年齢層、それから男女どちらかまたは両方に大きく支持されているのであれば、支持された層のトレンドを狙ったコンテンツや広告ワード、閲覧されてる時間帯に広告費用をかけるなどといった費用投資判断の指標に使えます。
Googleアナリティクスを閲覧するには、まずGoogleアカウントが必要です。
何らかの連絡の取れるメールアドレスをお持ちであれば、Googleのログイン画面より新規アカウント作成を行ってください。
出力が必要な指標が多いサイト(ランキングやある特定の状況下でのアクセス等)であれば、基本的なサマリーを表示するために使用することはあります。
とくに、広告を扱うようなサイトであれば多視点から情報を集めなければならないため、短時間での状況把握をするべく使用することがあります。
一般的な企業サイトや個人サイトであれば、ユーザーサマリーの概要をしっかりつかんでおけば十分だと思います。
ユーザーエクスプローラは個人個人が持っているtoken情報をもとにユーザーを追えるものになります。
その性質から「サイトの遷移」「再訪頻度」「コンバージョン後の行動」等も追えます。
コンバージョンまでどうしたか、だけでなくコンバージョン後に何をしているかを見ていくことで「どんな情報を探しているか」「その情報をどうしたら見つけやすくなるか」といった対策をたてられます。
すなわち、再訪率の向上やシェア獲得率の向上にむけた改善に取り組むことができます。
Googleアナリティクスを使いこなせるようになりたいのか、アクセス解析の用語などの知識をつけたいのかによって、勉強するポイントは大きく変わります。
Googleアナリティクスを使っていく上ではまずは「ユーザー」「概要」に記載されている基本レポートの使い方を知るところから始まります。もっとも見る頻度が高いからです。
徐々に、「集客」の「トラフィック」や「行動」の「サイトコンテンツ」を知り、理解が進みページ前後の遷移状況などを見れるようになれば、「セグメント設定」を身に着けていく段階になります。
知識としては、離脱率と直帰率の違いをきっちり理解できればページの性質に合わせた説明をできるようになるのではと考えています。
アクセス解析に関する用語を習得する場合は、市販に売っている本や、用語解説をしているサイト等を参考にしてみましょう。
その際、単純に用語を知るだけでなく、使い道などにも触れている情報を参考にすると良いです。
すでにGoogleアナリティクスのアカウントがあることが前提ですが、Webサイトを運営している担当者もしくは担当部署にお手持ちのGoogleのメールアドレスをお知らせください。
担当者もしくは担当部署にてアカウント設定を行い、設定完了すればご自身のGoogleアナリティクスのアカウントにWebサイトが追加され、様々な情報が閲覧できます。
権限の状態によっては細かい設定もできるようになります。
索引から探す
- 用語集【A-Z一覧】
Web制作・運営・解析・SEO用語集のAからZまでで出てくる用語一覧をまとめています。
- 用語集【あ行一覧】
Web制作・運営・解析・SEO用語集の「あ行」で出てくる用語一覧をまとめています。
- 用語集【か行一覧】
Web制作・運営・解析・SEO用語集の「か行」で出てくる用語一覧をまとめています。
- 用語集【さ行一覧】
Web制作・運営・解析・SEO用語集の「さ行」で出てくる用語一覧をまとめています。
- 用語集【た行一覧】
Web制作・運営・解析・SEO用語集の「た行」で出てくる用語一覧をまとめています。
- 用語集【な行一覧】
Web制作・運営・解析・SEO用語集の「な行」で出てくる用語一覧をまとめています。
- 用語集【は行一覧】
Web制作・運営・解析・SEO用語集の「は行」で出てくる用語一覧をまとめています。
- 用語集【ま行一覧】
Web制作・運営・解析・SEO用語集の「ま行」で出てくる用語一覧をまとめています。
- 用語集【や行一覧】
Web制作・運営・解析・SEO用語集の「や行」で出てくる用語一覧をまとめています。
- 用語集【ら行一覧】
Web制作・運営・解析・SEO用語集の「ら行」で出てくる用語一覧をまとめています。
- 用語集【わ行一覧】
Web制作・運営・解析・SEO用語集の「わ行」で出てくる用語一覧をまとめています。
タグから探す
- タグ【Web制作】
Web制作・運営・解析・SEO用語集に登録されているタグ【Web制作】一覧をまとめています。
- タグ【Webシステム】
Web制作・運営・解析・SEO用語集に登録されているタグ【Webシステム】一覧をまとめています。
- タグ【SEO】
Web制作・運営・解析・SEO用語集に登録されているタグ【SEO】一覧をまとめています。
- タグ【SEM】
Web制作・運営・解析・SEO用語集に登録されているタグ【SEM】一覧をまとめています。
- タグ【アクセス解析】
Web制作・運営・解析・SEO用語集に登録されているタグ【アクセス解析】一覧をまとめています。
- タグ【広告】
Web制作・運営・解析・SEO用語集に登録されているタグ【広告】一覧をまとめています。
- タグ【マーケティング】
Web制作・運営・解析・SEO用語集に登録されているタグ【マーケティング】一覧をまとめています。
よくアクセスされている用語
- HTML
Webページを構成するために必要な言語のことです。 - PPC
クリックすることで課金される広告のことです。 - コーディング
HTMLやPHPなどのソースコードの記述を行うこと、またはその人員のことをいいます。 - 直帰率
初めてサイトに訪れたページでサイト内の他のページへ行かずにサイトから離脱した割合のことをいいます。 - ページビュー
Webサイトのページを表示された数のことをいいます。 - レスポンシブデザイン
一つのページ(URL)で使用OSや画面、ブラウザを問わず閲覧をサポートしているデザインをいいます。
その他カテゴリー
- GAレポート作成ツール
面倒なアクセス解析レポート作りはもうやめよう!
- Web担当者問題集
GoogleアナリティクスやSEOに関する問題集を作っています。
- Web運営用語集
Webや解析などでよく使う単語辞典ページを用意いたしました!
- よくあるご質問
よくいただくお問い合わせ内容の一覧になります。
- お問合せ・情報
当Webサイトについてのお問合せや様々な情報をこちらにまとめております。
- 新着情報・更新情報
当サイトの新着情報・更新情報はこちらから。