td, th, tr, liなどの要素に関して、【HTML4.01の仕様としては】省略していいことになっていることは知っています。
Index of the HTML 4 Elements
http://www.w3.org/TR/1999/REC-html401-19991224/i …
ただ仕様云々の問題ではなく、現実問題として省略しないほうがいいケースがあるのか気になったので質問させていただきました。
質問は以下です。
・省略するとレイアウトが崩れるブラウザがあるのでしょうか?あるのならブラウザ名・バージョンを教えてください。
・省略すると機能的に問題が発生するケースがあるのでしょうか?あるのなら具体的な現象、ブラウザ名・バージョンを教えてください。
・機能・レイアウト以外に省略しないほうがいい理由があるのでしょうか?あるならその理由を具体的に教えてください。
・HTML5ではどうなっているのでしょうか?【結構知りたい】
※XHTMLは書くつもりはないのでこの質問の対象外としていいです
よろしくお願いします。
No.2ベストアンサー
- 回答日時:
HTML5 でどうなっているのか結構知りたいということであれば, 自分で調べてはどうでしょうか. 他人に聞くよりも確実だと思うのですが....
もちろん HTML5 そのものはまだ確定していないので, 今後変化する可能性があることは念頭に置く必要があります.
参考URL:http://www.w3.org/TR/html5/syntax.html#optional- …
この回答への補足
今回の質問を通して以下のことが分かりました。
・HTML5でも省略可とされている
・省略するとブラウザの処理速度が向上する(IE8/FF/Chrome)
・ファイルファイズが小さくなり当然ネットワーク転送速度も速くなる
・閉じタグ可の要素が分からない人はとりあえず省略しないほうがいい
・遅くなるブラウザも昔はあったのかも(未確認)
・解釈のできないブラウザも昔はあったのかも(未確認)
皆さんありがとうございました。
今まで私は、閉じタグが必要かどうかなどはDTDをみて判断していたのですが
HTML5ではDTDがないとのことで何を参照していいのか分からない状態でした。
しかしご提示していただいたページではっきりと把握することができました。
HTML4系と同じで閉じタグは省略可となっているようですね。
「This is a work in progress!」とのことではありますが…。
参考になりました。ありがとうございました。
No.4
- 回答日時:
>・機能・レイアウト以外に省略しないほうがいい理由があるのでしょうか?あるならその理由を具体的に教えてください。
「このタグは省略できたかな、どうだったかな」と迷うぐらいなら「全部つける」にしておいた方がかえって楽。この質問のような悩みも生まれないわけです。
No.3
- 回答日時:
>強いて言うと「ブラウザに計算を強いること」という問題があるのですね。
>(ブラウザによるかもしれませんが)
ブラウザにとって、すごく負担になるのは確実です。そのためにXHTMLが推進された経緯があります。また、他のアプリケーションから再利用しにくいのも問題でした。いわゆる整形式ではないですから・・・。
一方で、タブ、改行など空白文字列を読み飛ばすのはまったく負担になりません。
そのために、私はHTMLであっても整形式で書くことにしています。特に長大なHTMLの場合、タブできちんとインデントさせれば、わかりやすいこと。テキストエディタで
^\t\t\t<td>([^<]*<td>$
と、探し出したりするのが簡単、機械的にできる。表の場合、いったんexcelで作成したCSVをPerlでtableに直すときも、処理が機械的に出来る。
とか・・・。
HTML5とHTML4に、このあたりについてはほとんど変わりがありません。新しい要素が追加されたこと。特に構造化を示すタグは要チェックですね。それもあり、数年前から
<body>
<div class="header">
</div>
<div class="section">
・・・と言う風にしてます。
★HTML5 における HTML4 からの変更点 ( http://standards.mitsue.co.jp/resources/w3c/TR/h … )
この回答への補足
# ブラウザにとって、すごく負担になるのは確実です
とのことですが、この点が抽象的でわかりませんでした。
td要素5万のテーブルのレンダリングを実験してみましたが、
IE/FF/Chromeではすべてで省略したほうが速く処理できました。
下記の点を補足で教えてください。
・根拠はなんですか?書籍?サイト?実績値?予想?
・閉じタグ省略時の負担について参考になる書籍・サイトの紹介など
・負担とは何ですか?処理時間?CPU使用率?メモリ使用量?
・負担になる処理は何ですか?レンダリング処理?DOMアクセス?
・「ブラウザ」とはなんですか?(種類やバージョンなど、あくまでも昔の話なのか今でも問題なのか)
よろしくお願いします。
No.1
- 回答日時:
なぜ省略してもよいかと言うと、
<td>に続いて、</tr>や<td>が来るはずないからです。それらが続いて現れれば、</td>が省略されているとみなされるからです。手で入力するときに楽だから。
DOM上では問題もあります。--HTML5では、そのようなときの解釈についても厳密に定義されますから問題ありませんが、それより前のHTMLでは、ブラウザによって解釈の違いがありえます。
ただ、現在省略可能となっている要素に関しては、問題ありません。ただ、ブラウザに計算を強いることですかね。
私は一切省略しませんが、それは、タグの閉じ忘れ出はなく、階層を忘れてしまうからです。
<table summary="section">
<tbody>
<tr>
<td>
<table>
<tbody>
<tr>
<td>
</td>
</tr>
</tbody>
</table>
<td>
</tr>
</tbody>
</table>
なら、ミスしません。
・省略するとレイアウトが崩れるブラウザがあるのでしょうか?あるのならブラウザ名・バージョンを教えてください。
・省略すると機能的に問題が発生するケースがあるのでしょうか?あるのなら具体的な現象、ブラウザ名・バージョンを教えてください。
いずれも、ありません。それがブラウザに対する仕様でもありますから。問題は、誤ったマークアップのときの処理は異なると言うことです。(終了タグが省略可能な場合の省略は
誤っていません)、誤ったマークアップを防ぐためにきちんと閉じる癖をつけるということです。また、以前、HTMLは、HTML4.01が最後の仕様で、今後はすべてXHTMLになるとされていましたから、そうなると閉じる癖を付けておかなければ・・
しかし、世の中はHTML5に向かっています。HTML5では、合わせてXHTMLの仕様も加わりますから、XHTML構文を使用する場合は閉じなければなりません。
※XHTMLは書くつもりはないのでこの質問の対象外としていいです
ですが、XMLから、XSLTを使ってXHTMLに変更するなど、手抜きのためにはXHTML(XML)も知っておいたほうが・・というか、XHTMLのほうが慣れれば作るのは楽ですね。
この回答への補足
<table summary="section">
<tr><td>
<table>
<tr><td><td><td>
<tr><td><td><td>
</table>
</table>
私の場合こんな感じで書くことが多いです。
階層が少なくなり、またシンプルにコンパクトに書けるので。
コーディング基準に明記されてる場合でもない限りは自由なので
人によって好みが大きく分かれるところですよね。
レイアウト・機能的に問題が発生することはないとのことで安心しました。
ネット上では特に理由の記述なく「書いたほうがいい」とだけ書いてあるサイトがいくつかあったので。
強いて言うと「ブラウザに計算を強いること」という問題があるのですね。
(ブラウザによるかもしれませんが)
# 以前、HTMLは、HTML4.01が最後の仕様で、今後はすべてXHTMLになるとされていましたから
# HTML5では、合わせてXHTMLの仕様も加わりますから、XHTML構文を使用する場合は閉じなければなりません。
そうなんですか。今後のHTML5の仕様策定の動向を観察し考慮したいと思います。
# XMLから、XSLTを使ってXHTMLに変更するなど、手抜きのためにはXHTML(XML)も知っておいたほうが
XSLTは多少使ったことがありますが、部分的な抽出に使ったことがあるくらいであまりダイナミックに使ったことはありません。
よく使うかどうかは、人によると思いますが今後検討したいと思います。
参考になりました。ありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- 英語 少し語弊があったので、もう一度質問させていただきます College is (a place) wh 1 2022/12/09 19:44
- 英語 少し語弊があったので、もう一度質問させていただきます College is (a place) wh 1 2022/12/09 15:20
- 英語 英文についての質問です。 The 23 million Taiwanese people live 1 2023/07/06 10:51
- 英語 関係副詞の 先行詞の 省略について質問です 調べたところ、省略可能な先行詞は whereに対して「t 1 2022/12/08 19:31
- Windows 10 dアカウントでログイン 5 2022/11/25 17:26
- 英語 以下の英文法の四択問題について質問です。 The Internet service provider 1 2023/02/01 19:50
- 英語 関係副詞の省略について 関係副詞の省略って全て「関係副詞that」に置き換えてから省略するのですか? 1 2022/12/17 14:39
- 英語 関係副詞の先行詞の省略について質問です 調べたところ、省略可能な先行詞は whereは「the pl 1 2022/12/07 22:00
- 高校 高2数Bの質問です。 ベクトル PB+DS-PS-XB=DX を証明する問題です。 →は省略させて頂 2 2022/05/15 01:03
- 地理学 東京都は「東京」、大阪府は「大阪」、静岡県は「静岡」。でも、北海道が「北海」でないのはなぜ? 5 2022/08/16 10:22
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
テーブルの行を折りたたみたい...
-
tableにul,または,olを入れられ...
-
テーブルを2つ横に並べる
-
cssで、表示されるテキストによ...
-
TRタグの余白をcssで設定するには
-
tableタグ内で、空白セルでも罫...
-
テーブルのヘッダとボディの幅...
-
nth-childをtrとtdに同時に使う...
-
<table>の<thead>をposition:fi...
-
テーブルの行の高さを指定する...
-
テーブルの任意の列を非表示に...
-
中に<table></table>が使えるア...
-
tdなどの閉じタグは省略しても...
-
テーブルのセルに画像をピッタ...
-
テーブルの外側の線を消す
-
tableの要素(tr、td)に一...
-
テーブルの装飾
-
HTML <td></td>タグ セル内余...
-
width指定したTDでwhite-space:...
-
テーブルをスクロールさせると...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
テーブルの行を折りたたみたい...
-
tableにul,または,olを入れられ...
-
テーブルの任意の列を非表示に...
-
TRタグの余白をcssで設定するには
-
テーブルのヘッダとボディの幅...
-
cssで、表示されるテキストによ...
-
テーブルのセルに画像をピッタ...
-
文字列が入っているtdを削除せ...
-
逆L字の表(table)組み
-
テーブルの表示がずれます
-
HTML <td></td>タグ セル内余...
-
HTMLのテーブルで桁をそろ...
-
中に<table></table>が使えるア...
-
スタイルシートで colspan=3と...
-
htmlのtable内に画像
-
ホームページ 表の上の余白を...
-
テーブルタグのセルの幅の一部...
-
テーブルの行の高さを指定する...
-
CSSだけで<table>の<td>や<tr>...
-
EXCELからhtmlへの変換で罫線が...
おすすめ情報