掲載画像のレイアウトはテーブルレイアウトで実現？

締切済

質問者：tkwavek
質問日時：2012/08/25 17:30
回答数：3件

掲載した画像のようなホームページのレイアウトはテーブルを何重にも組み合わせて
（テーブルを何重にも入れ子にして）実現するのが最近の一般的な手法なのでしょうか
このようなホームページのレイアウトのコーディング方法の概略を教えてください。
webデザイン素人のためなるべく詳しく丁寧に教えていただけると助かります。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

最新から表示
回答順に表示

No.3

回答者： 110110110110
回答日時：2012/08/31 21:28

いろんな会社で業務システムの制作に携わったことがありますが、

DreamWeaverというソフトを使ってちまちまテーブルで組んでました。
簡単に見えるけど時間かけるものだと思います。

- 0
- 件

通報する

No.2

回答者： ORUKA1951
回答日時：2012/08/26 12:14

＞その場合cssがかなり複雑になるような気がしました。

　逆にずっと楽になります。
HTM5で書くと、(タブは＿に置換してある)
<!doctype html>
<head>
＿<meta charset="utf-8">
＿<title>サンプル</title>
＿<meta name="description" content="">
＿<meta name="author" content="IRUKA">
</head>
<body>
＿<header>
＿＿<h1 id="title">Your title</h1>
＿＿<nav>
＿＿＿<ul>
＿＿＿＿<li><a href="#">Some</a></li>
＿＿＿＿<li><a href="#">navigation</a></li>
＿＿＿＿<li><a href="#">links</a></li>
＿＿＿</ul>
＿＿</nav>
＿</header>
＿<section>
＿＿<h2>A smaller heading</h2>
＿＿<table>
＿＿＿<tbody>
＿＿＿＿<tr>
＿＿＿＿＿<th>・・・・・・
＿＿＿＿</tr>
＿＿＿＿<tr>
＿＿＿＿＿<td>名前</td><td class="form"><input type="text" size="20" name="name" value=""></td>
＿＿＿＿＿<td>住所</td><td class="form"><input type="text" size="20" name="address" value=""></td>
＿＿＿＿</tr>
＿＿＿</tbody>
＿＿</table>
＿</section>
＿<section>
＿＿<h2>A smaller heading</h2>
＿＿<p>
＿＿</p>
＿</section>
＿<footer>
＿＿<h3>A nice footer</h3>
＿</footer>
</body>
</html>

- 0
- 件

通報する

No.1

回答者： ORUKA1951
回答日時：2012/08/25 19:26

HTMLはレイアウトのために記述するものではありません。

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
これが本当の意味での基本中の基本です。
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
『非視覚系メディアでのレンダリングに際して問題を起こすことがあるため、単に文書内容を整形する目的だけで表を用いるべきでない。 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )』あたりを読むこと。

　この場合は、明らかに表データですから表でマークアップしても問題ありません。ただし、（テーブルを何重にも入れ子にし）なくても、ひとつのtableで可能です。

　テキストエディタで作成するなら、エクセルなどの表計算ソフトで表を作成し、一旦tsvなりcsvで出力して、置換機能を使ってtableに直すのが早いでしょう。

・文書構造とプレゼンテーションの分離がもっとも大事なところです。このようにプレゼンテーションしたいからこのようにHTMLを書くという発想は誤りです。
　表なら表で、リストならリストでマークアップして、それをスタイルシートでどのように表現するか(プレゼンテーションするか)を分けて考えましょう。
→2.4.1 構造とプレゼンテーションの分離 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )

- 0
- 件

通報する

この回答へのお礼

ご回答ありがとうございます。ご指摘にある様にこのレイアウトは表データなのでテーブルで作成
してもよいが１つのtableで可能というのはcssをつかってレイアウトを作るということなのかな
と思ったのですが。その場合cssがかなり複雑になるような気がしました。
また、私はwebシステムは初心者のためどのようにCSSをコーディングすればよいかわかりません
コーディング方法の具体例を大雑把でいいので教えていただけませんでしょうか。

通報する

お礼日時：2012/08/25 21:11

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！