ヘッダとメタタグの書き方

SEOについて調べると真っ先に出てくるのがメタタグの書き方です。

これだけで強い効果は期待できませんが、お約束事もあるので覚えておきましょう。

  • このページでは直接的にSEOに関わってくるものだけを解説しています
  • ページの最後に類似サイトについての当サイトの考え方を記しています

ドキュメントタイプ宣言

ドキュメントタイプとはHTMLの文法規格のことで、ページのHTML構文がどのような規格を用いて構成しているかをブラウザに伝えるために記述します。

DTD宣言に関する補足（コーディング技術者向け）

ご承知のとおりDTD宣言には標準モードと後方互換モードが存在しますが、当サイトはHTMLの技術情報ではないのであえて触れていません。

HTML4.01 Transitionalの場合

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

XHTML1.0 strictの場合

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

XHTML STRICTが有利？

文書構造の整合性と論理性が徹底的に追求されている場合において、XHTML(1.0)strictの構文に優位性があるのは事実ですが、そうでなければ構文タイプによる優位格差は発生しようがありません。

単にドキュメントタイプ宣言に書くだけでは意味はありません。ドキュメントタイプにこだわる以前に適切かつ論理的なHTMLを書くように意識しましょう。

ページの重点キーワード

SEOといえばキーワード（KEYWORDS）です。

<meta name="Keywords" content="ホームページ,制作,seo,静岡" />

図中の「***」の部分に重点キーを記述。キーワードは半角カンマ（、）で区切る。

積極的に使うべきですが、検索を意識した使い方は意外に難しいものがあります。

使い方のお約束（おそらくこうであろうと思われる内容）

  • 基本的に、ページ内で使用していないキーワードを書いてはいけない
  • 基本的に、「文章」であってはならない
  • 基本的に、「大量」に書いてはいけない

いずれも例外がありますが、理由がわからない状態で基本から逸れることはお勧めできません。

トップページは社名を入れておきましょう

店舗名で検索できないのは致命的欠陥です。同一屋号ならいざしらず無関係なページより下位になってはなんともなりません。

屋号がアルファベットの場合など複数の記述（表現）が考えられるときは、その全てを書いておくようにしましょう。これはユーザーへの配慮施策です。

ページの紹介文

ページの紹介文を表示するものです。

<meta name="description" content="SEOの基礎知識。間違ったSEO情報の解説など。" />

使い方のお約束（おそらくこうであろうと思われる内容）

  • 絶対的に、複数のページで同一の内容を使用してはいけない

このルールに反すると、後にアップしたページは重複判定を受けてインデックスから消されてしまう（＝検索されない）可能性があります。

検索順位向上の効果はありません

以前は順位向上の効果が高かった（という話ですが実際は知りません）のでキーワードを詰め込む手法が横行したらしく、その対策で重要判定はほとんど（おそらくは全く）なくなっています。

上手に使えばSERP上の誘導効果が高まるので「SEO＝検索エンジン対策」には違いないですが、順位アップ効果は無いので注意しましょう。

スタイルシートの引用

ページ外に置いているスタイルシート（CSS）のファイルを読み込むための指示です。

スタイルシートは外部ファイルに記述することが大原則であるため、これはお約束です。

<link rel="stylesheet" type="text/css" href="style.css" media="screen,print" />

MEDIA属性について

MEDIA属性には次のようなものがあります。

all CSSを判読するすべての表示媒体
screen PC用ディスプレイ
print プリンタ　※PDF書き出しも
handheld ケータイ ※AUのみ？
braille 点字ブラウザ

検索エンジンはCSSを読んでいる？

下記の実験により、グーグルはCSSを読むケースと読まないケースがあることを確認しています。

  1. 外部CSSに、BODY｛display:none;}を記述　（画面上の全てが非表示になる）
  2. 外部CSS読み込みのMEDIA属性を、「なし」「ALL」「SCREEN」「PRINT」で各々クロールさせる

結果は書きません。興味があればご自身で実験をどうぞ。

ページタイトル

TITLEタグは、その名のとおりページのタイトルです。

<title>間違いだらけのSEO</title>

タイトルに書かれた文章はブラウザ上部と検索結果に表示されます。

書き順だけで順位が変動するほど影響力が強いので、その扱いは難しいというより慎重にすべきものです。

使い方のお約束（おそらくこうであろうと思われる内容）

  • 絶対的に、半角カナ文字を使用してはいけない
  • 可能な限り、余計なことは書かない。冗長な文字や記号も含めない。
  • 技法ルールとして、全角85文字を超えてはいけない

効果的な使い方（常套手段）

  • 社名に加えて業種や商品名なども付記する
  • 地域名を必ず入れる
  • 接続語をなるべく用いず一句で書く
  • 基本的に、業種などの記述が先（優先したいキーワードを先に記述）
  • 極限まで文字数を少なくする

キーワードの重複は冗長判定をうけるだけです

あまり知られていませんが、TITLEタグは短いほうが優位性が高まります。

タイトルタグにキーワードを重複させると一見効果がありそうですが、最初に抽出されたもの以外は冗長文字として判定されるため、大量に繰り返すほど不利になります。

くだらないことをやるより普通にやったほうがマシというわかりやすい例です。

ページタイトルはクリック誘導を促す目的もあります。ページの目的にとって過不足ない書き方が大事です。

SEO的には推奨できないメタタグ

メタタグの内容は検索効率を手助けするものの他に、操作を補助したりブラウザやサーバーに指示を出すものなど様々にあります。

ですが、ヘッダーの容量が多いと検索上の不利が発生するため、余計なことを書かないこともSEOのテクニックです。

GENERATOR

使用している（された）ホームページ制作ツールを示すものです。

なぜこのようなものが存在するのか疑問に思うとおり不要タグの代表例です。

  • 共同作業や「引継ぎ」がある管理形態の場合、これが書いてあるとスムーズに作業が進むメリットはあります。
  • インターネットエクスプローラーでページを保存すると、MSHTML *********がGENERATOR名として自動挿入されます。

COPYRIGHT

その名のとおり著作者を記すためのものです。

HTMLは作者に著作権がありますが、法廷で争ってそれが認められることはおそらくありません。それ以前に、これで著作権が守れるなら世の中に著作権侵害なんていう言葉は存在しないように有形無実なタグです。

AUTHER

運用主である会社や個人名を記すタグです。

COPYRIGHTと同様に不要タグの一種ですが、ブラウザによっては「管理者連絡先」として表示されることもあるのでアクセシビリティ指針では記述することが推奨されています。

また、次のように記述すると特殊なブラウザではページ冒頭に連絡先等を表示させることができます。

<link rev="made"href="mailto:メールアドレス">

しかしこれをやると迷惑メールが・・・

ROBOTS

検索エンジンの取り込み（クロール）を許可・拒否する指示を行うものです。

  • 許可：index,follow
  • 拒否：noindex,nofollow

一部のSEO解説書では記述することを推奨していますが、現実的には書こうが書くまいがクロールするものはしますし、しないものはしません。二次創作サイト等では秘匿性を保つために「NOFOLLOW」を用いているケースがよく見られますが、そうであれば別の方法で対処すべきです。

少なくとも、検索にインデックスされたいために記述するのは無駄です。

ちなみに「index」とか「follow」って何？

「index/noindex」は検索エンジンのデータベースに取り込ませるかどうかの指定です。

「follow/nofolow」はリンクを辿るかどうかの指定です。「noffolow」にすると検索エンジンのクローラーはリンク先を無視しますが、上手に使うと冗長なクロールを抑制できるので意図的に使われることもあります。

おまけ：コピペ用

XHTML1.0の一般的なヘッダです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html lang="ja" xml:lang="ja" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <meta http-equiv="content-script-type" content="text/javascript" /> <meta name="keywords" content="***,***,***" /> <meta name="description" content="***" /> <title>***</title> <link rel="stylesheet" type="text/css" href="style.css" media="screen,print" /> </head>

SEO対策読本作者よりお知らせ

2008年12月30日現在、当ページと酷似しているサイトが存在するようです。（しかもホームページ制作会社の自社サイト）

  • 当サイト旧版・PDF240kb
  • 類似サイトの2008年12月30日現在・PDF300kb

内容はおろか、なんとページタイトルまで酷似しています。

当カテゴリの題目「自分でできる」はそれ自体が人気キーワードなので名称が被ることは十分に考えられます。

同種の題材を扱っているのですからコンテンツの表現が似通ることもありましょうし、文章表現が偶然一致することまで含めても夢は時間を裏切らないほどの天文学的確率ですが、ありえるかもしれません。

どちらがオリジナルであるかはあえて言及しません。サイトを見比べてお好きなように判断してください。