【今すぐやっておくべきこと】 見出しタグの威力を活用しない手はない
HTMLタグには、
【これは見出しです】と、テキストを特別にしてくれる専用のタグがあります。
この見出し専用のタグは、
検索ロボットに、ページのキーワードを上手く拾ってもらう為に、
とても重要な役割と威力を持っています。
見出し専用タグは、基本6人家族です。
- ＜h1＞お父さん(一家の大黒柱。一番重要な役割を担っている)
…ブログやサイトのタイトルの見出しと使われている - ＜h2＞お母さん(お父さんの次に重要な存在)
…そのブログやサイトの概要(どんなページか？)の説明文に使われている - ＜h3＞一番大きい子供(1人〜○つ子可)
…長男・長女の存在。主に各ページ(記事)のタイトルにふさわしい。 - ＜h4＞次に大きい子供(１人〜○つ子可)
…次男・次女の存在。 - ＜h5＞〜＜h6＞
…以降、小さい子供たち。
人間社会と同じで、
お父さん・お母さんは１人しか存在できません。
つまり、＜h1＞と＜h2＞は、それぞれ１回しか使えないというルールがあります。
＜h3＞〜＜h6＞は、こどもたち。
＜h3＞が長男・長女で、＜h6＞が末っ子です。
年上である、兄・姉が重要性の高い役割を果たします。
こどもたちは、双子だったり、６つ子だったりして構いません。
よって、＜h3＞〜＜h6＞は、それぞれ何回使っても良いことになっています。
＜h3＞○○○について＜/h3＞
↑このように、
「○○○について」という文章を、見出しタグで囲うと、
「○○○について」という文章が、【見出し】になります。
この見出しファミリーの威力とは
HTMLタグには、テキストに、ある特別な意味(効果)を持たせるものがいくつかありますが、
その中でも、見出しタグは、
ここに重要なキーワードがあります！ということを宣言できる威力がかなり強い存在です。
ブログなど、webページ上には、自由に文章(テキスト)を書くことができます。
その文章(テキスト)の中から、
検索ロボットが、キーワードを拾っていき、
誰かが検索した場合に、関連性の高いものを検索結果に表示しています。
１つの全く同じ文章(テキスト)があったとして、
HTMLタグを活用せずに書いた文章と、
HTMLタグを活用して、キーワードや重要性などを付加した文章とでは、
検索ロボットが拾ってくれる情報の量が違ってくる、ということになります。
HTMLタグを一切使わないページに、キーワードも一切無い、
という訳ではありませんが、
より、多くの人に作ったページを見てもらいたい！と思う場合は、
こちらから積極的にキーワードなどの情報を提供することができる、という訳です。
＜h1＞はブログタイトル、＜h2＞は概要になっていますか？
ブログであれば、大抵の場合、＜h1＞はブログのタイトル
＜h2＞はブログの概要(introduction)になってると思いますが、
そうなっていない場合もあるかもしれないので、
テンプレートの編集画面の、HTML部を見てみてください。
ブログのタイトル部
お使いのテンプレートによって若干違いがあるかもしれませんが、HTML部の、＜body＞タグのすぐ下の辺りに、
＜%blog_name＞というFC2独自タグが表示されている部分がブログタイトル部になるかと思います。
この＜%blog_name＞という独自タグが、
＜h1＞と＜/h1＞に挟まれた形になっていれば、無事、
ブログタイトルが＜h1＞という一番大きな見出しになっています。
表示例
<body>
…
<h1><%blog_name></h1>
…
ブログの概要(introduction)部
こちらも同様に、＜%introduction＞という独自タグが、
ブログの概要(説明文)になっています。
＜h1＞の場合よりも、テンプレートによって表示位置が異なっていると思うので、
＜body＞タグよりも下にある、＜%introduction＞を探してください。
ブログタイトルと同様に、
＜h2＞と＜/h2＞の間に、＜%introduction＞が挟まれている形になっていればOKです。
表示例
<body>
…
<h2><%introduction></h2>
…
＜h1＞と＜h2＞の見出しは、１回しか使えない！
そうです。＜h1＞と＜h2＞の見出しタグは、
それぞれ一度しか使えないことになっていますので、
重複がないか、テンプレートのHTML部で確認することをお勧めします。
もし、１回以上使われている場合は、
ルール違反なので、不具合が起きたり、検索ロボットにも嫌われる可能性が高いです。
見出しタグの文字の大きさ
見出しタグは、重要度の高い＜h1＞は一番大きい文字で、
それ以降、少しずつ文字の大きさが小さくなっていきます。
これは、標準で定められています。
CSS部で大きさを指定することも可能です。
また、文字の大きさだけではなく、
【見出し】というだけあって、
見出しタグで囲まれた文章(テキスト)を、
div(箱)と同様に、CSSで装飾することもできます。
例えば、
この記事内でも、見出しタグを使っています。
↓↓↓
CSSで装飾した見出しです
↑これはとてもシンプルな装飾例なのですが、
CSSの入門としてとても良い練習になるので、興味のある方は是非。
CSS ブログ記事内で、見出しに使う枠を呼び出す小技。
http://airrat.blog103.fc2.com/blog-entry-231.html
(まとめ)見出しタグは皆に優しい
さて、長くなってしまったので、最後にまとめを。人間があるページを見た場合、
大きい文字や、色やデザインなどで強調された文字を、
無意識の中で「これは見出しだ。これは重要なことが書いてあるっぽい」と、
認識しています。
これはあくまで人間が目で見た場合の話です。
ただ大きい・強調された見出し文字と、
見出しタグを使ってかかれた見た目は全く同じ見出し文字。
人間が見た場合、どちらもすっかり同じ見出しなんですが、
検索ロボットが見ると、
この2つは全く重要性が違ってきます。
検索ロボットは、見出しに使われている文章(テキスト)を、
「かなり重要なキーワードが含まれているはずだ」と認識するそうです。
＜h3＞を記事タイトルに設定するメモも書きたかったのですが、
お使いのテンプレートによって仕様が異なるので、あえて書きませんでした。
記事内に＜h3＞の見出しを儲ける方法が出来るようになると、
記事タイトル部のカスタマイズに挑戦しやすくなるかと思います。
見出しタグで気をつけたいことは、
＜h1＞と＜h2＞はそれぞれ一回しか使えない！ということです。
akina@AIRRAT
