[1] HTML では、void要素と外来要素の末尾 (> の直前) に / (認められている斜線permitted slash) を置くことができます。これは当該要素が self-closing であること、すなわち内容が空で終了タグがないことを表します。

[9] void要素においては、この斜線はただの飾りです。偉い人にはそれがわからんのです。

[22] <br/> や <br /> は、 <br> とまったく同じ意味です。 斜線スラッシュには意味がありません。

[10] 外来要素においては、この斜線がなければ終了タグまでが内容とみなされ、 あれば終了タグがなく内容は空です。

[23] <svg/> は <svg></svg> とまったく同じ意味です。また、 <svg><g/></svg> と <svg><g></g></svg> も同じ意味です。

仕様書

構文

[29] void要素と外来要素では、開始タグの > の直前に / を1つ挿入できます >>8。

[30] 外来要素の / は、当該開始タグが self-closing であることを表します >>8。self-closing な開始タグを持つ外来要素は、 内容と終了タグを持てません >>31。

[39] XML ではこれに相当する構文は空要素タグと呼ばれています。

構文解析

[32] 開始タグ字句と終了タグ字句は、 self-closing flag を持ちます >>28。その初期状態は未設定で >>28、 タグの構文解析中に / が現れると設定されます。

[33] 開始タグ字句の self-closing flag は、木構築器によって acknowledge されることがあります (void要素や外来要素で acknowledge されるように規定されています)。 acknowledge されない場合は、構文解析誤りです >>28。

[36] void要素でも、無視される場合 acknowledge されず、 構文解析エラーになります。例えば次のような場合です。
  • [38] in body の <frame/> や <col/>
  • [40] in frameset の frame 以外のvoid要素
  • [41] in body (select 関係の素片構文解析) の input
  • [37] form 内の <isindex/>

[34] 終了タグ字句で self-closing flag が設定されている場合も、 構文解析誤りです >>28。

[35] 木構築器は、外来要素を作った時、 self-closing flag があれば即座にその要素を開いている要素のスタックから除去します。

歴史

[11] HTML で認められている斜線が使われるようになったのは、 90年代末に XML (XHTML) への移行が謳われるようになった頃からです。 XML は DTD 無しで構文解析を可能とするため、構文上空要素とそれ以外を区別できる必要があり、 空要素タグ構文が導入されました。

詳しくは XHTML、空要素タグを参照してください。

[17] 当時の実装は必ずしもこの構文に対応していませんでしたが、 / の前に必ず空白を入れることで、未知の属性とみなされるのか、 どのWebブラウザーでも意図通り無視されることが知られており、 空要素には空白と / を挿入するのが新しい良い慣習と宣伝されるようになりました。

[18] しかし00年代も中頃になると XML への移行が失敗だったことが徐々に明らかになります。 依然として / を挿入するのが良い慣習と言われていましたが、 実際には何の意味もなしておらず、 HTML5 は (XHTML を text/html で送信することは間違いだと説く Ian Hickson が編集していたこともあり) この斜線を認めていませんでした。

[19] とはいえ斜線は意味がなくてもかなり広範囲で使われており、 プログラミング言語のライブラリーなどが斜線を挿入することも多くありましたから、 これを禁止するのは非生産的でした。そのため2006年12月には、 void要素で斜線を使うことを認めるようになりました >>6, >>4。 この斜線は認められている斜線permitted slashと呼ばれました >>6。

[20] ただし、当時の HTML5 には次のような注意書きが含まれていました >>6。

This character has no effect except to appease the markup gods. As this character is therefore just a symbol of faith, atheists should omit it.

この文字はマーク付けの神々を鎮める以外には効果を持ちません。 つまりこの文字はただの信仰の証であり、 無神論者は省略するべきです。

[21] >>6 のコミットメッセージからもわかるように、 HTML に XML の構文を意味なく持ち込む“邪教徒”への皮肉が込められています。 この時代にはまだ (実際には HTML なのに) XHTML の構文を用いることを良い慣習と考え、 布教する自称専門家が数多くいました。

[24] なお、斜線が認められたのはvoid要素のみでした。 それ以外の要素でも斜線は (構文解析誤りになる以外は) 無視されるのは同じですが、 無視されても内容が空とみなされるvoid要素とは違って、 普通の要素は無視されて内容も存在するので、認めたとしたら混乱の元でしかありません。

[25] 当時は Mac OS の Dashboard のウィジェットとして使われる WebKit や Opera Widgets で使われる Presto で、 script 要素で斜線を使うと空要素タグとみなされる (こともある) 実装がなされていました。 これは便利ではあるので、標準化してほしいとの要望も度々寄せられましたが、 Web互換ではないため却下されています。 script 要素の歴史の項も参照。

[26] 2008年4月には SVG と MathML を直接HTML文書に埋め込めるようになりました >>5, >>7。 この時外来要素にも斜線が認められるようになりました。 この外来要素の斜線は、 XML の空要素タグと同じく、 実際に内容や終了タグの有無に影響するものとして規定されています。

[27] XML の機能そのものが一部とはいえ HTML に取り込まれてしまったからか、 >>20 の記述はこの時削除されてしまいました。また、認められている斜線という用語もなくなっています >>5。

メモ

[13] drry+@-> view-source:xhtml:empty tags on Fx2 (2007-02-25 20:03:55 +09:00 版) http://blog.drry.jp/2007/02/05/view-source-xhtml

[14] >>13 Firefox 1.5.0.10 で text/html の文書で空要素タグを見ると赤くなる。

[15] ま、 HTML 5 で斜線が一応認められることになった以上、 Firefox もそのうち赤くしなくするんじゃないですか?

[16] はてなアイデア - 【Invalid html】link要素タグの終了部分 /> のスラッシュを外してほしい ( 版) http://i.hatena.ne.jp/idea/14889