[HTML5] 閉じタグ省略可能になってた
仕事で既存コードを修正中、タグを閉じていない HTML コードを見た。
タグ閉じてないじゃん！と思ったけど、 HTML5 になってから閉じタグが省略できるようになっていた。
閉じタグを省略すると、ファイルサイズが小さくなり、読み込み（表示）速度が改善することもある。
閉じタグがないタグ
開始タグしかなく、閉じタグがない（つけてはいけない）要素のことを「空要素（ Void または Empty Elements ）」と呼ぶ
br, hr, img, input, meta, area, base, col, embed, keygen, link, param, source空要素は、は、<br />や<hr />という最後にバックスラッシュをつける書き方があり、HTML4までは非推奨だが使えていた。（確かにコードによって付いていたり、付いていなかったりする）
しかし、XHTMLの影響でバックスラッシュありの記述方法がすでに浸透しており、HTML5からは正しい文法となったようだ。
閉じタグを省略できるタグ
p, dt, dd, li, option, thead, tfoot, th, tr, td, rt, rp, optgroup, caption<table>
<thead>
<tr>
<th>th1
<th>th2
<th>th3
<tbody>
<tr>
<td>td1-1
<td>td1-2
<td>td1-3
<tr>
<td>td2-1
<td>td2-2
<td>td2-3
</table>ただし、省略には条件がある。
例えば、thとtdタグは、thまたはtdタグが続く、または親要素がそれ以上含まれていない場合のみ省略可能。
開始タグも閉じタグも省略できるタグ
開始タグの省略は、「要素が存在しない」ということではない。HTMLファイルから省略しても、ブラウザ側で付け足しといてくれるということ。
html, head, body, tbody, colgroup省略して書くとこのようになる。コードが短くなった！
<!DOCTYPE HTML>
<meta charset="utf-8">
<title>Hello</title>
<h1>h1 Title</h1>ただし、次の場合には省略できない
- html開始タグ（
<html>）:html要素がコメントで始まる場合<!DOCTYPE HTML> <html> <!-- html要素がコメントで始まる場合はタグを省略できない --> <head>・・・・・・・ </html> - html終了タグ（
</html>）:html要素の直後にコメントがある場合 - head開始タグ（
<head>）: このタグ直後が要素ではない場合（head要素が空、または直後に要素が続く場合、省略可） - head終了タグ（
</head>）:head開始タグの後（head要素内の始まり）にコメントまたは空白文字がある場合<!-- タイトルタグの左に空白がある場合（うっかり全角スペースが入ってしまったとか）、head開始と終了タグは省略できない --> <head> [全角スペース]<title>Hello</title> </head> - body開始タグ（
<body>）: このタグ直後にコメントまたは空白文字がある場合、body要素がmeta、link、script、style、templateのいずれかで始まる場合（body要素が空の場合、省略可） - body終了タグ（
</body>）:body開始タグの後（body要素内の始まり）にコメントがある場合
以上を踏まえると、これだけでも OK のはず
<!DOCTYPE HTML>
<title>Hello</title>これを、Validator.nuでValidateすると問題ないが、W3C Markup Validation Serviceで Check すると、 html タグの lang を指定するよう「 Warning 」が出る。（「Error」ではないが、<html lang="ja">とか書いといた方がいいのかも）
html って言ってるくらいだから、当たり前すぎるけど、 html タグ省略できるんだ。。。
10年後の若い技術者は、「html タグなんてあったんですねー！」とか言いそう。
消えたタグ
center, font, blink, strike, s, u, bgsound, marquee, applet, acronym, dir, frame, frameset, noframes, isindex, listing, xmp, noembed, plaintext, rb, basefont, big, spacer, tt廃止にはなったが、今のところ使える。
PHP の PDF 作成ライブラリ「 TCPDF 」では、廃止になったタグが使える（というかそれしか使えない）。