さて、どんどん続けていきます、TOPページデザイン編です。
今回は「サイズ」についてです。
紙に印刷するときは、A4・B5などというサイズが決まっていて、その中にレイアウトをしていけばよく、誰が見てもどうみても同じに見えます。
しかし、パソコンの場合は決められたサイズがなく、ユーザーのパソコンの環境によって、ディスプレイの大きさはまちまちです。
だから、自由でいいじゃないか?と思われるかも知れませんが、ホームページの場合はパソコンの環境が違っても、レイアウトが崩れることなく、なるべく印象が変わらず、誰でもなるべく同じように見えるページの制作方法というものがあります。
小さめのノートパソコン、大きいノートパソコン、14インチのディスプレイ、iMac・・・
など、パソコンを使っている方、さまざまです。
では、どのモニタに合わせて制作するのがよいかと言うと、 自分のパソコン?ではありません。
基準は、 横800 x 縦600ピクセルのモニタにします。
その根拠はというと・・・
アクセス解析の「ディスプレイ解像度」というのを調べることができ、サイトへ訪れた人のモニタ環境が分かるのですが、わたしが管理しているネット販売サイトのアクセス解析を見てみると、1024 x 768で見ている人が約55%です。
そして、 1024 x 768とそれ以上のモニタで見ている人が約95%を占め、 800 x 600以下はほんの5%程度です。
一昔前は 800 x 600が多かったように思いますが、最近は、モニタが大きい方が増えているな、と思います。やはりネット販売を楽しんでいる方は、パソコンが好きな方が多いのでしょうか。
しかし、 800 x 600で見ている人がいることを忘れてはいけません。
他のサイトも実は 800 x 600を基準に制作しているところが多いのです。
他のサイトから訪れることも想定して、 800 x 600に納めるデザインをします。
まず、 横幅800ピクセルピッタリにデザインをするとどうでしょう。
インターネットブラウザを立ち上げると淵やスクロールバーがありますので、せっかくのデザインが入りきらなくなり、横スクロールバーが出てしまいます。
そのため、一番キレイに納まるサイズは
横幅780ピクセル以内 がバランスがよく納められます。
では、縦は、というと、縦は無限に掲載することができます。
しかし、大切なのは 約580ピクセル以内 に伝えたい情報を盛り込むということです。
ココがすごく大切です。
Vol.9 TOPページデザインで
SHOP名・SHOPのキャッチコピー・商品のキャッチコピー・商品写真・イメージ写真・コンテンツメニュー・店長の顔写真・所在地・連絡先 etc・・・
を書いていただきましたが、この中で、優先順位の高い伝えたいもの、キャッチコピーや写真を、780×580ピクセルにデザインし、優先順位は低いけれどもTOPページに掲載したいものを、縦580ピクセル以降に掲載していきます。
4
.780×580ピクセルに必要な情報を掲載しましょう。

しかし、絶対にこのサイズにしなければならないという決まりはありません。
このサイズにすると見やすいですよ、というです。
ちなみに、ピクセルを固定させずに%で制作する方法もあります。
例えば、まぐまぐさんのようなサイトです。
横幅を%で制作すると、 情報がたくさん詰まっている印象を与えることができます。

しかし、このような%のサイトはわたしも制作したことありますが、結構レイアウトが取りづらく難しいです。
次回は、
「優先順位がデザインを決める!」
です!
では、また次号にて・・・。