HTMLの空要素の正しい書き方を教えてください

Question

HTMLを書く際に空要素はタグを閉じる直前に/を書くイメージがあります。
inputタグやimgタグです。
しかし、brタグだけは/をつけずに書いているイメージがあります。
現にこのようにbrだけつけない書き方ををよく見かけます。

空要素を書く際に/があってもなくても動きますが実際のところはどのように書くのが正しいのでしょうか？
/で閉じるべきか違うのか、またはbrだけ特別なのか...
厳格なルールとしてはどうするのが正しいのかわかりませんので教えてください。

Answer 1

XHTMLの場合、記載されるコードはXMLとして適切なものである必要がありました。
つまり、タグは必ず開始と終了があり、空要素の場合はそれを示すことが必須でした。
そのため、
<tag></tag> <tag /> は同義で、こうでなければなりません、でした。

HTML5の場合、空要素は <tag> のように /> を付けないのが正解です。
ただしついていても「間違いではない」という仕様になっています。
<tag></tag> と言った表記はNGです。

詳しくは「空要素」と HTML4.01 HTML5 XHTML あたりを組み合わせて検索してみてください。

なお、brだけ特別、と言ったことはありません。

Answer 2

＜ルール１＞
HTMLでは空要素の終了タグは必要ありません。ところが
XHTMLでは次のように終了させなければなりません。

<hr /> （半角スペースに続けて / を入れます）

＜ルール２＞
HTML5では最後の/はつける必要はありません。
（がついていても問題ありません。）

＜アドバイス＞
いずれにしろ可能ならば「全部つける」仕様か「全部つけない」仕様
に統一した方が混乱は招かないと｢思います。

＜ご参考＞
空要素を持つ一例
<area> <base> <basefont> <br> <col> <frame> <hr>
<img> <input> <isindex> <li。nk> <meta> <param>

Answer 3

一時期書きましょうという流れになりました（XHTML）が、書かなくて良くなりました（HTML5）。
1つのHTML文書に空要素の/ありとなしが混在していても問題はありませんが、
コーディングルールとしては空要素に/を入れる・入れないを統一した方がいいと思います。
無しで統一するのが現代的です。

Answer 4

<img />や<br />のように最後にスラッシュを付けるのは、XHTMLという規格に則ったものです。

現代のHTML5では、最後のスラッシュはなくてよいということになっています（あっても悪影響はありませんが、わざわざ書く必要はありません）。

Then, if the element is one of the void elements, or if the element is a foreign element, then there may be a single "/" (U+002F) character. This character has no effect on void elements, but on foreign elements it marks the start tag as self-closing.

（HTML5勧告 §8.1.2.1 Start tags）

Answer 5

基本的にHTMLでは空要素に閉じタグは不要です。
閉じタグが必要なのはXHTMLで書かれている場合のみです。

XHTMLはHTMLをXMLの文法で書き直したもので、
XMLは閉じタグが必須なのでその文法で書いたXHTMLも閉じタグが必要です。

しかし閉じタグがなくてもブラウザが補完してくれるので混在してしまったりしていますね。
XHTMLなのに一部を触る人がHTMLで書いちゃったり、
XHTMLからHTML5にする際に動くからとそのまま持ってきちゃったりで。