はじめようHTML5【HTML5テンプレートファイル配布してます】修正版このエントリをはてなブックマークに登録

2009/12/07

久しぶりのブログ更新です

最近は、話題のHTML5に興味もってました。
仕事でもクライアント側から特に規約などで固められない場合は、頼まれてないのにHTML5ベースで作ったりしてますw

そんな時にテンプレートとして使っているファイルが結構便利なので公開します
これを使っていつも通りのHTMLコーディングするだけ簡単にHTML5になります。※

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8" />
	<link rel="stylesheet" href="http://yui.yahooapis.com/3.0.0/build/cssreset/reset-min.css" media="screen" />
	<link rel="stylesheet" href="http://yui.yahooapis.com/3.0.0/build/cssfonts/fonts-min.css" media="screen" />
	<!--http://html5resetcss.googlecode.com/files/html5-reset-1.4.css-->
	<link rel="stylesheet" href="[YOURSITE]/html5-reset-1.4.css" media="screen" />
	<!--[if IE]>
	<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
	<![endif]-->
	<title>TITLE</title>
<script>
</script>
<style>
</style>
</head>
<body>
Hello HTML5!
</body>
</html>

なんとこれだけで、新しいタグを使わなくてもHTML5になります!
ドキュメントタイプを「〈!DOCTYPE html〉」にするだけでHTML5の文書だと判断されるので当たり前ですね。

とりあえずHTML5をコーディングする際に必要(&便利)なファイルを、
GoogleやYahoo!がホスティングしてくれているところから呼び出すことで、
リソースを割かずに、HTML5から使える新タグを使っていても普通にコーディングし始められるというところがミソのテンプレートです。
※追記(2009/12/08)
注意点として「html5-reset-1.4.css」のみは、自分でDLしてサーバーに適宜配置してください。

■ダウンロード
html5テンプレートファイル(ver.20091208)

テンプレートといいながら、ホスティングされてるファイルを指定して記述してるだけですが、便利なのでよければ使ってみてください!

※追記2009/12/08
waioさんにLinkタグの要素抜けてると指摘があったので修正しました。
→「media=”screen”」

※「どんなHTMLでも〜」とありますが廃止タグもあるので注意は必要です…
廃止対象は、主にプレゼンテーションタグが多いようです。


Leave a Reply