テーブルタグのデメリット

質問

htmlを勉強してまだ間もないです。
テーブルタグを使い始めて便利だなあと思った矢先、HTML4.01規格に準拠できなくなるという文章をサイトで見つけました。
これってどういうことですか？使えないということなんですか？
ちなみに会社のWebを更新する時には、サイトアップというソフトを使わなければならないのですが、ソースを見るとＨＴＭＬ4.01であってもテーブルタグは使えているようです。
他にもデータが重くなるとか、スタイルシートで使うことを勧めるとかサイトには書かれていたのですが、サイトアップではスタイルシートはいじれないのでどうしたものかなと考えています。
アドバイスお願いします。

回答No.5

naokita · ベストアンサー

＞HTML4.01規格に準拠できなくなるという文章をサイトで見つけました。
それは無いです。
tableタグがある以上は、少なくとも向こう10年程度は新しいブラウザでも対応するという事です。

その証拠に、
最新ブラウザでさえも、規格でサポートしていない非奨励タグをいまだにサポートしています。

昔は、ブラウザがCSSをあまり対応出来ていなかったので、
皆がtableレイアウトを使ったものですが、
CSSがフルに対応できるようになってから、
上級者達は、デメリットを考慮し、わざわざtableを使う事が無くなりました。

但し、今後も「表」としては利用されますよ。
だから、しばらくは利用できるって事です。

ですから、スタイルシートが使えないのであれば、
（サイトアップというソフトは知りませんが）
昔風にテーブルレイアウトを使うしかないでしょう。
もしくは、
別のサービスに乗り換えて、CSSを利用するか？

それは、質問者さんのスキルや手間暇・経費での
メリット/デメリットを考えれば答えが出るでしょう。

少なくとも、
テーブルでレイアウトしたサイトと
CSSでレイアウトしたサイトを比較した場合、
CSSがお勧めですよって事で、
表示出来なくなる事もないですし、絶対ダメですって事ではありません。
（※ ウェブの話であって、そのソフトでの話ではありません・・・）

お礼

ご回答ありがとうございます。
端的でわかりやすい説明ありがとうございます。
参考にさせていただきます。

回答No.6

cnkozo

CSSがいいとされていますが、どっこい私はテーブルタグを使ってレイアウトしています。

以前、IEだと同一テーブル上に読み込めない状態があると、そのテーブル全体がまったく表示されませんでした。
つまり、見る人からするとずっと表示されない状態が続き、恐らくすぐに画面を閉じられる状態だったと思います。

しかし、その後FireFoxなどの新しいブラウザが登場し、IEのレベルの低さが白日の下にさらされ、ユーザーにも新しいブラウザが普及しています。
新しいブラウザですと、テーブルが最後まで読み込めていない状態でも、読み込めた状態の部分は表示されるようになっています。
ですので、必ずしもCSSでデザインする必要はないです。

CSSの大きな弱点としては、何らかのトラブルでCSSが読み込めなかった場合、サイトのデザインが大きく崩れるというのがあります。
私の経験上100回に1度くらいはそういうことがあり、そうなったサイトは文字の羅列となり、デザインもあったもんじゃありません。
テーブルですとそういうことはないので、サイトのデザインが大きく崩れたりはしにくいというメリットがあります。
CSS推奨と言われても、これじゃ怖くて使えません。

CSSは文字の指定などにも使えますので、テーブルとCSSを組み合わせるのが現在の常套と考えます。

お礼

ご回答ありがとうございます。
CSSも弱点があるんですね。
なぜか原発で外部電源が全て消失したことが頭に浮かびました。
Web制作もリスク管理が大切ですね。

回答No.4

ORUKA1951

私がHTMLを学び始めたころは、HTML2.0の時代でやがて3.2の時代になり、4.01になりました。
　大変便利なマークアップ言語で、タグでマークアップすれば色々なデザインができました。画像をスライスして並べてメニューを作ったり・・・

　検索エンジンも基本的に作者が登録するタイプが主流で、今のようなロボットもありませんからまったく支障はありませんでした。日本全国でまだ数千しかサイトがない幸せな時代でした。
　3.2あたりでは<BLINK>(Netscape独自で点滅や、<MARQUEE>(IE独自で流れる文字)とかもありました。当時のHTMLはデザインのためにタグを使うのが当然の時代でした。

　しかし、サイトも何万、何億と膨大になり、あわせて検索エンジンも進化したロボット型が主流となると、探している情報がどこにあるかを的確に示すデータベースをロボットは作らなければなりません。そのためには、ネット上にある文書がきちんとマークアップされてないとなりません。
★記事の中で
　・何が見出しで
　・何が引用された文章で
　・何が表であるか
　などなど・・・。
　ところが、字を大きくするために<h1>をつかい、改行に<br>をつかい、行間を空けるために<p>をつかったり、ナビゲーションリンクの変わりに画像<img>をつかったり、ひどいものになるとデザインのために表<table>をつかったりすると、そのページが何の情報を発信しているのかわかりません。

　その反省に立ってHTML4が誕生しました。文章はいくつかの要素でできているはずなのでそれを正しくマークアップしよう。すなわち、
★文章の構造にしたがってマークアップしよう。
　見出しは<h1>～</h2>
　重要な語句は<strong>や<em>
　表は<table>
　引用は<blockquote>や<q>
★本来の目的を外れた使い方はやめよう
　　# メーカー独自拡張のHTMLを使う。
　　# テキストを画像に置き換えて表現する。
　　# 余白制御のために画像を用いる。
　　# ページレイアウトの目的で表を用いる。
　　# HTMLでページを作らずにプログラムに頼る。
　この部分[14.1 スタイルシートの概説 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )]より引用。
★見栄え、プレゼンテーションはスタイルシートに一任しよう。

　このあたりのコンセプトは
構造とプレゼンテーションの分離 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4.1 )
HTMLの略歴 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )
　などにも詳しいです。

★いい加減な情報ではなく、まず仕様書を隅々まで目を通しておくことを強く勧めます。たぶん答えはそこにしかないです。
HTML 4.01 Specification (ja) ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/cover.html )

お礼

ご回答ありがとうございます。
前の方へのお礼でも書いたのですが、制作の前提として背景を知ることはとても大切ですね。
なんで義務教育で歴史を勉強するのか今更ながらわかった気がします。

回答No.3

0909union

＞オーバーライドとはなんですか？

http://search.yahoo.co.jp/search?b=1&n=10&ei=UTF-8&fr=ie8sc&p=%E3%82%AA%E3%83%BC%E3%83%90%E3%83%BC%E3%83%A9%E3%82%A4%E3%83%89%E3%81%A8%E3%81%AF

で見てもらえればわかります。一般用語でもありますが、プログラミングの世界ではこのような意味です。と言うことです。

例えば、HTMLはある意味、インタープリターとしてブラウザからすると動作するし、スクリプトファイルとしても動作します。

これは、上から下へ、左から右へ読み込まれ実行されます。ただ、DOSのBATファイルと違うのは、JavaScriptがオブジェクト指向性のスクリプト言語であり、BATはそうではないので、必ずしも、その通りの順番で実行されるわけではない、と言うことです。

とすれば、公開用のCSSファイルを読んだ後に、自己のファイルを読めばいいわけです。これをオーバーロード。

CSSだと、ヘッダーで指定されたスタイルは、各オブジェクトでの指定が優先され、これをプログラミング的にはオーバーライドと呼んでいます。
<読み込まれるCSSの中身>
DIV { backgorund: black}
<div style="background:red">

だと赤になりますね。どちらも、以前の物の設定はそのままで、最後に読み込んだもの、設定された物が効果があり、その設定が生かされます。もちろんDOM的にも動的に書き換える方法は提供されているので、いくつものオーバーライドのやり方があります。

これらを一まとめにして（本来意味は違うが）、オーバーライドと呼ぶと、ほとんどの方に通じます（プログラムを知らない方でも）。直訳すれば、上書きですよね。本当はちょっと違うが、開発レベルの方が、いろんな会議で説明する場合、意味を拡大して、単語を使う事が多いです。（イベントドリブン＝＞　イベントトラップ　トラップの方が一般的でわかりやしでしょ。イメージしやすい）

提示されたサイトを読むと、ちゃんと書いてありますね。

＞まずはｃ、w3cの提唱するHTML4.01規格に準拠

この「準拠」は、「思想的な問題で」にかかっています。HTML4.01規格には特に定義されていません。

http://www.w3.org/TR/html401/struct/tables.html

が本家です。そこにDTDが記載されているかと思います。それが規格です。DTDもちゃんと勉強してください。

このDTDに、TD,THが、どのオブジェクトの配下に入り、TDの配下にはいるのはどのようなオブジェクトなのか規定しているものです。また、それを補う文が付加され、仕様がきまています（DTDは階層定義と属性の定義、オブジェクトの定義が示されている）。

ここ以外の規定は、それぞれのブラウザのエンジン及びDTDによります。

「思想的な問題で」は、翻訳サイトがあるのでそれを見ればわかりますが、確かに序文とかに記載され、その通りです。CSSでレイアウトする事を求めています。なので私はそうしていますが、

「、HTML4.01規格に準拠できなくなるという」は明らかに意味を取り違えています。そのサイトの文はちゃんと「思想」といっています。

準拠とは、上記の仕様書（W３C）の該当箇所の仕様に準拠するかどうかの問題で、サイトの著作者も、もうちょっと気おつけて「準拠」と言う言葉入れてもらいたかったですね（準拠とは妥当ではない）。

私は今の風潮（tableタグをレイアント（配置）として使わない）は大賛成で昔（１０年以上も前）からそうしてきましたが、説明のしかたとして、限定されるの嫌いです。

問題は、テーブルタグを、「罫線」としてみるか「スプレッドシート」みるかの違いだと思っています。つまり、升目に意味があるかどうかです。ワードの罫線とエクセルの表の違いですね。

社会人初心者だと、この表つくってと言うと、ワードで作るか、エクセルで作るか、かなり悩むようですね。発展性が無い表、例えば連絡書みたいな社内報であれば、ワードで作ればいいし、支店の売り上げであれば、その後の展開を考えれば、エクセルで作る事が望まれます。

これが、HTMLのTABLEタグでもまったく同じ事が言えると言う事です。

わかりましたか？　つまり、経験ですね。

ようは、ケースバイケースであって、それが正しいとは、その状況、環境で決まるのであって、他人が、おかしいというのはおかしい。

示されたテーブルタグの説明も実際に、作って実測してみてください。単に保存して、コピペすれば１０００個（レコード）ぐらい簡単ですよ。

１０年前作っていた時、マシンの性能がわるかったため、JavaScriptとかCSSなんか入れるな！　とよく言われたものです。HTMLタグだけで作れと！。　なんでTABLEタグが重宝されたんですよ。

その残党が生き残っているのでしょう。

そのサイトの説明には穴があり、「レイアウトに使って無くても、TABLEタグはあまり使うな」と言うのが本来の意味です。レイアントとして使うなは、単なる言い訳に過ぎません。

テーブルの仕組みは、スプレッドシートと同じなので、結局、

表は大きくするな

が、このサイトの教訓です。読み違えないように。ただね、前回も書きました、XPマシンの時代なら、そうとも言えるが、Widows７マシンではほとんど関係ないや。

お礼

ご回答ありがとうございます。
なるほど、よくわかりました。
おかげさまでよく理解できましたので、それを踏まえて制作していきたいと思います。
背景を知らないと誤った感覚で制作し続けてしまいますね。
そういう意味でいい機会だったと思いました。

回答No.2

0909union

＞準拠できなくなるという文章をサイトで見つけました。

この文献の元を書かないと、どうもこの質問の信頼性に掛けます。URLを記載したり、著作者を書かないと、この手の書き方だと、通常、本人が、第三者に透過して、発言するやり方によくにています。

また、質問者＝回答者と言うパターンでも使われる手ですね。

＞サイトアップではスタイルシートはいじれないのでどうしたものかなと

だから、どうしたというレベルです。通常、オーバーライド（ト）すれば言いだけの話。

＞データが重くなるとか、

俗に言うXPマシンの時代の話ですね。現在のCSS、JavaScript、HTMLの読み込み量をみれば、TABLEタグを２０個つかってもたいしたことのない、影響です。そでこ、１個、2個使ったところで、１、２秒とかのれべるです。

つまり、影響するファクターとして、サーバーマシン＆ネットの状態（送受信問題）と、アンチウィルス、ブラウザ、及びクライアントマシンのパフォーマンス（クライアントマシンの処理能力）です。

とくにブラウザは軽量なIE以外の（オペラが軽いかと言う問題もあるが）ブラウザと、IEなどの超ヘビー級重量打線との処理の違いを認識すべき問題です。

重量級は、マルチコアで使って初めて本領を発揮します。逆に軽量級のブラウザでは、XPマシンレベルで快適に動作してくれます。つまり、CPUの処理能力とメモリーがたくさんあれば、

たかだかTABLEタグが１００個あったところで、

たいした問題ではない

と言うことです。なんていってもすぺて分散処理されるので、現在だと２０個のCPU（１０コア+ 10スレッド）で処理するわけですから、その程度の問題は、戦車に玩具のブリキ戦車で立ち向かうのと同じです（Xeonであれば、４０CPUとなる）。これは特に

IEで最適化されています。

問題なのは、それ以外のファクターで、最近だったのか、アドオンソフトのパフォーマンスの指摘を各ブラウザのメーカーが指摘しています。問題はそこです。

さらに、問題なのは、アンチウィルスのハックですね。このハックしている時間もエンドユーザーからするとブラウザのパフォーマンスのせいにされています。まず正確に測るなら、OFFにしてから計りましょう。

その辺の環境変化に対して、理論から提唱しても、何の特にもなりません。最新マシンで実測した結果を述べてもらってください。

質問者も手に入りやすい、６コア１２スレッドマシンでメモリーを８GBつんだ環境で64ビットをネイティブで対応しているブラウザ（IE）で実測したらいかかでしょうか？

これで32ビットブラウザと比べ、さらに廉価版である２コア又は４コアのマシンで同じように実験すれば、何が正しいのかわかるはずです。

ここが肝心ですが
ただ、TABLEタグを配置するタグとして使うやり方は、趣旨に合わないといわれるが、そんな事はない。私は当初から使ってはいなく、CSS（１．０の時か）で行ってきたが、”表”として定義されていると、よく言われるが、

その表自体、よく考えてみると、「どこに何を表示する」と言う事を命令するのであって、データーの一覧を表示するためタグではない。データーを表示するためであれば、マイクロソフトが提唱したDHTMLのように又はC#などのように、データーとバインドすることを最初から定義していないとおかしい。

例えばTBODYなどである。またこれに対するDOMもレコードとして最初から定義していないとおかしい。

つまり最初から、セル（データーの最小単位）の配置として定義されているのあって、それを拡大した解釈に過ぎないのが現在の使われ方。

＞ＨＴＭＬ4.01であってもテーブルタグは使えているようです

消える事は、どこにも記載されていませんし、うわさにもありません。もちろん違う枠組みでは必要性が問題視されていますが。

お礼

ご回答ありがとうございます。
準拠については、以下のサイトに書かれていました。
http://ningyokan.nisfan.net/essay/w003.html
オーバーライドとはなんですか？
初めにも記述させていただきましたが、まだ勉強中の為それを考慮していただけると助かります。

回答No.1

めとろいと（@naktak）

HTMLは便利なもので、ブロックレベル要素、インライン要素を気にせず、
更には本来の用途を無視して利用することが出来てしまいます。

<table>は、本来、表を構成する為に用いるものであって、レイアウトを
構成するものではありません。

区切りを意味する<div>、<span>などを利用して、独立した複数のコンテンツを
生成し、更に、CSSによってレイアウトを構成するという手順が本来通る道です。
本来HTMLは、文書構造を決定するものであり、レイアウトを決定するものでは
ありません。

また、勘違いしないようにお話すると、<table>を使うのが悪なのではありません。
本来の用途とは異なった用途で<table>を利用することが悪なのです。
それは<table>に限ったお話ではありません。

ここで疑問になるのが、<table>でも出来るじゃん！別に出来るんだから
それでいいじゃん！です。

<table>だけで構成されるHTMLは、デメリットがいくつかあります。
　・変更が必要になると、途端にメンテナンス性が悪くなる。
　　（いくつかのコンテンツが密結合であり、独立性がない為）
　・ブラウザに組み込まれているレンダリングエンジンがHTMLを解釈して
　　ページを表示する為、<table>を乱用すると、途端に表示が遅くなる。
　・文書構造としておかしい為、SEOとしては好ましくない。

サイトアップっていうのはこれのことですか？
http://www.siteup-system.com/cgi-bin/siteup_system/siteup.cgi?category=1&page=0

どんだけの素晴らしいソフトウェアなのか知りませんが、全てを<table>で構成してしまう
ようなソフトウェアなら、それはもう廃れたものですよ。
それでもそのソフトウェアで作成したページを利用したいというならば、諦めるしか
ありません。
SEO診断とかあるくらいなんだから、CSSくらい対応してそうな気がしますけど。

お礼

ご回答ありがとうございます。
サイトアップはすばらしくありません。やりにくくてしょうがないです。
別途、ゼロベースから作り直しているのですが、それが完成するまでの間は更新にサイトアップを使わざるを得ない為、CSSを使わずhtmlのみでなんとかならないかと今回の質問をさせていただきました。
今のところテーブルでレイアウトするしかなさそうな感じがしております。