TABLEタグを利用しない区切り方

質問

TABLEタグを利用するのは読み込みが遅かったり、利用用途的（表ではないのに使うな）に
問題があったりとして利用するべきでない事だというのを何かから知ったのですが、
では、TABLEタグを利用しないで区切りたい場合、どうすれば良いのでしょうか？
例えば以下のようなページレイアウトの場合。
－－－－－－－－－－
｜　　タイトル　　｜
－－－－－－－－－－
｜メ　｜　本文　　｜
｜ニ　｜　　　　　｜
｜ュ　｜　　　　　｜
｜｜　｜　　　　　｜
｜　　｜　　　　　｜
－－－－－－－－－－

ご存知の方、ご教示下さい。

回答No.5

神崎 渉瑠（@taloo）

前提としてスタイルシートがどういう物で、どういう書き方をすればどう表示されるのか、
ということを知っておかなければなりません。
まずはそこから勉強していく（覚えていく）のがいいのではないでしょうか。

該当のページレイアウトは「CSS 段組」で検索すればサンプルが見つかると思います。
スタイルシートの書き方をある程度わかっていれば、
それらサンプルを見ればすぐにわかると思います。

回答No.4

papamama18

http://www.geocities.jp/multi_column/index.html

CSSレイアウトについては、上のサイトを参考にしてください。
とても説明できるものではないです。

Tableタグを使用してはいけない訳ではなく、
レイアウトにTableタグを利用するな、ということです。
決して読み込みが遅くなるから・・・ではありません。

このあたりのセマンテックなコーディングは、
書籍「Web標準デザインテクニック即戦ワークブック」を読めば理解できるでしょう。（リンク先でも紹介されています。是非読んでください！）
セマンテックコーディングの理解が深まると、
Tableレイアウトが恥ずかしく思えるでしょう。

参考URL：

http://www.geocities.jp/multi_column/index.html

回答No.3

noname#39970

ちょっと美しくないけど

<div>header</div>
<div style="border:solid 1px;width:100%">タイトル</div>
<div style="width:100%">
<div style="width:10%;float:left"><div style="border:solid 1px;width:100%">メニュー</div></div>
<div style="width:90%;float:left"><div style="border:solid 1px;width:100%">本文</div>
<div style="clear:both"></div>
</div>
<div>footer</div>

実際のstyleはcssで外部へ

回答No.2

kind_joke

フレームを使う手はあると思います。

が、それって、回線速度が遅かった時代(１０年ほど前)に言われてたことだと記憶してますが、今でも言われるのでしょうか？
まぁ、現在でも、読み込みに時間がかかるとわかっているもの（他のサイトから呼び出されるファイルなど)があればテーブルの外に置くようにすれば問題ないと思いますが。

回答No.1

noname#33971

ＣＳＳを利用してみてはどうですか？

補足

ありがとうございます。
DIVやCSSを使うっぽいような所までは調べられたのですが、
具体的にシンプルなレイアウトを生成する為に
どういうコーディングになるのかさっぱりなのです・・・。