HTML5の宣言文~<head>内の記述

HTML4.0xやXHTMLではhead内の記述が長かった(私が覚えきれてないだけ)のですが、HTML5の宣言文はすごくスッキリしています。

例えば、文字エンコーディングを指定するmeta要素の部分だけを見ても

HTML4.01での文字エンコーディング

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

HTML5での文字エンコーディング

<meta charset="utf-8">

これくらいなら覚えられますw

HTMLファイル初期設定

HTML5-宣言文~head内記述(簡易版)

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title></title>
</head>

また、外部javascriptやスタイルシートの読み込みの記述も簡素化されています。

外部ファイルの読み込み

<link rel="stylesheet" href="style.css">
<script src="foo.js"></script>

とりあえずHTMLファイルを作るときにコピペで楽をするため用

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title></title>
<link rel="stylesheet" href="style.css">
</head>

<body>

</body>
</html>

一応説明すると、
2行目、呪文ですw viewportは任意に指定できますが、指定した場合は表示崩れに気をつけてください。
7行目、CSSの読み込みを入れました。CSSの名前が違う場合は修正してください。

スタイルシートを直接書き込む場合

<style>/* --css-- */</style>

javascriptを直接書き込む場合

<script>/* --javascriptコード-- */</script>

スタイルシートの『type=”text/css”』、javascriptの『type=”text/javascript”』、つまりtype属性は省略してもOKになりました。

古いバージョンのIE(Internet Explorer)でもHTML5の新要素を使えるようにするには?
<!--[if lt IE 9]>
<script type="text/javascript" src="./js/html5shiv.js"></script>
<![endif]-->

注意:このjavascriptライブラリはHTML5の新要素に未対応のIEに新要素(<header>等)を認識させるスクリプトなので、スタイルシートの読み込み前に記述しないとHTML5タグと認識されずスタイルが反映しません。
ダウンロードはこちら(Google – html5shiv)