Webドクターコラム
> > ファーストビューは何px? 解像度のシェア
Webドクターコラム
UX・UIお役立ち・知識

ファーストビューは何px? 解像度のシェア

20141119_nakagawa_main

ホームページのURLを開いてまず見える範囲が「ファーストビュー」。
ページの印象を決めると同時に、どんな機能がどこにあるのか、どんな話題がトピックスとしてあがっているのか、を閲覧者(ユーザー)が意識する部分です。
そのため、このファーストビューに何を収めなければいけないのかは、戦略として考える必要があります。

そこで「ファーストビューはどれくらいのサイズなのか」が設計上、重要になります。

ファーストビューのサイズを考えるには、解像度のシェアを知ることから

残念ながらホームページを見る環境はこちらから指定することができません。
インターネット上のデータを、ユーザーは自分のパソコンやモニター(ディスプレイ)、タブレット端末で画像や文字に置き換えて閲覧します。
印刷物のように、どんな人にも同じサイズ・同じ見え方をさせることはできないのです。

そのため「大多数の人にとってちゃんと見える」ことを前提にホームページの仕様は設計されます。

ファーストビューの問題に戻りますと、どんなモニターのサイズが一番市場を占めているのかを把握することでファーストビューのサイズを決めるのです。

ただタイトルにあるように「どれだけの量を画面に映し出すか」は厳密には、モニターのサイズではなく「解像度」の設定によるものなので、ここでは「解像度」といたします。

どのくらいの解像度で見ている人が多いのかを知ることで、ファーストビューのサイズを予測できるのです。

2014年10月 解像度のシェア

2013年10月~2014年10月の解像度サイズのシェアをグラフ化しました。

20141119_nakagawa_01

市場の9割が1200px以上の横幅になったことで、サイトの横幅も広げることができます。
またファーストビューのサイズに重要な意味を持つ縦幅ですが、
ワイド型の画面が多いため、横幅ほど分布は広くありません。

また最近増えてきたタブレット端末についての統計も出すことができました。

20141119_nakagawa_02

圧倒的シェアを誇っているサイズは768×1024pxはiPadの設定サイズです。
タブレット端末をメインにホームページを作ることはありませんが、タブレット端末・スマートフォン・パソコンの3機種で見たときに、各々最適なレイアウトで見えるようなホームページ(レスポンシブWebデザイン)にしたい場合は参考になります。

こちらの統計情報は下記のサイトからすぐ確認することができます。

StatCounter GlobalStats

ブラウザシェアなども確認できますよ。

ぜひご参考ください。