• ベストアンサー

レイアウトの概念が掴めません(GoLive6.0)

hiro-izmの回答

  • ベストアンサー
  • hiro-izm
  • ベストアンサー率55% (16/29)
回答No.3

>フルスクリーン(14モニタ)で表示するとレイアウトそのもの >自体は崩れませんが変な余白が出来るというか余白も意識しての >デザインなのでどうしたものか Webページは主に横幅を決めて縦はコンテンツの内容(文章など) で自動的に長くなります。 文字サイズを大きくして見ている人もいますしその逆もあるからです。 文字が大きくなれば縦方向にページ伸びるので 縦サイズをキッチリと決めるのは難しいです。 あくまでも1例としてですが、tableでレイアウトを組みます。 cssを使わずtableレイアウトと仮定します。 まず大枠を決めます。 横幅580px1行1列のtableを配置。 これがページの全体の大きさです。縦は内容により長くも短くもなります。 背景に色を付けると 範囲が分かりますので慣れるまで付けながら行うと良いかもしれません。 (追加した場合色を分ける。アップロード直前にでも色指定を消せば良い) 大枠の中に中央寄せでtableを作り、思い描く要素を入れていきます。 例: 大枠table 580px コンテンツ1 table 560px コンテンツ1 /table コンテンツ2 table 560px コンテンツ2 /table /大枠table tableやcell(テーブルのマス目)の マージン(余白)指定には 1px*1px の透明gifを配置して 画像の縦や横サイズで広げたり固定して行きます。 横幅をpixel指定では無く%で指定すると ブラウザのウインドウサイズの何%という感じで表示されます。 >どこまでが範囲なのか下隅などが >もうひとつよく理解できません。 上記の通りtableやcellに色を付けるなどして 範囲を理解するのも良いかも知れません。 (範囲確認の為の一時的なもの) --- 多くの人が見ている環境を想定してページの大きさを 決めた方が良いと思います。 より多くの環境でチェックすることにより 多くの人が同じような見え方をするページを作成出来ると良いですね。

zztop66
質問者

お礼

非常に分かりやすいご説明に感謝いたします。 テーブル愉愉というのは他ページでも拝見したのですが、段落表のような感覚(レクチャー本はそういう使用例でしたので)で受け止めていたのでなるほどそういうことかと合点が行きました。  お手間をお掛けしました、ありがとうございます。

関連するQ&A

  • CSSレイアウトってなぜこんなに難しいのか?

    個人事業で、WEBデザインの仕事をしています。 恥ずかしいですが、ずーっと、テーブルレイアウトでのみHP作成してきました。 文字を整えたり、種類をまとめたりだけ、CSSを使ってました。 先日初めて、クライアントから「そろそろテーブルレイアウトはやめてくれ」と、 ダメだしを食らいました。 独学でDreamweaver MX 2004を一から学んで、仕事やって来ましたが、 ちょっと恥ずかしい質問ですが、 CSSレイアウトってなぜ、こんなに難しいのでしょうか?? みなさん、テーブルレイアウトと比べて異常に難しく感じませんか? 今の調子ではHP作成の仕事が請けられなくなっています。(涙) 例えば、テーブルレイアウトって、自由にドキュメントで確認しながらデザインできますよね。 でも、CSSレイアウトって、コードで全部書き出しますので、 ちょっとサイズや項目や要素を変更するだけでも、どのdiv?、どのクラス?のタグにそれを指定したかとか、 複雑になり解らなくなってしまい、ちょっと変更するだけでも凄い時間がかかってしまいます。 ■もしかして私、CSSレイアウトの学び方、作り方を間違ってるのでしょうか? ■今まで2~3冊位、Dreamweaverの本で、CSSレイアウトを勉強してますが、  いっこうに進歩しません。(ここに本の題名書き出すとマズイですよね?) ★CSSレイアウトが解り易く学べる、勉強本を教えて頂けますでしょうか。 ■もしかして、DreamweaverでCSSレイアウトをするから難しいのでしょうか?  HPビルダーとかなら、もっと簡単に出来るのでしょうか? ■今、私ができるCSSレイアウトの限界は、一番大まかな囲いの、 #header #side #main #footerを、#contentの中に入れて、 その中の各々の要素は、今までとおり、テーブルでレイアウトする。 (メニューや、商品スペック、写真並べなども、テーブルで。) それが精一杯ですが、これで通用するのでしょうか? HPデザイナーとして、恥ずかしい質問ですが、 ご教授どうぞ宜しくお願い致します。

  • ホームページのレイアウトが崩れてしまった

    個人で作成しているホームページのレイアウトが突然崩れ困っています! もともとホームページビルダーで作成し、アップロードしているのですが、ホームページビルダーで確認しても何の問題もないのに、ホームページ上では崩れてしまいます。 ほかのパソコンやバージョンの異なるIEで確認しても同じです。 すいませんが、よろしくお願いします! http://fujishirodai.hp.infoseek.co.jp/

  • GOLIVEで

    MAC OSX GoLive6.0を利用してHPを作成しようとして悪戦苦闘してます。 Micromedia社のHP作成ソフトを初歩程度ですが勉強する機会があったので、そちらの方は簡単な操作なら出来ます。 このたびGoliveを全く無知の状態からの使用しているのでかなり苦戦しております。。これらのソフトは全く別なモノと考えた方がいいのでしょうか。 (イラレ、フォトショップは一通り操作できます。初歩程度のサイト構成についても理解済み) 次に、操作について3つほどお聞きしたく思います。 1,どの画面解像度でも画面中央に配置するようにはどのようにすればいいのでしょうか。作成時は17インチ内に収まるようにページをレイアウトしてますが、実際21インチモニタでブラウザで見ると全体に左によってます。 2,画像は2つ重ねる事はできませんでしょうか。少しずらして重ねたいんです。 3,ページをつくるときはレイアウトグリットを使用した方が作りやすいのでしょうか。 以上ホントに初心的な質問で申し訳ありません。 どうぞ回答お願いします。

  • IE8でレイアウトが崩れます。

    HPビルダーを使ってHPを作成しております。作成したサイトがIE8でレイアウトが崩れるのでタグを追加し以下のように記載しましたがIE8で確認しましたが直っておりませんでした。間違っている箇所等がございましたら、ご指摘お願い致します。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <meta http-equiv="X-UA-Compatible" content="IE=emulateIE7" />

  • GoLiveで作ったHPのブラウザ表示

    GoLive CS2でHPを作成しています。 GoLiveで作ったHPをIE6とoperaで確認してみたのですが、表示がそれぞれ異なっています。 具体的に言うと一番上に表示されている画像や文字がoperaでは隙間無く表示されているのですが、IEでは一文字分程度の空きができてしまっています。空きができないようにするにはどの部分をいじればいいのでしょうか? それから、より多くのブラウザでレイアウトが崩れないようにするにはどこを意識して作ればいいのでしょうか? ご教授お願いします。

  • アップロードするとレイアウトが崩れてしまう

    お世話になります。 DW CS3でHPを作成しているのですが、 プレビューやグーグルクロームで確認するとうまくレイアウトされているのに なぜかアップロードするとレイアウトがひどく崩れてしまいます。 BOMをはずすと解決したという方もいらっしゃいましたが UTF-8のBOMを含めない設定になっています。 プレビューやグーグルクロームで二重に確認しながらコーディングしているつもりなのに いざアップすると全く違うレイアウトになっているようでは確認しようがない気がして 困っています。 margineやpadding、widthの設定等が間違っているのではというご指摘もあるかと思いますが 「プレビューやグーグルクロームでは思い通りのレイアウトになっているのに・・・」というのが いちばん疑問に感じている点です。 どなたか詳しい方ご教授ください。 また、「こういったケースの場合はこの辺を見直してみて」といった ヒントを下さるととても助かります。 長文申し訳ありません。 お分かりだとは思いますが、当方初心者です。 なにとぞよろしくお願いいたします。

    • ベストアンサー
    • CSS
  • MTでデザイン(レイアウト)が崩れた時って?

    最近MT3.3からブログを始めた者です。 有名なサイトさんなどを参考にしながらCSSやHTMLなどを弄っています(デフォルトのテンプレは使っていません)。 ある時、ふと自ブログをブラウザで確認してみると、3カラムのデザインの右カラムだけが左カラムの下に下がっていました。 (FirefoxとIEで確認しており、IEでだけ崩れているようです) 途中、細かくブラウザ確認すれば良かったのですが、それを忘れていて今になって気付いた・・と言う訳です(泣) ちょっと調べてみましたら、"どうやらIEだけはちょっと規格が違う?ので、IEでだけ崩れるのは珍しくはないらしい"・・と言う事までは分かりました。 しかし、このまま放置しているのもどうかと思うので、できれば修正したいと考えております。 そこで、お分かりになる方に質問です。 もし、あなた様がこのような状態でレイアウトが崩れてしまったとしたら、まず真っ先に疑うとしたらどの部分だと思われますか? 非常に抽象的な質問で申し訳ないのですが、『自分だったら・・・』で教えてくださると有難いです。 【実際にサイトを見ないと分からない】、【カスタマイズ内容による】と言われるのを承知で質問しております。 尚、参考にさせて戴いているサイトさんでは、そう言った質問に当てはまるFAQ等は用意されてないようですし (それらが理解できる前提で紹介しているのでしょうから、当然ですね) 一応、検索を掛けてみたのですが、探し切れませんでしたのでこちらで伺いました。 CSS、HTMLの知識がなく、分かりにくい質問で本末転倒かも知れないのですが、どうか宜しくお願い致します。

  • 会報誌のレイアウト

    エディトリアルデザインの仕事についてです。 媒体は企業の会報誌なのですが、連載ページで本文量が決まっているものに対して、毎号入稿されてくる本文量が合わず、レイアウトで調節してほしいと言われます。 例えば本文量が少ない場合は、「行間を空けて調節してください」などと言われます。でも、なるべくそのような調節はしたくないと思い、写真やイラスト(自分で用意するのですが)を入れてレイアウトを崩さないようにしています。 本文量が多い場合は、カーニングや字送り以上の調節はしようがないので、行間・余白、または級数を変えて調節せざるを得ません。また、そのような指示をされます(先方から。デザイナーではない)。 ※基本のレイアウトフォーマットは、以前先方が指示してきた文字数を基準に、ある程度の増減には対応できるように作成しました。その調整可能な範囲を超え、レイアウト変更にまで及んでしまいます。 こういった調整を要求されるのは普通ですか?ライター・編集だっているのに…という気分です。多少おかしなレイアウトになってしまうとしても、会報誌だし、素直にお客さんの言うことを聞いていればよいのでしょうか。 いまいち納得できていないので、同業の方がおりましたら、どうなさっているのか教えてください。

  • tableによるレイアウトorCSSによるレイアウト

    現在HPをリニューアルしようとしております。 現状はホームページビルダーでテーブルを多用してレイアウトしておりました。 洋服関係のネットショップなのでかなり見た目ごちゃごちゃした感じで作っています。 また、「生きているサイト」を意識して頻繁に少々のレイアウトや内容の更新をしております。 *商品はコンスタントに更新してます。 このたび、dreamweaverでhtml+CSSでブロック要素のまわり込みでレイアウトして作りかけています。 がしかし、参考に他のサイトのソースを多数見ていくとレイアウト自体はテーブル(html)で行っているサイトが多く現在、レイアウト自体をテーブル( html)orCSSでコントロールする方法が良いか迷っております。 html+CSSでブロックコントロールしていく方法を多方面推奨しているようなのですがブラウザやブラウザバージョンにより崩れたり・・・とういう事は理解できております。 そこでお教え頂きたいのですが・・・ ●今後CSSがスタンダードになるとは思いますが現状、web製作の現場ではTABLEによるレイアウトとCSSによるレイアウトどちらがスタンダードでしょうか? ●また、CSSの場合、<div>のまわり込みでレイアウトを決めて<div>内のレイアウトはどのようにすればフレキシブルに内容や画像を取り扱えるでしょうか? ●その他、お気づきの点があればご意見ヨロシクお願い致します。

    • ベストアンサー
    • HTML
  • jimdoの独自レイアウトについて

    jimdoの独自レイアウトにてHPを作っていまして 2点質問があります。 トップページのみsidebarを非表示にしたいのですが、CSSでどのように記述したら 良いですか? ※下層ページにはsidebarは設けます。 それと、html入力で内容を入れていきたくて タグを入れているのですが(ウィジェット/html) 画像が表示できません。 独自レイアウトにてアップした画像は使えないのでしょうか? サポートに聞いてもサポート外と言われました。 お願いします。

    • ベストアンサー
    • CSS