Page Top

Page Top

∞

レイアウトについて

2017.08.25

おはようございます。WEBデザイナーの篠田です。

本日はレイアウトについて記載いたします。

 

①ファーストビュー

ユーザーのディスプレイサイズに収まる範囲が、webページのレイアウト領域です。

現在の一般的なサイズは1920×1080pxで、この範囲に収まるレイアウト領域は幅が1800px程度となります。

さらにアクセスした瞬間、位置画面内に収まる高さの最大は800px程度です。

この幅と高さの最大をファーストビューと呼びます。

ファーストビューにはサイトが一番強く伝えたい内容を入れます。

レイアウトは、この領域を意識しつつ進めます。

最小の画面サイズは今はスマホなどもあるので、320px程度でしょうか。(ガラケーは省いて)

幅が760px以下の場合、2カラムが適切と言われています。

 

ディスプレイサイズはどのサイズも共通してますが、

高さはブラウザの種類やアドオンの有無によって若干の違いが生じます。

ファーストビューで完結してしまう画面デザインにしてしまうと、

スクロールする必要のないページと認識されてしまうので、

下の方の情報が閲覧されないことがあります。

あまり完結させず、下にもコンテンツがあることがわかるデザインにしたほうが、見てもらえる可能性は

あると個人的には思っています。

携帯端末はとくにスクロール動作が楽ですが、長すぎても読み飛ばされる危険もあるので、

短すぎず長すぎない3スクロールくらいがちょうど良いのではないのでしょうか。

 

いかがでしたでしょうか。

WEBサイトを作る際には、ぜひディスプレイのサイズを意識しながら制作いただけると幸いです。

来週は、フォーマット化について記載したいと思います。

よろしくお願いします。

 

Instagram
Twitter
Facebook
LINE
Twitter
Facebook
LINE
LINE
contactform contactform