METAタグ編

METAタグ編

超簡単ＨＴＭＬ基礎

このページでは、METAタグの使い方のほんの一例を紹介しています。
HTMLの最初の<HEAD>～</HEAD>の間に数行のMETAタグを挿入するだけの簡単な作業です。METAタグは必ずしも必要ではないのですが、マスターすると色々と恩恵を得ることができるので、覚えておいても損は無い！
★文字コードの指定、検索エンジン登録に際して重要なMETAタグの使い方を簡単に紹介しています。他にも色々なMETAタグがあるようですが、取り敢えずはここで紹介したものだけ使えればＯＫです。

■STEP１．文字コードの指定

　まずは、記述したHTMLの文字コードをMETAタグで指定します。
下の例は、文字コードが「シフトJIS」の場合です。大抵、WindowsやMacで作成したHTMLは、この「シフトJIS」なんだそうです。この文字コード指定のMETAタグが無い場合、たまにブラウザの文字コード設定がうまくいかずに、文字化けすることがあるようです。ま、無くても大きな問題は無いんですが・・・　取り敢えず、決まり文句と思って入れておいても損はないかも！？

<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;charset=x-sjis">
<TITLE>ＭＥＴＡタグサンプル１</TITLE>
</HEAD>
<BODY>

　・・・(略)・・・

</BODY>
</HTML>

文字コードの指定は、<HEAD>～</HEAD>の間に次の１行を挿入．
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;charset=(文字コード)">
　　・シフトJIS：　x-sjis
　　・EUC：　x-euc-jp
　　・JIS：　iso-2022-jp

■STEP２．ページ紹介文とキーワードの指定

　次にページの紹介文とキーワードを指定してみます。
通常、ロボット型の検索サイトに登録される場合、このMETAタグで指定した紹介文・キーワードが登録されます。gooやinfoseek Japanなどでは、検索でヒットした場合、タイトルとここで指定した紹介文が表示されます。（このMETAタグが無い場合、本文最初の80～100文字のテキストが表示されています）
ロボット型の検索サイトへ登録してアクセスｕｐを狙うならば、こんなきめ細かい方法もあるのでお試し下さい。

<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;charset=x-sjis">
<META NAME="description" CONTENT="広島風お好み焼き、路面電車、広島カープ、広島の方言辞典等々、広島の名物・文化を紹介した広島情報満載のファミリー向けサイト。">
<META NAME="keywords" CONTENT="原爆ドーム,安芸の宮島,広島弁,犬種,図鑑,写真">
<TITLE>ＭＥＴＡタグサンプル２</TITLE>
</HEAD>
<BODY>

　・・・(略)・・・

</BODY>
</HTML>

紹介文の指定は、<HEAD>～</HEAD>の間に次の１行を挿入．
<META NAME="description" CONTENT="(紹介文)">

キーワードの指定は、<HEAD>～</HEAD>の間に次の１行を挿入．
<META NAME="keywords" CONTENT="(キーワード１),(キーワード２),・・・">
　※複数のキーワードは半角カンマで区切る．

　検索サイトによっては、紹介文・キーワードの文字数制限されているところもあるので注意！

■STEP３．検索ロボットの拒否

　次は、METAタグで検索サイトへの登録拒否を指定します。
通常、ロボット型検索エンジンの検索ロボットは、ページ内のリンクを辿って次々と各ページを登録していきます。登録させたくないページがある場合には、このMETAタグを使用します。
下の例では、「このページは登録するが、そこからリンクされたページは登録しない」という指定をしています。

<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;charset=x-sjis">
<META NAME="description" CONTENT="広島風お好み焼き、路面電車、広島カープ、広島の方言等々、広島の名物・文化を紹介した広島情報満載のファミリー向けサイト。">
<META NAME="keywords" CONTENT="原爆ドーム,安芸の宮島,広島弁,犬種,図鑑,写真">
<META NAME="robots" CONTENT="index,nofollow">
<TITLE>ＭＥＴＡタグサンプル３</TITLE>
</HEAD>
<BODY>

　・・・(略)・・・

</BODY>
</HTML>

検索ロボットの拒否については、<HEAD>～</HEAD>の間に次の１行を挿入．
<META NAME="robots" CONTENT="(indexまたはnoindex),(followまたはnofollow)">
　(1)そのページを
　　・index　：登録する．
　　・noindex：登録しない．（検索ロボットの拒否）
　(2)そのページからリンクされたページを
　　・follow　：ロボットに辿らせる．
　　・nofollow：ロボットに辿らせない．（検索ロボットの拒否）

例えば、そのページとリンクされたページを登録させたくない場合には、次のように指定．
<META NAME="robots" CONTENT="noindex,nofollow">

Prev.
フレームちょっとした手直し編

クリッカブルマップ編