サイト研究

design

お手本サイトを徹底的に研究しよう！
http://www.1000percent-web.com/gallery/
あと、よく参考にしているのが以下。


・固定サイズで左寄り
IBM
http://www.ibm.com/jp/


・リキッドレイアウト
マイクロソフト
http://www.microsoft.com/japan/
http://www.microsoft.com/japan/msdn/
http://www.microsoft.com/japan/msdn/vstudio/downloads/
The Web Standards Project
http://www.webstandards.org/
http://www.webstandards.org/learn/faq/faq_jp/


・センタリング
サンマイクロシステムズ
http://jp.sun.com/
アドビ
http://www.adobe.com/jp/
Mozilla関連
http://www.mozilla.org/
http://www.mozilla-japan.org/
http://mozillazine.jp/
http://firefox.geckodev.org/
http://www.mozilla.gr.jp/


固定幅でのセンタリングは、意外に問題があります。Firefoxでは高さが低い場合にはスクロールバーを出さず、高さがある場合にはスクロールバーを出すようになっています。IEは高さに関わらずスクロールバーの表示領域を確保しています。Acid2なんかを見るに、スクロールバーを出さないのは標準的な仕様。これの何が問題かというと、センタリングする際に基準となる領域が、高さによるスクロールバーの有無によって異なってしまう、ということです。つまり、同じ横幅で作っているページで高さが異なるページ間を移動した際、センタリングの位置がズレて見えるということです。

上記に挙げたサイトは、(多分スタイルシートのマージンで)、無理矢理高さを出して、常にスクロールバーが出るようにしています。しかし大き目のディスプレイを使用していればスクロールバーが出ないのは当然ですし、ページの下部に大きなマージンがありすぎるのもデザイン的にどうかとも思います。この辺のバランスを参考にするということでもあります。