• ベストアンサー

ディスプレイの解像度について。

ホームページを作成したいのですが、 ディスプレイの解像度により、デザインが崩れてしまいます。 この誤差は、どうしたら良いのでしょうか? 最近のホームページは、画面がブラウザの「中央寄せ」または「左寄せ」 になっていると思いますが、やはりこれは、解像度の高いディスプレイで 見ている人への対応なのでしょうか? あと、「横フレーム」の機能を使っていない気がするのですが、これも、 解像度と関係があるのでしょうか。 とても、困っています。 ご返答宜しくお願い致します。

  • HTML
  • 回答数5
  • ありがとう数4

質問者が選んだベストアンサー

  • ベストアンサー
  • ikeuchi
  • ベストアンサー率28% (91/314)
回答No.2

私の場合、横はできるだけ800に収まるようにしています。どうしてもデザインを崩したくないときには、<nobr>のタグを使うか、目立たないように横800のイメージファイルを貼ることにしています。 狭い画面で見ると、横スクロールして見づらいんですが、我慢してもらうことにしています。 もう一つ、ブラウザの文字サイズの関係でデザインが崩れてしまうことが有ります。 これも、どうしてもの場合には、スタイルシートの定義で文字の大きさを定義することにしています。 <STYLE TYPE="text/css"> <!-- .pt9 {font-size=9pt;} .pt10 {font-size=10.5pt;} .pt12 {font-size=12pt;} //--> </STYLE>   ・・・ <font class="pt10">・・・ こんな感じです。ただし、これらは見てくれる人の画面やブラウザの機能を有る程度限定して、それ以外の人に我慢してもらうことになります。嫌う人もいますね。 横フレーム・・・、横に長くフレームを定義することでしょうか? あまり横に長くすると、横スクロールしないと見えなくなって見づらいですよ。見てくれる人のことを考えると、使わない方が良いような気がします。

ichitama
質問者

お礼

ご回答有難うございました。 横800のイメージファイルを貼ったら、とても良くなりました。 とても助かりました。有難うございます。

その他の回答 (4)

  • dany
  • ベストアンサー率35% (27/77)
回答No.5

内側のTABLEを%で指定してるとしても、現在収まっているセル(TD)に 対する%だからはみ出るってことはないはずです。 もしはみ出るのだとしたら、画像に%指定をしてないですか? ブラウザにもよりますが、<img ~ width="100%" ~>とかやると セルではなくブラウザの幅に対する%になります。 TABLEが「width="620"」、中の画像が「width="100%"」になってる時 ブラウザが幅800とかになってたら画像の引き延ばしによってTABLEも800に なります。 左右フレームですが、%指定にせずに「120,*」とかにすればそんなに 崩れたりはしないと思います。あ、スクロールバーで隠れる分( 18pixelくらい)の余白を確保しておきましょう。

ichitama
質問者

お礼

詳しいご回答、大変に有難うございました! イメージのWIDTH指定、フレームの指定の方法、知りませんでした。 挑戦してみます!

  • dany
  • ベストアンサー率35% (27/77)
回答No.4

私もwebでメシ喰ってる人間ですが横620に収まるようにしています。 ノートの人が観れなくて悲しいですから。といってもそれを言い出したら 横320のZAURUSはどうするとかいう話になりますが。^^; jubakoさんが書いたように固定テーブルを用いるのが一番いいです。 といっても <body><center> <table width="620" ~><tr><td>  ~内容~ </td></tr></table> </center></body> 全体を囲ってしまうと表示が遅くなる(ブラウザによってはTABLE内を全部 読み込み終わらないと表示しない)ので、ヘッダ部分やフッタ部分、本文部分 でも分割できるところはTABLEを分割しましょう。 スタイルシートで文字サイズを絶対値指定すると、目の悪い人が見にくくなる ので、「文字を文字としてではなくデザインの要素として使う」という意図 でない限り使わないのが無難でしょう。あとはメニューとか。 「横フレーム」って私は「左右分割」のことだと思ったんですが「上下」 ですか? どちらもよく見かけますよ。左右に関して言えば、スクロールバー が出現して描画範囲が狭くなるので私は使いません。 「人からリンクしてもらいたいページ」を考えて作っているのでフレームは 使えないんですよ。^^; 「このページにこんな情報あるぞ!」ってリンク されても、フレームがあるから該当ページじゃなくトップページになってたりね。

ichitama
質問者

補足

早速のご回答有難うございます。 すみません、補足で質問させてください。 jubakoさんの補足質問にも書いたのですが、 テーブルの中にテーブルを入れてしまうと、 800×600では、きちんと収まっているのに、 1024×768でみると外側のテーブルより 内側のテーブルが「びよーん」とはみだしてしまうのですが…。 でも、テーブルって分割した方が良いのですね。 とても勉強になりました。 といことは、テーブルの中にテーブルを入れるのは、 あまりしないほうが、よいのでしょうか。 私、「固定テーブル」を理解できてないのでしょうか。 「一番外側のテーブルで、WIDTH指定がされているもの」と 解釈しているのですが、合ってますか? でも、外側が「びよーん」ってなってしまうので、固定されていないですよねー。 私の「横フレーム」とは「左右分割」です。 良く見かけるんですねー。 でも、フレームのページを解像度の違うパソコンでみると、 すっごくデザインが、かわってしまいますよね。 どうにか、高い解像度のパソコンでも綺麗に見えるようにしたいのですが。 ご回答宜しくお願い致します。

noname#5824
noname#5824
回答No.3

仕事でWebデザインをしていますが、 暗黙の了解として800*600の画面でおさまるように作ります。 それより小さい画面の人はかわいそうなのですが… デザインが崩れないようにするためには、 テーブルタグを使用します。 例えば、画面いっぱいに横サイズ固定のテーブルを作ります。 その中でデザインをしていけば、 どんなにブラウザが小さくても、大きくてもデザインは崩れません。 ただ、デフォルトでは左寄りになってカッコ悪いので、 そのテーブル全体を中央寄せにすると、 大体どの環境でも同じ様に見えます。 横フレームというのは、横にスクロールするフレームですね。 これは解像度も確かに理由としてあるのですが、 なんといっても、スクロールをしにくいからです。 最近ではスクロールマウスもあるのですが、 ほとんどのスクロールマウスは横にはスクロールできません。 いちいちバーをドラッグしないといけないので、 あまり好まれないですね。

ichitama
質問者

補足

早速のご回答有難うございました。 とても参考になりました。 更にお聞きしたいのですが、 「画面いっぱいに横サイズ固定のテーブルを作ります。」 と有りましたが、どのようにするのでしょうか。 ちなみに、私はWIDHT="75%"のテーブルの中に WIDHT="100%"のテーブルをいれてみました。 800×600でみたら、綺麗におさまるのですが、 1024×768でみたら、テーブルの中のテーブルが 「びよーん」ってはみ出てしまいました。 これを回避するにはどうしたら、良いのでしょうか。 ご回答宜しくお願い致します。

noname#25358
noname#25358
回答No.1

 どうしようもありません(^_^; 製作者側がそういうことを意識して、「崩れても問題ない」デザインにする必要があります。  基本的には、「画面の横幅が640ピクセル未満のときに正しく表示される」ように設計すればOKです。これは、Windowsが動作する最低限の横幅が640ピクセルだからです。(最近はモバイル機器が普及してきてそうでもなくなってしまいましたが)  最近のパソコンは最低でも800×600はあるので、比較的新しめのパソコンでの閲覧を前提とするならば、横幅が800ピクセルでもいいでしょう。  文字を中央寄せや左寄せ、あるいは横並びのフレームに関しては、これは解像度とは関係ないように思われます。横フレームって、割と今でもありますよ。問題になるのは割と「画面の横幅」ですから。  ブラウザの大きさは人によってまちまちです。大きな画面サイズいっぱいに作って、ちょっとでも小さな画面で見ている人が困るようなデザインは、「いいデザイン」とは言えません(あまりにも小さすぎる画面はさすがに閲覧者側の責任ですが)。  「見やすい」デザインとは、ある程度画面サイズが変わっても、柔軟に対処できるデザインだと俺は思います。もちろん、その「ある程度」というのがどの程度なのか、という指標を、自分の中で作っておく必要はあると思いますが。  もっとも、だからって「画面を単純化すればいい。テーブル不可、画像不可、音楽も不可、文字の大きさは大きくとって、小さい文字は不可だああ!」というような『不可だらけ』の持論は、ただの逃げの口実だと思いますけどね(^_^;

ichitama
質問者

お礼

ご回答有難うございます。 「なぜ640ピクセルに合わせるのか?」と思っていた疑問が無くなりました。 有難うございます。

関連するQ&A

  • 高解像度ディスプレイで観た画像

    私はタブレットPCで電子書籍を閲覧しているのですが、最近では高解像度のタブレットが販売されていて主流となっていますが、高解像度のディスプレイで昔の低解像度の画像をみた場合、画質はどのようになりますか? 1.高解像度ディスプレイの方が鮮明 2.従来の画質と変わらない 3.高解像度ディスプレイだと画像を引き延ばしているので画質は逆に落ちる どうかご返答の方よろしくお願いします。

  • ディスプレイの解像度?がおかしい

    マルチディスプレイにしようとして、メーカーも異なるディスプレイを購入し接続しました。 画面プロパティに複数ディスプレイの設定が表示されなかったのでNVIDIAコントロールパネルから複数設定を行っていたところ、元々のディスプレイのほうの画面が中央に寄ったみたいに表示されるようになり、外側が黒く表示されて画面ぴったり表示されなくなりました。 片方のディスプレイはぴったりあっているのですが、解像度が違うために起きたのかな?と思い、また戻す方法がわからないため質問させていただきました。 元々の解像度は1680x1050で、それに戻したのですが今までと表示が違っています。 また、シングルに戻しても画面はそのままになっています。 対応法などあるのでしょうか。かなり困っていて戻すだけでもよいので教えていただけたらと思います。 よろしくお願いします。

  • ディスプレイの解像度の設定について

    現在私はとあるバンドのホームページを作成しているのですが、悩んでいる部分があるので、よろしければアンケートにご協力お願い致します。 A:現在のPCのディスプレイの解像度の設定(例:800×600px) B:HP等を観覧するさいのブラウザの表示方法(例:フルスクリーン) C:Bがウィンドウの方は、その大よそのサイズ(例:800×600px) 上記に3点ついて回答宜しくお願い致します。 以下も余裕があれば回答お願いします。 D:よく見るホームページの種類(例:アーティストの公式HP等) E:レイアウトがデザイン・利便性に優れているHP F:ロックバンドの色のイメージ

  • VGAとディスプレイの解像度

    VGAとディスプレイの解像度について質問です。 たとえば DVI最大1600x1200 D-Sub最大2048x1536 の解像度に対応したマザーボードがあるとします。 しかし ディスプレイ(24インチワイド)は最大1920x1200 の解像度だった場合 D-Subなら対応だとおもいますが DVIなら横が足りません、この場合横長な絵になるのでしょうか? それとも両端計320の空白があるのでしょうか?

  • ディスプレイの解像度について

    高解像度対応のディスプレイで、解像度をさげると文字がぼやけますよね? これは、液晶だけなのですよね? 1024×768 のサイズにあわせて作成してあるパッケージ等(ゲームなどもそうかと思いますが)は、1280×1024などの高解像度で表示させると、かなり小さなサイズで表示されてしまいますが、解像度をさげると文字がぼやけるため、他の方法を探しています。 そういったフリーソフト・方法など、もしご存知でしたらおしえていただけませんか? 例)デスクトップ画面を別ウィンドウで表示させることができ、そのウィンドウでは何らかの方法で、1024×768サイズのパッケージを、文字がぼやけることもなく大きく表示できる そういうフリーソフトは不可能だ、という情報でもいいので、どうかよろしくお願いいたします。

  • ホームページ作成時の画像解像度

    ホームページ作成初心者です。 ホームページを作成する時、本を参考にしたところ、 『ブラウザのサイズを800×600にして、スクリーンショットをとり、それをベースにしてデザインしていく』 とあったのですが、現在はかなり大きなディスプレイが普及しています。今もそれを基準に作っていいのでしょうか。 また、800×600という解像度は、コントロールパネルの「画面」で設定する方法でいいのでしょうか。 実際やってみたところ、かなり小さい気がしたので心配になりまして質問させていただきました。 WindowsXP、Dreamweaver、Photoshopなどを使用する予定です。

  • パソコンの解像度、いくつですか?

    趣味のホームページを開設しているものです。 お聞きしたいのは、皆さんが使用なさっているパソコンの解像度です。 サイトを作るに当たっては、横スクロールはウザイと感じる方が多く、最低の解像度に合わせて作るのが普通だと思います。 そういう理由から以前は800×600を基準に作られているサイトが殆どでした。 現在は1024×768くらいが主流になっているようです。 自分も今まではその解像度を念頭に置いてサイト作りを行ってきました。 最近PCを新調し、ディスプレイもCRTの19インチから液晶の19インチに買い換えました。 CRTの時は解像度を落としても、画面がボケることはなかったので1024×768でサイト作成を行ってきたのですが、液晶だと最大解像度で使用しないとはっきり言ってピンぼけという状態になります。 そこでディスプレイの最大解像度、1280×1024の解像度で自分のサイトを見てみたのですが、ずいぶん感じが違ってしまっていて、正直困惑してしまいました。 現在、店頭に並んでいるPCは、ノートにしてもワイド液晶のディプレイが多く、縦サイズはともかく横1280が主流のようです。 実際に、今、一般で使用されている解像度は1280が多いのか、それともまだ1024が多いのか? それによってレイアウトを考えたいと思っています。 よろしくお願いします。

  • 液晶ディスプレイの大きさと解像度

    液晶ディスプレイを検討していますが、17インチでも、普通のと横長のサイズが あるようです。 解像度はどちらも1280×1024になっています。つまり見える範囲は同じということですか。 例えば同じエクセルの表を見たような場合、ワイドのようなかたちのものの場合、セルや文字が少し横に広がったように見えるのでしょうか。

  • ディスプレイ解像度より大きなフォームをデザインしたいのですが

    Visual Studio.NET 2003のVB.NETでWindowsアプリケーションの開発を行っています(OSはWindowsXP Pro SP2)。 解像度が1280x1024や1024x768の液晶ディスプレイで開発をする際に、ディスプレイの解像度より大きなサイズのフォームを作ろうとしても、強制的に解像度付近のサイズにSizeプロパティが変更されてしまいます。 たとえば、1280x1024の17インチ液晶で、1600x1200のフォームを作ろうとしてデザイン画面からSizeプロパティのWidth、Heightを変更しても、プロパティ記入欄からフォーカスが移動したとたんに、幅と高さが1292x1036に変更されてしまいます。 ディスプレイを買えばすむ話なんですが、できれば買い換え無しで対処したいところです。どなたか回避策(小さいディスプレイでも大きなフォームをデザインできるようにする方法)をご存じないでしょうか?

  • 仮想解像度はホントの解像度と同等の負荷がかかるのか

    radeonの仮想超解像度という機能を使ってFHDの2枚のサブディスプレイを仮想4K化して使い始めました。 そこで疑問なのですが、仮想解像度のディスプレイは実際にその解像度があるディスプレイを表示させるのと同等の負荷がかかるのか?というものです。 サブディスプレイはたくさん資料を並べるために4K化しましたが、PCにあまり負荷がかかるようでしたら解像度は抑えめにしようと思っています

専門家に質問してみよう