超入門：Webデザインと解像度のハナシ

適切なデザイン

　HTMLやCSSのようなウェブ標準技術をうまく利用すれば、解像度に関係なく利用できるサイトを構築することが可能になる。またJavaScriptを利用すれば、訪問者の解像度を調べて、その値に応じてサイトの表示を調整することも可能になる。具体的には、JavaScriptのscreenオブジェクト（JavaScriptのランタイムエンジンによって自動的に作成される）を用いると、ディスプレイ画面のサイズや表示可能色数に関する情報が取得できる。screenオブジェクトには以下のようなプロパティが存在する。

• availHeight -- 画面の高さから、OSのインタフェースとして（ほぼ）常に表示されるコンポーネントの高さを除いた値をピクセルで返す。
• availWidth -- 画面の幅から、OSのインタフェースとして（ほぼ）常に表示されるコンポーネントの幅を除いた値をピクセルで返す。
• colorDepth -- カラーパレットが使われている場合は、そのビット深度を返す。使用されていない場合は、screen.pixelDepthプロパティの値が返される。
• height -- ディスプレイ画面の高さを返す。
• pixelDepth -- ディスプレイ画面の画面解像度（ビット／ピクセル）を返す。
• width -- ディスプレイ画面の幅を返す。

　以下のスクリプトでは、screenオブジェクトの値によって読み込むページを決めている。

<SCRIPT language="JavaScript">
<!--
if ((screen.width >= 1024) && (screen.height >= 768)) {
window.location="high_resolution_version.html";
} else {
window.location="low_resolution_version.html";
}
//-->
</SCRIPT>

選択を行おう

　多くのウェブ開発者やウェブデザイナは、800x600の画面解像度を用いることに疑問を感じている。彼らはより高い解像度に移行したいと思っているのだ。しかし、それは必ずしも認められるものではない。適切な解像度は対象としている利用者層によって異なるのである。ただし、一般的なウェブ標準に従って、解像度にかかわらず適切に表示されるようにサイトを設計すれば、この問題は回避できるかもしれない。