HTML5のhead内に書くものまとめ

作成:2014/02/26 更新:2014/03/02

html5ロゴ
WordPressのテーマを自作するにあたって、HTML5でマークアップすることにしました。

HTML + XMLでマークアップしていた時もそうですが、head内に書くものって意外に忘れるし、その都度調べるのが面倒くさいので自分が使うものをメモ。

head内

まずは文字コードなど必要な内容

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

CSSやJSの設定

<link rel="stylesheet" href="hoge.css">
<script src="example1.js"></script>
<style>
/* cssをここに */
</style>
</head>

古いブラウザでもHTML5が使えるようになるライブラリを追加

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

スマートフォン用
電話番号認識を無効化しホーム画面用のアイコンの指定。

<meta name="format-detection" content="telephone=no" />
<link rel="apple-touch-icon" href="img/home.png" />

最後にheadタグを忘れずに閉じる

</head>

制作していく途中で追加要素が出てくるのでその都度追加します。