2014年に正式勧告予定のHTML5!これからのHTML5とコーディングのルールおさらい
HTML5は2008年からスタートして、ブラウザが各種実装していきました。
特にスマートフォンのサイト制作では必須になっていますよね。
でも、実はまだ「草案」、つまりまだ仕様を確定していない原案の状態なのは知っていましたか?
まだ確定していないものを使っているというのはすごく不思議ですよね。
HTML5は2014年に正式勧告予定
実は、今年(2014年)に正式勧告予定です。
この正式勧告が行われると、その時点で世界的な標準化が完了することになります。
ここから先の機能追加はHTML5.1以降のバージョンとして扱われる予定です。
実は2月にも仕様が変更されています
HTML5はまだ草案の状態だけに、仕様がまだ確定していません。
2月にも草案が更新されており、大きいところでいうと、templateという要素が追加になっていますね。
XHTMLからHTML5への変更点
個人的にはHTML4.01やXHTMLとくらべ、タグがすっきりしているのがHTML5の印象です。
特別なことをしないのであれば、書かなくても良いよというものが多いですね。
内容を省略できるタグ
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">↓↓↓↓↓
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">↓↓↓↓↓
<html lang="ja">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />↓↓↓↓↓
<meta charset="urf-8">
<script src="*****.js" type="text/javascript"></script>↓↓↓↓↓
<script src="*****.js"></script>
<style type="text/css"></style>↓↓↓↓↓
<style></style>
終了タグを省略できるタグ
また、いくつかのタグは終了タグを省略しても良いことになっています。
終了タグを省略して良いのは以下のとおりとなっています。
例えばliだと以下のような感じですね。
<ul> <li>テスト1</li> <li>テスト2</li> </ul>↓↓↓↓↓
<ul> <li>テスト1 <li>テスト2 </ul>
記述自体を省略しても良いタグ
最初にを書いて、
を書いて・・・というのが慣れてしまっていますが、実はHTML5はこのような部分自体、書かなくても良いとされています。記述しなくても良いタグは以下のとおりです。
例えば、以下のようなXHTMLをHTML5で書き直すとこうなります。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>タイトル</title> </head> <body> <p>テキストテキストテキスト</p> </body> </html>↓↓↓↓↓
<meta charset="urf-8"> <title>タイトルです。</title> <p>本文です。
びっくりするくらいシンプルになりますね!
終了タグが必要のないタグ(末尾の「/」含む)
<img>タグや<hr>タグのような終了タグが必要ないタグは、XHTMLでは「<br />」や「<hr />」と記述していました。
しかし、HTML5では「/」は特に必要なくなっています。
終了タグが必要のないタグは以下のとおりです。
使用例としては以下のとおりです。
<img src="test.jpg" alt="" /> <hr /> <input type="submit" value="送信する" />↓↓↓↓↓
<img src="test.jpg" alt=""> <hr> <input type="submit" value="送信する">
新しく追加されるタグ
新しく追加されるタグは便利なものが多いので、クロスブラウザでの問題(大体IEですが…)さえ解決すれば、とても役立ちそうですね。
追加されるタグは以下のとおりです。
廃止されるタグ
HTML5からは非推奨とされるタグもあります。
ブラウザはXHTMLやHTML4.01等も対応しているので、表示はできるかと思いますが、仕様上は正しくない書き方となります。
最後に
まだまだ正式勧告前なので、仕様が変わる可能性はありますが、現時点は上記のような感じです。
あなたは全部知っていましたか?
PCサイトではまだまだXHTMLがメインとなっていますが、2014年の正式勧告を境に、そろそろHTML5にシフトしていくころなのかと思っていますので、しっかりと覚えて置きましょう!
HTML5の詳しい書き方等はまた後日書きたいと思っています。