• ベストアンサー

ホームページに余白を設けているページが多いのはなぜ?

こんにちは。 よろしくお願い致します。 今ホームページを作っています。 いろいろな会社や個人のサイトを参考にしています。 そこで、気づいたのですが、例えばページの右端のほうには余白を多めにとり、 何もなく、 左側のみにページを詰めているサイトが結構あるなと。 例えば下記のサイトなどです。 http://www.disneyambassadorhotel.com/japanese/index.html これにはどういったメリットがあるのでしょうか。 是非教えてください。 よろしくお願い致します。

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

  • ベストアンサー
回答No.3

puriyoさんはモニタをどう設定されていますか? 色々な設定ができると思いますが、一般の人では画面領域(解像度?)を800(横)×600(縦)に設定している人もいます。 大きな設定に合わせてHPをレイアウトすると、800×600設定している人にとっては横のスクロールが必要です。 文章が横書きなので非常に見づらくなります。 で、多くの人が横スクロール無しで見られるように横幅を考慮して作成している。つーことだと思います。 ちなみに私はオフィスバーがあっても見やすいように、横幅760で作っています。

noname#109827
質問者

お礼

私は今見たところ、1024x768ピクセルになっていました。 はずかしながら、全くモニターのことを考えていませんでした。 確かに横のスクロールバーがあると、いちいち面倒ですね。 私も横幅を考えて作ろうと思います。 ありがとうございました!

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (3)

  • sanori
  • ベストアンサー率48% (5664/11798)
回答No.4

800×600とかの低い解像度のディスプレイでも、画面の右にはみ出ないようにしているためです。 だったら、中央表示にすればいいようなもんですが、 画面左によっているのは、意図してやっているのではなく、HTML作成の都合上、そうなってしまうからです。 また、例えば、この、教えてgooみたいに、どんな解像度でも、文字の折り返しは自動で行なわれるのですが、ご質問のサイトのような背景模様のあるページですと、背景までは解像度に応じて可変にはできません。 背景からはみ出して、文字だけ画面右端まで伸びるとデザイン上よろしくないですし。 要は、しかたなく左に寄ってる、ということです。

noname#109827
質問者

お礼

なるほど、そうだったんですか。 文字は解像度に関わらず、自動で折り返されるのですね。 やはり、余白を入れて作ってみようと思います。 どうもありがとうございました!

全文を見る
すると、全ての回答が全文表示されます。
回答No.2

画面サイズに依存しないで、表示できるからではないでしょうか? 要は画面が大きなPCでも小さなPCでもレイアウトが崩れにくいと思います。

noname#109827
質問者

お礼

ありがとうございました! 見る側のことを考えると、そうしたほうがよさそうですね!

全文を見る
すると、全ての回答が全文表示されます。
回答No.1

こんにちは。 最近は画面の領域を1024*768にしているのが多いのですが、まだまだ画面の領域が小さい方が居てます。またお気に入りを左端に表示している人もいます。その時に大きい画面でフルサイズで作ってしまうと全て表示されず右端が切れてしまいます。見ようと思えば横にスクロールしなくてはなりません。これは非常に見づらいです・・・。 右端に空白を作って横にスクロールするのをなくすようにしています。 今は大体横のサイズが800するといいと思います。

noname#109827
質問者

お礼

なるほど、見る人の環境を考えているのですね! どうもありがとうございました!

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • ホームページのページ構成

    サイトを作成するさい、どのようなページ構成にしたらよいか教えて下さい。 店舗のホームページを作成しており、サイトは5ページで構成されております。 ページ数は増える予定はなく現在は下記(1)で作成しております。 しかし正しい構成は下記(2)でしょうか。 (1)www下に各ページ設置 www/index.html     info.html     menu.html     gallery.html     access.html (2)各ページ毎にディレクトリを構成し設置 www/top/index.html    /info/index.html    /menu/index.html    /gallery/index.html    /access/index.html よろしくお願い致します。

    • ベストアンサー
    • HTML
  • ページ下部に大きな余白が…

    恐れ入ります。 ぜひ教えて下さい…m(_ _)m ホームページビルダー7を使っています。 ページ編集画面では問題ないのですが、 プレビューすると、いちばん下に大きな余白ができてしまいます。 解消する方法があれば、どなたかご教授いただけます でしょうか? 横に2分割した表(大)の中にすべての表、文字や イメージを入れて作っています。 左側にはさらに表を一つ入れてその中に文章、 右側には縦に表を3つほど入れて、そのいちばん下の ものの中に文章(小さい文字サイズで)をたくさん 打ち込んでいます。 その文字サイズと改行などのせいか表(大)の左側の 文章がかなり上の方で終わって、かなり空白ができる 状態でやっと、プレビュー画面で見て右側と左側の バランスがちょうど良くなります。 問題の、ホームページ自体の一番下にできる大きな 余白は、そのページ編集画面での左右のアンバランス さと、似たような高さのような気もするのですが、 属性変更の“セル”や“表”の高さの数値を変えて も、マウスでドラッグしてそれぞれの表のサイズを変えようとしても、大きな余白は消えません。 それどころか、あんまりいじると、今度は大きな余白が消えて、表(大)の中に大きな余白ができてしまいます。 どなたか解決方法をご存知の方、何卒アドバイスの程、よろしくお願い致します。

  • ホームページビルダーで作ったサイトの幅と余白

    ホームページビルダー8を使用しています。 困っているのは、他のサイトのようにパソコン画面左側に固定したお気に入りの欄を右に広げたり狭めたりしてサイトの画面の幅が変わる時に、私のサイトは常にその中央に位置しないということです。 お気に入りの幅を広げようとすると、最初から右側の余白だけが狭まり始め、左側は一定です。 例として(ヤフーなどより幅を狭く作っている)運輸会社さんのサイトがわかりやすいのでURLを記します。 http://www.kuronekoyamato.co.jp/ 運輸会社サイトは、お気に入りを広げても狭めても両側の余白の幅は変動するものの、常に左右対称の同じ幅です。 (そして、ある一定以上お気に入りを広げると、その段階で初めてサイトの右側が見えなくなり始めます。) ほとんどのサイトはこのようになっているとおもいますが、 私のサイトの場合は、どうしてこのように左右均等に余白ができないのか教えてください。 今のやり方は次のようにやっています。 Illustratorで下地のデザイン(簡単なグラデーションの壁紙のようなもの)を作り「Web用に保存」し、それをビルダーの「どこでも配置モード」で、「ページ編集」画面で一番最初に貼り付けて、その上にビルダーで文字を書いたりボタンを貼り付けたりしています。 「ページ編集画面」で、画面の左端合わせて自分の下地デザインを貼り付けると、ネット上でみた時に左側に全く余白がない状態になるので、わざと左側を約四センチくらい空けて、余白を作るようにして、下地デザインを配置しています。 でも、上記したようにこの約四センチの余白はお気に入りの幅が変動しても常に同じにしかならず、右側の余白だけが変動します。 よろしくお願いします。

  • ページ下の余白をなくせない・・・

    GoLive csというソフトでホームページを作りはじめました。 下のようなホームページ↓ http://www.uchida-hp.com/ のように、上と下の余白を無くしたページを作りたいのですがどうしても下の部分の余白だけ無くすことができません。背景の色が表示されてしまいます。 ソフトのページのプロパティ設定で左右・高さのマージン設定を「0」にしていますがダメです。上の余白は無くなります。 レイアウトするテーブルやグリッドの設定を何か行なうのでしょうか? どなたか教えて下さい。 お願いします。

    • 締切済み
    • CSS
  • PDFを1ページに結合すると余白ができる

    やりたいことは、2ページのPDFを余白なく、1ページにまとめることです。 問題は、1ページにまとめたときに余白ができてしまうことです。 余白設定は、グレーアウトされてしまって設定できません。 以下のサイトを参考にして次の作業を行いました。 参考URL : http://www.koikikukan.com/archives/2012/08/08-015555.php 作業手順 :  1. 2つのPDFファイルを1つのPDFに結合(この時は余白なし)  2. Adobe PDF X から「印刷」を選択  3. プリンター「Adobe PDF」を選択し、「プロパティ」を押下  4. レイアウトの印刷の向きを横に設定、用紙サイズをA3に設定して「OK」  5. ページサイズ処理の設定で、「複数」を選択し、    1枚あたりのページ数を「2×1」に設定  6. 「印刷」を押下 この手順でもなくてよいので、余白なく2ページのPDFを1ページにまとめる方法を ご存じであればご教示ください。 よろしくお願いいたします。

  • ホームページ制作会社

    お世話になります。ホームページを制作していただける会社を探しております。いろいろ探してみましたがなかなか気に入った会社が見つかりません。英会話のGABAのようなシンプルで見やすいホームページを制作していただける会社をご存知の方がいらっしゃいましたら、どうか宜しくお願い致します。 GABAホームページ http://www.gaba.co.jp/japanese/top/index.html

  • ホームページでショップのページを作りたいです。

    ホームページでショップのページを作りたいです。 書き込みさせていただきます。 ホームページを作成し、そこでちょっとしたショップを開こうかと思っています。 まだ生活のメインではないので、そこまで本格的でなくても良いのですが 迷っていることがあります。 まず1つは、サーバーで、下記を候補にあげています。 ・さくらのレンタルサーバー http://www.sakura.ne.jp/ ・ロリポップのサーバー http://lolipop.jp/ どちらの方が良いでしょうか。 そしてもう1つは買い物カゴなのですが、下記の無料CGIを使わせてもらおうかと思っています。 http://www.kent-web.com/cart/index.html なんとか、ホームページは作れると思いますが、正直CGIはあまり良く知りません。 ( この機会に勉強しようとは思っているのですが…………… ^_^; ) そこのカートで、クッキー式とクッキー式じゃないものがあるのですが 何が違うのでしょうか。 よろしければ、アドバイスお願い致します。

  • HTMLでページの余白を設定したい。

    HP作成初心者です。 HTMLとスタイルシートを使って作っています。 画面の両端に余白を入れたいのですが、 その方法がいまいちよくわかりません(++) フレーム?を使って3つのページを1ページとして 表示させているのですが・・・その指示をどのページに入れたらいいのかもわかりません。 indexだけでいいのか・・それともその他のページにも設定するのか・・。 どうぞよいアドバイスをお願い致しますm(__)m

  • ホームページ余白ができてしまいました

    基本HTMLでホームページを自作しています。 いじってるうちに有り得ない位置に余白が出来てしまいました。 HTMLとCSS、テーブルタグを使いすぎてると思いながら、修理に修理を重ねる感覚で 自分でもよく分からなくなってしまいました。 画面は、 ---------------------- タイトル ---------------------- ※←?  画像○  ---l  -------------- ---l  画像○ ---l  -------------- ---l  画像○ ---l -------------- このような作りです。全体をテーブルで分け、タイトルの下に 左側には各々のページへ行くメニュー、右側に紹介したいものの画像などを配置しています。 ところが※←のところに妙な余白があいてしまい、左側のメニューがぐっと下がっています。 ソースの一部書きますので、アドバイスお願いします。 <META name="robots" content="index,follow"> <script language="javascript"> <!-- function mini_win(theURL,winName,features) { window.open(theURL,winName,features); } //--> </script> <style type="text/css"> <!-- .cop { position:absolute; right:0; left:0; top:0 } --> <!-- a{ text-decoration:none; } a:hover{ text-decoration:underline; color:#fa8072; font-weight:bold; background-color:#f4f4be;  } a:link{color:#006400} a:visited{color:#556B2f} } --> </style> </HEAD> <a name="#top"> <BODY bgproperties='fixed'> <table width=100%> <tr> ~と続きます。 長くなりましてすみません。 よろしくお願い申し上げます。

    • ベストアンサー
    • SEO
  • ホームページ作成について

    無料ホームページ作成が出来るサイトでホームページを作成したいのですが パスワードを知っている人のみが入れる様にしたいのですが、ヤフーやgooのホームページ作成では、パスワード制限は無理でしょうか? また、下記のサイトはパスワード制限が出来るのでしょうか?簡単に申し込み、ページ作成が出来ますか?お勧めの所がありましたら教えて下さい。宜しくお願い致します。 http://petat.com/ ペタット http://www.shinobi.jp/tadaima_index.html 忍者ツール http://www.fc2web.com/ FC2