ヘッダとメタタグ

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

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

メタタグの記述に強い効果はありませんが、お約束事もあるので覚えておきましょう。

スキップリンク

このページはタテに長いので項目毎にスキップリンクを設置しています。

【▲上に移動】もしくは「メタタグの画像」をクリックするとこの位置まで移動します。

HTMLヘッダ

厳密には<HEAD>〜</HEAD>間の意味ですが、便宜上、記述冒頭から<BODY>の直前までをヘッダと呼ぶことにします。

HTMLヘッダ

上記例のようなものですが、通常はこの書き方そのものが「お約束事」となります。

以下は各意味を降順に解説します。

ドキュメントタイプ宣言

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

ドキュメントタイプ宣言

HTMLには「その規格のみ用いることができる技法」があり、ブラウザによってはどんな規格によって書かれているか明示しないと正確に表現できないことがあります。

なお、一般的に用いられるものは、HTML4.01-Transitionalです。

以下の内容もHTML4.01-Transitionalを元に記述しています。HTML4.01-STRICTXHTMLでは記述方法が異なるものもあるので注意してください。

▲上に移動

言語指定

このページは日本語である、ということを表すために用います。

言語指定

これはお約束です。

<META http-equiv="Content-Language" content="ja">

上記のような書き方もありますが、汎用性の観点で現在では例のようにLANG属性で指定をするのが推奨されています。

▲上に移動

ヘッダーの書き出し

厳密な意味での「ヘッダー」はここから開始です。

ヘッダーの書き出し

これはHTML構文のルールです。最後は【</HEAD>】で締めましょう。

▲上に移動

文字コード指定

HTMLを書いている文字コードを指定します。

文字コード指定

この場合は、【SHIFT-JIS】というコードを使っていることを明示しています。

この記述をすることでブラウザは文字コード指定(エンコード)を切り替えるので文字化けしなくなります。

今のところ、一般的なホームページ作成ツールの初期設定はSHIFT-JISがになってることが多いようです。

その他よく用いられる文字コード

  • UTF-8
  • EUC-JP
  • ISO-2022-JP

ツールの文字コード指定を忘れずに

ここで文字コードを指定しても実際に使用している文字コードが違えば文字化けしてしまいます。

メタタグの指定はブラウザのエンコード指定を切り替えるためであり、文字コードそのものを変更するものではありません。

文字コードを記述する前に作成ツールの使用文字コードを確認しておきましょう。

ヤフージオシティーズは「EUC-JP」が指定コードです

ヤフーが提供しているホームページサーバーのGeocitiesでは、使用する文字コードが「EUC-JP」で指定されています。

作業に入る前にツールの使用文字コードを「EUC-JP」に変更し、メタタグも「EUC-JP」で記述する必要があります。

ジオシティ利用サイトの文字化けはほとんどこれが原因です。

一部のウェブサーバーでも同様に使用できる文字コードが指定されていることもあるので注意しておきましょう。

▲上に移動

JAVAスクリプトの使用

ページ内でJAVAスクリプトを使用していることを明示するための記述です。

JAVAスクリプトの使用

JAVAスクリプトを使用する場合、これはお約束です。

使用しなければ書く必要はありませんが、アクセス解析や広告バナーの多くはJAVAスクリプトを使用しているため、ほとんどのケースで記述しなければならなくなります。

▲上に移動

ページの重点キーワード

SEOといえばキーワード(KEYWORDS)です。

重点キーワード

図中の「***」の部分に重点キーを記述します。(複数記述する場合は「、」半角カンマで区切る)

検索エンジンが検索候補を抽出するために用意されているので積極的に使うべきですが、反面、その使い方は意外に難しいものがあります。

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

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

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

キーワードタグはその性質上、不適切な用途(SEOスパム)に流用しやすいので検索エンジンは度々仕様変更を行っており、機械的な施策の多くは無効化される流れにあります。

KEYWORD=単数形はNGです

今どきの単数形はタグ手打ちのタイプミスであることがほとんどですが、KEYWORDの単数形適用はSEOスパムとして認識されます。

タグを手打ちする際は気をつけましょう。

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

店舗名で検索できないのは致命的欠陥です。

同一名ならいざしらず無関係なページより下位になってはなんともなりません。

屋号がアルファベットの場合など複数の記述(表現)方法が考えられるときはその全てを書いておくようにしましょう。

▲上に移動

ページの紹介文

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

重点キーワード

図中の「***」の部分にページの紹介文や説明文を記述します。

ここに記述した内容は、「ある条件」を満たすと検索結果で次のように表示されます。

DESCRIPTIONで記述した文章の表示例

例では赤下線の文章がDESCRIPUTIONに記述されている

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

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

このルールに反すると後にアップしたページは重複判定を受けてインデックスから消されてしまいます。(=検索されない)

今どきSEOの効果はありません

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

リンク集への登録などでサイト紹介文を作成する際に人間の目で参照される程度なので気休めくらいにしかなりません。

▲上に移動

スタイルシートの引用

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

スタイルシートの引用

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

最後尾のMEDIA属性は省略しても構いません。

「ALL=全ての媒体」属性をつけるとCSSを中途半端に解釈するブラウザによっては行全体を無効化することがあります。この場合はCSSファイル自体が読み込まれませんが、結果的に「適切」な状態で表示できるようになります。

本来は「印刷用」「モバイル端末用」などの用途別にスタイルシートを使い分けるための属性です。

▲上に移動

ページタイトル

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

ページタイトル

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

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

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

  • 絶対的に、半角カナ文字を使用してはいけない
  • 技法ルールとして、全角60文字を超えてはいけない

効果的な使い方(常套手段)

  • 社名に加えて業種や商品名なども付記する
  • 地域名を必ず入れる
  • 接続語をなるべく用いず一句で書く
  • 基本的に、業種などの記述が先(優先したいキーワードを先に記述)
タイトルタグの書き方

例 (但しこの方法は業種が後なのでSEO的にはあまり強くない)

常識的に見苦しい表記はやめましょう

直接的な効果が高い要素であるため、商品名や業種などを羅列したり文法的に不自然な表現をしているケースが数多く見られます。

同一キーの連続など、よほど悪質でなければマイナス評点にはならないので「多少不自然でも結果的にアクセスが拾える方が良い」という考え方は否定できません。

でも、競争の中にも倫理というものがあると思います。

個人主観として見苦しく感じるもの

  • 同一キーワードの重複(連続はNG技法)
  • 自社呼称を「〜会社」とする表現
  • 発音して意味が通らない表現

これで1位になっていれば結果が全てと言えるでしょうが・・・

▲上に移動

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

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

ですが、ヘッダーの容量が多いと検索上の不利が発生するため、余計なものは書かないのがSEOの暗黙ルールとなっています。(半角1024文字を超えると不利が発生するとの検証が有力)

よって、必要がなければ書かないようにするのもSEOです。

GENERATOR

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

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

共同作業や「引継ぎ」がある管理形態の場合、これが書いてあるとスムーズに作業が進むメリットはあります。

よく似たもので【PROGID】がありますが、こちらは作業過程で必要になるケースもあるので、作業中やツール依存機構を使っているときは消さないほうが良いかもしれません。

COPYRIGHT

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

HTMLは作者に著作権が発生しますが、これで著作権が守れるなら世の中に著作権侵害なんていう言葉は存在しないように有形無実なタグです。

AUTHER

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

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

また、

<LINK REV="MADE" HREF="mailto:メールアドレス">

として問合せをしやすくする代替手法もあります。

完璧なHTMLを書きたいならやっておきましょう・・・的なものでしょうね。

ROBOTS

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

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

一部のSEO解説書では記述することを推奨していますが、現実的には書こうが書くまいがクロールするものはしますし、しないものはしません

秘匿性を保つために「NOFOLLOW」を用いているケースも見られますが、秘匿性を保持したいのであればBASIC認証などのサーバーレベルでセキュリティをかけるのが適切です。

REFRESH

指定したページに自動的にジャンプさせる指示を行うものです。

<META HTTP-EQUIV="REFRESH" CONTENT="待ち(秒);URL=アドレス">

アドレスの変更やページの削除・移動などで移転先に誘導する際に便利な機能ですが、移転案内ページをつくってキチンとリンクを貼っておけばそれなりにリンクポピュラリティが稼げます。

つまり、自動で飛ばさないほうがSEO的には有利です。

  • 直前のページへ
  • ページの先頭へ