HTMLタグの最後についているスラッシュについて疑問を抱いたことはありませんか？<meta なんちゃら />とか<input ほにゃらら />とか<br />とか。スラッシュがついてることもあればついてないこともありますよね。
この記事ではHTMLタグの最後のスラッシュの謎を解明します。
結論: スラッシュは不要
現在のHTMLの仕様(HTML Living Standard)において、HTMLタグの最後のスラッシュは不要です。
ただし、スラッシュをつけてもOKです。どちらでも文法的には正しいということになっています。
なぜそうなったのかを知るには、HTMLとXHTMLの歴史を紐解く必要があります。
無料で利用できるプログラミング学習サービスをお探しならば Code Lesson
はいかがでしょうか。プロのエンジニアが監修した学習ロードマップで効率的に学習、AIに質問、最後にクイズで理解度をチェックできます。
スラッシュがつくことがあるのはどんな要素か
歴史のお勉強の前に、どんなHTMLタグにスラッシュがつくのか確認しておきましょう。
終了タグのある要素
多くのHTML要素は開始タグと終了タグの両方を持ちます。例えば、段落をあらわす<p>要素やリンクをあらわす<a>要素です。
<p>これは段落でーす。</p>
<a href="https://example.com/">リンクでーす</a>これらの要素は終了タグ</tag>にスラッシュがつきますが、このスラッシュは今回問題にしている<tag />←これとは別物です。
終了タグのない要素
HTMLの要素には終了タグを持たないものがあります。開始タグと終了タグの間に入れる内容がない要素がこれにあたります。このような要素を空要素といいます。
<meta charset="utf-8">
<input type="text">
<br>これらのような空要素が、タグの最後にスラッシュをつけたりつけなかったりする要素です。
つまり、こんなふうに書くこともできるわけです。
<meta charset="utf-8" />
<input type="text" />
<br />主な空要素は次のとおりです。
<area><base><br><col><embed><hr><img><input><link><meta><param><source><track><wbr>
では、なぜスラッシュをつけたりつけなかったりするのでしょうか。どっちかに統一しろよと思いませんか？
空要素のスラッシュが必須の時代があった
HTMLの空要素のスラッシュの謎は、HTMLとXHTMLの歴史に隠されていました。
まず、初期のHTMLからHTML4までは空要素のスラッシュは不要でした。スラッシュがついていてもエラーにはなりませんが無視されます。
2000年にHTML4の後継になるはずだったXHTML 1.0が勧告されます。このXHTMLはXMLを元に作られていて、HTMLと比較して文法が厳格という特徴があります。このXHTMLでは空要素の最後に必ずスラッシュをつけなければなりませんでした。←はい、これ。
しかしながらXHTMLは普及せず、2014年にHTML5が勧告されます。HTML5では、空要素にスラッシュをつけてもつけなくても文法的に正しいということになっています。XHTMLとの互換性に配慮してそうなっているんだと思います。
現在はHTML5は廃止されHTML Living Standardが標準規格となっています。HTML Living Standardでも、空要素のスラッシュはあってもなくてもOKです。
というわけで、XHTMLのせいでスラッシュがついたりつかなかったりということが起きているのです。
さいごに
さて、HTMLタグのスラッシュの謎を解き明かすことができました。結論としては、空要素にスラッシュは不要ということになります。ただし、スラッシュがついていても間違いではありません。
スッキリしたので私は酒を呑みます。
でわでわ
コメント