h1,h2,h3,h4,h5,h6タグについて
hタグの「h」は、見出しの意味です。
英語で、新聞などの記事の見出しをheadingとかheadlineと言いますので、その"h"なわけです。
htmlのタグの場合、大見出しから小見出しまでを1～6のレベルに分けて設定できることになっていて、それぞれのレベルに対し、正しい使い方が決まっています。
先にも記した通り、html（Hyper Text Markup Language/ハイパーテキスト記述言語）は、文書の構成や文字などの修飾情報を「タグ」と呼ばれる文字列で囲う事によって文書中に記述していく言語です。そのため、htmlにもきちんとした文法があります。
日本語でも英語でもそうですが、文法をきちんと守らなくても、意味は通じることが多いですよね。
htmlの場合も文法を遵守しなくても、ホームページの見た目的にはOKということも無いわけではありません。
ですが、SEOの観点から言うと、ホームページを見てもらう対象は「人間＝サイト閲覧者」と「ロボット＝クローラー」の両方だという事を忘れてはいけません。
検索エンジンはユーザーの利便性向上のため日々進化しているわけですが、人間と同じような「あいまいさ」は持ち合わせていません。
文法＝記述のルールを守ることで、検索エンジンに対しても、人間にとっても、読みやすいものに仕上がるのです。
hタグのルール
h1タグ
いわゆる「大見出し」です。新聞・雑誌と同様に、大見出しは1ページに1か所と決まっています。
大見出しは、記事内容の一番先頭に来なければなりません。
大見出しの前に文書などが入ってはいけません。
つまり、h1タグは、bodyタグのすぐ後に入れなければならないのです。
<body> <h1>大見出し：bodyタグの直後に1ページに1つだけ</h1> </body>
h2～h6タグ
「中見出し」「小見出し」です。
これらの見出しは、1ページにいくつ使用しても構いませんが、表示する順番は、h2からh6の順番を守らなければなりません。
つまり、h1タグの次にいきなりh3タグが来たり、h2タグから始まってh1タグが出てきたり、h1タグを1ページに複数使ったりしてはいけないということです。
<body> <h1>大見出し：1ページに1つだけ</h1> <h2>2番目の見出し：h1の次に使う</h2> <h3>3番目の見出し：h2の次に使う</h3> <h4>4番目の見出し：h3の次に使う</h4> <h5>5番目の見出し：h4の次に使う</h5> <h6>6番目の見出し：h5の次に使う</h6> </body>
例えば、こんな使い方をすると良いでしょう。
「大見出し」つまり<h1>が一番上に来て、その下にpタグ<p>つまりパラグラフ（文書の段落）、次に二番目の見出し<h2>と二番目の見出しの下に来るpタグで囲まれた文書の段落が続き、以下同様に三番目の見出し<h3>、四番目の見出し<h4>が順に記述されている点に注目してください。
<meta name="keywords" content="鈴木智子,ホームページ,アクセスアップ,講座" /> <h1>浦島太郎</h1> <p>浦島太郎は漁師だった。</p> <h2>亀との出会い</h2> <p>ある日、太郎は子ども達が亀をいじめているところに出くわした。</p> <h2>竜宮城への招待</h2> <p>太郎が亀を助けると、亀はお礼に竜宮城に連れて行ってくれるという。太郎は、亀にまたがり、竜宮城に連れて行ってもらった。</p> <h3>竜宮城での日々</h3> <p>竜宮城には乙姫がいて、太郎を歓待してくれた。</p> ～中略～ <h2>玉手箱の中身</h2> <p>太郎が亀に跨り浜に帰ると、太郎が知っている人は誰もいなかった。おかしいと思いつつ太郎が玉手箱を開けると、中から煙が出てきた。そして、その煙を浴びた太郎は老人になっていた。竜宮城で浦島太郎が過ごした日々は数日だったが、地上では700年が経っていたのだ。</p>
「鈴木智子のホームページのアクセスアップ講座」では、次のようになります。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja" dir="ltr"> <head> <meta http-equiv="Content-Type" content="UTF-8" /> <meta http-equiv="content-script-type" content="text/javascript" /> <meta http-equiv="content-style-type" content="text/css" /> <meta http-equiv="imagetoolbar" content="no" /> <meta name="robots" content="INDEX,FOLLOW" /> <meta name="author" content="鈴木智子のホームページのアクセスアップ講座" /> <meta name="copyright" content="Copyright (c) 2009 nishi-shinjuku.net" /> <meta name="coverage" content="japan" /> <meta name="Targeted Geographic Area" content="japan" /> <meta name="classification" content="general,computers,internet,personal" /> <meta name="rating" content="general" /> <meta name="slurp" content="NOYDIR" /> <meta name="robots" content="NOODP" /> <meta name="Keywords" content="鈴木智子,ホームページ,アクセスアップ,講座" /> <meta name="Description" content="実戦的ホームページの制作からSEO、SEM、広告戦略まで余すところなく公開。" /> <title>鈴木智子のホームページのアクセスアップ講座</title> </head> <body> <h1>鈴木智子のホームページのアクセスアップ講座</h1> <h2>プロのノウハウを公開する理由 インターネットとフリー（無償）の思想</h2> <h3>インターネットの普及</h3> <h3>インターネット利用者の増加</h3> <h3>ホームページの利用とアクセスアップ</h3> </body> </html>
では、次に「pタグについて」に進んでゆきましょう。
