スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

    ウェブプログラミング講座

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

Homeウェブデザイン基礎講座 > スクリーン解像度の問題

スクリーン解像度の問題

投稿日:2006年6月20日   レベル:−    ソフトウェア:−


ウェブを見渡したとき、いつもこの問題があることに気付かされます。とても素敵なデザインなのですが、ディスプレイからはみ出した、ブラウザのスクロールバーを動かさないと見えない部分があるのです!その理由としては、私のディスプレイが古いタイプで、800×600ピクセルの解像度になっているからです。同様に、古いタイプのディスプレイやビデオカードを使用している人はたくさんいます、全ての人にウェブを見やすくしたくありませんか?

なぜ、ウェブマスター達は、サイトが見にくいので離れていってしまうユーザー達のことを考えないで、サイトを大きな解像度(1024×768、1280×1024など)でデザインしてしまうのでしょうか?それにはいくつかの原因が考えられます、何も考えずにしてしまう、気にしていない、普通は高解像度のディスプレイを使っていると考えている、といったように。

100_101_025_1.jpg


もちろん、全てのコンピューターに適したウェブサイトの構築を考えていない人もいるでしょう。私が始めてホームページを作成したときのことを思い出してみると、このような問題は自分自身がどのようなコンピューターをつかっているかによって発生していると思います。新しいコンピューターを使っていれば、高い解像度に設定してしまうでしょう、これはウェブマスターを責めるのには難しい状況でもあります。

このようなことを知っていながら、小さなグラフィックやテーブルを使うよりましだ、といって多くの訪問者を失っている人もいます。600-620ピクセル以上の幅を持ったグラフィックに関しては、解像度の低いディスプレイを使用しているユーザーに対して、ほぼ確実にスクロールバーの使用を強制してしまいます。ユーザーが文章を読んでいるときなどは、5秒ごとにスクロールバーを動かさなければならないなど、さらに迷惑この上ないことになります。サイトナビがいつも半分画面からはみ出していては、使いにくいでしょう?

サイトが高解像度のスクリーンを使用している人をターゲットにしているなら、サイトをそのような解像度でデザインするかもしれません。通常、スクロール無しでサイトの重要な部分を閲覧可能にするなら、最低640×480ピクセルは必要ですが、サイトは閲覧者のスクリーンに最適化されます。閲覧者が各々のコンピューターでサイトを最適化させて、閲覧するといったことは、たいした問題ではありません。

問題は、どうしたら、横方向のスクロール操作無しにサイトを作成できるか?ということです。1つのやり方としては、600ピクセル以上の幅のグラフィックを使用しない、<hr>タグやテーブルに関しても同じことです。また、改行禁止の<NOBR>タグを使用しないことも挙げられます。

他の意見としては、ページのコンテンツを囲うテーブルを使用することも考えられます。
600ピクセル以下の幅のテーブルを使うことによって、ほとんどの人に正確にページを見てもらえることになると思います。テーブルは中央配置になりますが、DHTMLやStyle Sheetsを使えば、右より、左よりといった位置決めをすることができます。

ここで問題としては、閲覧者がウィンドウサイズに合わせてリサイズすることです。どのようなサイズで、サイトが閲覧されるかはわかりませんが、パーセント指定で幅を決めておけば、ブラウザのウィンドウサイズに合わせることができます。この場合、複雑なデザインにおいては非常につらい作業になってしまいますが。

このページは中央に配置した幅550ピクセルのテーブルによってデザインされています。私は、<NOBR>タグやJavascriptの解説のためのページを除いて横方向のスクロールバーを使うようなページはデザインしていません。この記事に関しては、Style Sheetsを使っていますが、サポートされていないときのために、ブラウザのディフォルトにも対応しています。ほとんどの場合において、550ピクセルのテーブルを使い、イメージの幅はそれ以下に設定しています。1つだけ覚えておいて欲しいことは、全ての人にスクロールバー無しにページを閲覧できるようにするには、600ピクセル以下のサイズでデザインすることです。古いモニタやビデオカードを使っている人達は、そのような配慮に感謝するでしょうし、今後、その恩恵があなたに帰ってくると思いますよ。


引用:Web Design Library著者:John Pollock翻訳:atuk



スポンサードリンク

コメント

ランダム記事5件

2012年4月の人気記事ランキング