メタ情報

<meta> は <head> 〜 </head> 間に追加することでいろいろな付加情報を追加します。このタグは本文には表示されません。

文字コードを指定する
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

charset= にテキストエディタで作成した時の文字コードを指定します。こうすることにより文字化けをある程度防げます。

? 秒後に指定場所に移動する
<meta http-equiv="Refresh" content="5; URL=./index.html">

meta http-equiv="Refresh" として、content=? に移動するまでの時間(秒)、URL=./index.html に移動先の URL を指定します。
JavaScript の setTimeout 等を使用しなくても簡単に指定した URL に移動できます。サイト移転などのときに便利です。

Refresh  setTimeout(2つとも5秒後にこのページに戻ります)

ページ(サイト)を表示したとき特殊効果を演出する(Internet Explorer のみ)
<meta http-equiv="Page-Exit" content="revealTrans(Duration=1, Transition=1)">

meta http-equiv="???" には以下の中から指定することができます。これらは同一ウィンドウで開かれた場合に効果が得られます。

Page-Enter
他のページから Page-Enter のあるページに入ってくる場合に Transition=? の効果でページを表示します。
Page-Exit
Page-Exit のあるページから他のページに移動する場合に Transition=? の効果でページを表示します。
Site-Enter
他のサイトから Site-Enter のある自分のページ(サイト)に入ってくる場合のみ Transition=? の効果でページを表示します。
※自分のサイト内(同一ドメイン)のページを訪問されている間は効果が得られません。
Site-Exit
Site-Exit のある自分のページ(サイト)から他のサイトに移動する場合のみ Transition=? の効果でページを表示します。
※自分のサイト内(同一ドメイン)のページを訪問されている間は効果が得られません。

content="revealTrans(Duration=1, Transition=1)" の Duration=? に Transition=? が表示されるまでの時間(秒)を指定します。

下記は Transition=? の効果です。0〜23まであります。(時間は全て1秒に設定しています)
 0.外側から四角く表示  6.左から右へ表示 12.霧吹きのように表示 18.右下から左上に表示
 1.真中から四角く表示  7.右から左へ表示 13.左右から真中に表示 19.左上から右下に表示
 2.外側から丸く表示  8.左から段になって表示 14.真中から左右へ表示 20.左下から右上に表示
 3.真中から丸く表示  9.上から段になって表示 15.上と下から同時に表示 21.上下にバラバラに表示
 4.下から上へ表示 10.左からまだらに表示 16.真中から上下に表示 22.左右にバラバラに表示
 5.上から下へ表示 11.上からまだらに表示 17.右上から左下に表示 23.これら (0〜22) のランダム表示
※Windows 版の Internet Explorer のみ動作します
content="blendTrans" にするとほんわかに表示します
<meta http-equiv="Page-Enter" content="blendTrans(Duration=1.5)">

Duration=? に時間(秒)を指定します。Transition は不要です。

blendTrans(1秒に設定しています)

Windows 98/ME/2000 でトランジションが表示されない場合は、以下の手順でセキュリティの設定を変更してください。

  1. [ツール] → [インターネット オプション] → [セキュリティ] にある [レベルのカスタマイズ] をクリックします。
  2. [ActiveX コントロールとプラグイン] の項目にある [ActiveX コントロールとプラグインの実行] を有効にしてください。
  3. 上記でも表示されない場合はさらに [スクリプトを実行しても安全だとマークされている ActiveX コントロールのスクリプトの実行] も有効にしてください。

Windows XP 以降でトランジションが表示されない場合は、以下の手順でセキュリティの設定を変更してください。

  1. [ツール] → [インターネット オプション] → [セキュリティ] にある [レベルのカスタマイズ] をクリックします。
  2. [ActiveX コントロールとプラグイン] の項目にある [バイナリ ビヘイビアとスクリプト ビヘイビア] を有効にしてください。

Transition (revealTrans, blendTrans) は、結構重くなったリ嫌がる方もおられるかもしれないので、使用するのであれば時間を短めに設定した方が良いと思います。あまり効果の時間が長くて表示が遅いときは、ブラウザの「中止」で効果を止められます。

※Transition は Internet Explorer 10 以降で使用不可になりました。DX フィルターがサポートされなくなった

Refresh, Transition はブラウザの設定で動作不可にもできますので、特に Refresh を使用するときには本文にリンク先を書いておいたほうが良いと思います。

ページ内の全てのリンクに同じ target 属性をするときは
<base target="_blank">

このように base タグを使用してこれを追加したページ内のリンクを全て別ウィンドウで開きます。たとえばフレームを使用していてフレーム内のリンク全てフレーム解除するには、target="_top" とします。

ページのキャッシュを防ぐ
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache, no-store">
<meta http-equiv="Expires" content="0">

Pragma, Cache-Control はプロトコル別 (HTTP 1.0 / 1.1) のキャッシュの方法。no-cache, no-store はキャッシュと保存をしない。

Expires にはページの有効期限を指定します。0 のかわりに -1 や Tue, 1 Jan 2002 00:00:00 GMT のように過去の日時を指定しても良いみたいですが、Internet Explorer ではキャッシュされていました。

キーワード
<meta name="keywords" content="あんぽんたん, JavaScript">

検索エンジンに登録されるキーワードを content 内に記述します。複数の場合は「,」で区切ります。

ページの説明
<meta name="description" content="JavaScript サンプル集を公開中です。">

検索エンジンに登録されるページの説明を content 内に記述します。

[PR] Yahoo!ショッピング