超初心者でも簡単!あなたもできるHP作成!− Make easily  
|| トップページ || HTML || Style Sheet || リファレンス || Web素材 || Contact Us || サイトマップ || 初めての方 || 

<!DOCTIPE>の宣言 日本語で記述 METAタグとは
検索エンジンへの登録可否 文字コードを指定する スタイルシートを使う
Javaスクリプトを使う ページ内容の要約 キーワードのセット
イメージツールバーを表示しない スタイルシートを読み込む ページを自動的にジャンプさせる
headのタグ見本    

ヘッダ情報

このリファレンスの見方については「リファレンスの見方」をお読みください。

ドキュメントタイプ(<!DOCTIPE>)の宣言

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!DOCTIPE>宣言とはその名の通りドキュメントのタイプの宣言文で、HTMLの記述バージョンやタイプを宣言しておきます。
上の書き方は「HTML4.01の記述方法と旧HTMLのバージョンの記述が混在していますよ」という意味です。
どのドキュメントタイプを宣言してよいのかわからない場合は、上記を使うと良いです。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
「HTML4.01でサポートされているタグでのみ書いています」という宣言です。
この場合、HTML4.01でサポートされていない <center> </center> や <align="center"> が使えません。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
フレームを使ってホームページを作っている場合は、上のドキュメントタイプを宣言します。

日本語で記述

<html lang="ja-JP">
このページが日本語で書かれていることを宣言しています。

METAタグとは

METAタグとは、GoogleやMSNサーチなどのロボット型検索というプログラムが、Webのネットワーク上をぐるぐる回ってホームページを探して、 その探したホームページのキーワードを思い通りに拾わせるためのタグであったり、ページの情報をあらかじめセットしておくためのタグです。
ロボット型検索は、探したホームページのHTMLの中から適当にワードを拾い集めてキーワードにします。
METAタグを張ることによって、自分の思い通りのキーワードで、自分のサイトを検索できるようになります。

では、METAタグを使うと何ができるのでしょうか?
・ロボット型検索エンジンへの登録の可否
・検索のキーワード
・検索結果に表示するコメント

などです。

あなたのホームページもロボット型検索でヒットするように、トップページにはMETAタグを書くようにしましょう。

ロボット型検索エンジンへの登録可否

<meta name="robots" content="index,follow">
トップページ及びトップページからのリンク先の登録を許可します。

特に指定しなくても、ロボット型検索が勝手に登録していくので、特に指定する必要はありません。

<meta name="robots" content="index,nofollow">
トップページは登録を許可しますが、ここからのリンク先の登録は許可しません

トップページはロボット型検索でヒットしてもいいが、それ以下のリンク先を登録されては困る場合に記述します。

<meta name="robots" content="noindex,follow">
トップページの登録は許可しませんが、トップ以下のリンク先は登録を許可します
<meta name="robots" content="noindex,nofollow">
ページ全体の登録を許可しません

ロボット型検索に登録されたくない場合に、このMETAタグを記述しておきます。

文字コードを指定する

<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
文字コードを指定しておくと、文字化けを防ぐことができます。
タイトルが日本語の場合は、タイトルよりも上に書く必要があります。
METAタグの一番上に書いておくのが無難です。
文字コードの指定には以下があります。

・Shift_JIS : 日本語シフトJIS
・EUC-JP : 日本語EUC
・ISO-2022-JP : 日本語自動判別

自分のページに合わせて指定しておきましょう。

スタイルシートを使う

<meta http-equiv="Content-Style-Type" content="text/css">
スタイルシートを使ってホームページを作る場合は、このMETAタグを書いておきます。

Javaスクリプトを使う

<meta http-equiv="Content-Script-Type" content="text/javascript">
ホームページ内にJavaスクリプトを使っている場合は、このMETAタグを書いておきます。

ページ内容の要約

<meta name="description" content="ホームページ内容の要約をここに書く">
ホームページの内容の要約を書いておくと、ロボット型検索でヒットしたときに表示されます。
だいたい100字以内で書くようにしましょう。

キーワードのセット

<meta name="keywords" content="キーワード,キーワード,キーワードをここに書く">
ロボット型検索でヒットするように、あらかじめキーワードをセットしておくことができます。
複数のキーワードを書く場合は、キーワードとキーワードの間は「,」(カンマ)で区切っておきます。

イメージツールバーを表示しない

<meta http-equiv="imagetoolbar" content="no">
Internet Explorer 6.0 以降のブラウザで200×200ピクセル 以上の画像にマウスを乗せると保存や印刷などがボタンがついたツールバーが表示されます。上記のタグを書いておけば、イメージツールバーは表示されなくなります。

スタイルシートを読み込む

<link href="ファイル名.css" rel="stylesheet" type="text/css">
スタイルシートの外部ファイルを読み込むときに書きます。
ファイル名には、スタイルシートまでのパスを書きます。
(例) <link href="../top.css" rel="stylesheet" type="text/css">

ページを自動的にジャンプさせる

<meta http-equiv="refresh" content="10;URL=http://〜〜〜">
一定の時間経過後に、ページを自動的にジャンプさせるには上のMETAタグを書いておきます。
content="ジャンプするまでの秒数
URL=http://〜〜〜" にはジャンプ先のアドレスを「http://」から書いておきます。

headのタグ見本

METAタグを下の見本のように組み合わせてhead内に書きます。
下の見本はこのページのheadに書かれている内容です。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja-JP">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta name="description" content="超初心者でも簡単にできる!ホームページ作成!HTMLとスタイルシートで作るクールサイト!">
<meta name="keywords" content="HP,ホームページ,スタイルシート,Style sheet,簡単作成,web,Webmaster">
<meta http-equiv="imagetoolbar" content="no">
<title>超初心者でも簡単!あなたもできるHP作成!-Make easily−リファレンス</title>
<link href="reference.css" rel="stylesheet" type="text/css">
</head>

<body>

▲このページのトップに戻るTop