manifest属性

html要素のmanifest属性には、ドキュメントのキャッシュ・マニフェスト・ファイルのURLを指定する。

ブラウザ対応

構文

<html manifest="URL"></html>
URL
キャッシュ・マニフェスト・ファイルのURLを、絶対URLか相対URLで指定。

要点

  • manifest属性は、ドキュメントのキャッシュ・マニフェスト・ファイルのURLを指定する属性。
  • キャッシュ・マニフェスト・ファイルとは、ブラウザのキャッシュをコントロールするためのファイル。ブラウザにキャッシュさせたいファイルを指定することなどができる。ファイル転送量を減らしたい場合や、オフラインでも動作するウェブアプリを作る場合などに使う。ファイル転送量を減らすと、表示速度アップやサーバー負荷軽減に効果がある。
  • HTML5にて新たに導入された属性である。

サンプルコード

<!DOCTYPE html>
<html lang="ja" manifest="sample-html-manifest.appcache">
	<head>
		<title>タイトル</title>
		<meta charset="UTF-8" />
	</head>
	<body>
		ドキュメントの内容
	</body>
</html>

サンプル

HTMLファイル

<!DOCTYPE html>
<html lang="ja" manifest="sample-html-manifest.appcache">
	<head>
		<title>サンプル</title>
		<meta charset="UTF-8" />
		<link href="sample-html-manifest.css" type="text/css" rel="stylesheet" />
	</head>
	<body>
		<h1>サンプル</h1>
		<p>ドキュメントの内容</p>
	</body>
</html>

CSSファイル

h1 {
    color: #f00;
}
p {
    color: #4800ff;
}

キャッシュ・マニフェスト・ファイル

CACHE MANIFEST
# version1.0.0 - 2014-03-25
sample-html-manifest.css
sample-html-manifest.html

実際の表示

サンプルについて

  • キャッシュ・マニフェスト・ファイルは更新せず、HTMLファイルやCSSファイルだけを更新し、リロード(再読み込み)しても、ブラウザはキャッシュを更新しない。
  • HTMLファイルやCSSファイルだけでなく、キャッシュ・マニフェスト・ファイルも更新し、リロード(再読み込み)すると、ブラウザはキャッシュを更新する。ただし、表示内容の更新は、2回目のリロード時である。