おう、君もWebサイトのクローラー制御、気になってるんだな？特に `meta robots` タグの使い方について、現場で本当に役立つ話をしようじゃないか。俺も昔は「これってどうなってるんだ？」って手探りだった時期もあるさ。でも、この `meta robots` ディレクティブを使いこなせるようになると、サイトの検索エンジンからの見え方を劇的にコントロールできるようになる。これは、単に「インデックスさせる」「させない」だけの話じゃない。もっと繊細な、サイトの「顔」の作り込みに関わる話なんだ。
今回は、フロントエンドエンジニアとして、この `meta robots` タグの標準仕様はもちろん、ブラウザや検索エンジンのクローラーが裏側でどう解釈しているのか、そして現場で「これさえあればOK！」と言えるような、実践的で綺麗なサンプルコードまで、惜しみなく全部ぶっちゃけようと思う。
`meta robots` タグ：検索エンジンに「どう見られるか」を指示する最終通達
まず、大前提として `meta robots` タグは、HTMLの `
` セクションに記述するメタ情報の一つだ。これは、検索エンジンのクローラー（Googlebotとか、Bingbotとか、そういうやつらだ）に対して、「このページをどう扱ってほしいか」を指示するためのものなんだ。なぜ `meta robots` が重要なのか？
君が一生懸命作ったページが、検索結果に表示されてほしくない場合だってあるだろう？例えば、
- 開発中のプレビューページ: まだ公開できる状態じゃないのに、検索結果に出てきちゃうのは困る。
- 会員限定ページやログインページ: そもそも一般公開されるべきじゃない。
- 重複コンテンツ: 同じ内容のページが複数あると、検索エンジンが混乱する可能性がある。
- 一時的なキャンペーンページ: 期間が終わったら検索結果から消えてほしい。
こういう時に、検索エンジンに「このページはインデックスしないでね」「リンクは辿らないでね」と明確に伝える必要がある。それが `meta robots` タグの役割だ。
基本的なディレクティブ（指示）たち
`meta robots` タグで使えるディレクティブはいくつかある。これらを組み合わせることで、様々な制御が可能になるんだ。
1. `index` vs `noindex`
これが一番基本中の基本だ。
- `index`: このページを検索エンジンのインデックス（データベース）に登録してほしい、つまり検索結果に表示してもいい、という指示。
- 実は、この `index` はデフォルトの動作なんだ。だから、特に何も指定しない場合は、検索エンジンは「インデックスしよう」と判断する。
- `noindex`: このページをインデックスしないでほしい。検索結果に表示されたくない、という指示。
2. `follow` vs `nofollow`
これは、ページ内のリンクをクローラーが辿るかどうかを指定するものだ。
- `follow`: このページからリンクされている他のページも、クローラーに辿ってほしい。リンクの「評価」（PageRankとか、そういうやつだ）も引き継いでほしい、という指示。
- これも `index` と同じく、デフォルトの動作だ。
- `nofollow`: このページからリンクされている他のページは、クローラーに辿ってほしくない。リンクの評価も引き継がないでほしい、という指示。
ディレクティブの組み合わせ例：現場でよく使うパターン
これらのディレクティブを組み合わせて、具体的な指示を出すことになる。
- 「このページをインデックスして、リンクも辿ってね」
- `index, follow`
- 実は、これはデフォルトなので、何も書かなくてもこの状態になる。
- 「このページはインデックスしないで。でも、もし見つけたらリンクは辿ってね」
- `noindex, follow`
- これは、あるページ自体は検索結果に出したくないけど、そこからリンクされている他の重要なページにはクローラーに辿ってほしい、という場合に使うことがある。例えば、サイトマップページに `noindex` を設定しつつ、そこからリンクされている各ページへの導線としては機能させたい、なんてシナリオだ。
- 「このページはインデックスしないで。リンクも辿らないでね」
- `noindex, nofollow`
- これは、完全に検索エンジンから隠したいページ。例えば、管理画面や、誰にも見られたくないテストページなんかに使う。
- 「このページはインデックスして。でも、リンクは辿らないでね」
- `index, nofollow`
- これはあまり一般的ではないかもしれない。ページ自体は検索結果に出したいけど、そこからリンクされている先にはあまり「評価」を渡したくない、という特殊なケース。例えば、アフィリエイトリンクがたくさん貼ってあるページなんかで、アフィリエイトサイトへの評価を渡したくない、なんて目的で使われることもある。
コードで見てみよう：実践的なサンプル
よし、ここからは実際にコードを書いてみよう。WordPress のテーマファイルや、静的サイトの HTML ファイルに、 `
` タグの中にこれを追加するイメージだ。サンプル 1: 基本的なインデックス＆フォロー（デフォルトなので、実質は空）
サンプル 2: ページをインデックスさせたくない場合（`noindex`）
よくあるのは、ログインページや会員登録ページ、プライバシーポリシーページなんかを検索結果に出したくない時だ。
サンプル 3: ページもリンクも辿ってほしくない場合（`noindex, nofollow`）
開発中のプレビューページや、本当に誰にも見られたくない、リンクも辿ってほしくないページに使う。
ブラウザやクローラーの裏側：どうやって解釈されるのか？
さて、これらの `meta robots` タグ、ブラウザや検索エンジンのクローラーは、裏側でどうやって処理しているんだろうか？
1. クロール（巡回）の時
クローラーが君のウェブサイトを巡回する際、まずHTMLの `
` セクションを解析する。そこで `meta robots` タグを見つけたら、そこに書かれたディレクティブを読み取る。- もし `noindex` と書かれていたら、そのページをインデックスデータベースに登録しない。
- もし `nofollow` と書かれていたら、そのページに含まれるリンクを辿るのをやめる（または、そのリンクへの評価を渡さない）。
2. 既にインデックスされているページへの変更
ここがちょっとトリッキーなところ。もし、君が既にインデックスされているページに `noindex` を追加した場合、どうなるか？
クローラーは、定期的にウェブサイトを再巡回する。その際に、以前インデックスしたページをもう一度訪れる。そこで `noindex` ディレクティブを見つけたら、「あ、このページはもうインデックスから外してくれって言ってるな」 と判断し、データベースから削除する。
つまり、`noindex` を設定したからといって、即座に検索結果から消えるわけじゃない。クローラーがそのページを再訪問するタイミング次第で、数時間〜数日かかることがある。これは覚えておくといい。
3. `X-Robots-Tag` ヘッダーとの関係
もう一つ、知っておいてほしいのが `X-Robots-Tag` という HTTP ヘッダーだ。これは、HTML の `` タグと同じような指示を、HTTP ヘッダーで返すことができるものなんだ。
HTTP/1.1 200 OK
Content-Type: text/html
X-Robots-Tag: noindex, follow
このヘッダーを使うメリットはいくつかある。
- HTML以外のファイル（PDFや画像など）にも指示できる: `` タグはHTMLにしか書けないけど、ヘッダーならどんなファイル形式でも使える。
- サーバーサイドでの制御がしやすい: Webサーバーの設定（Apacheの `.htaccess` や Nginx の設定ファイル）や、CMSのプラグイン、APIレスポンスなどで動的に制御しやすい。
Google は、`meta robots` タグと `X-Robots-Tag` ヘッダーの両方で指示があった場合、より厳しい方（noindex が指定されている方）を優先すると公式に言っている。だから、両方で `noindex` を指定してしまうと、混乱を招く可能性がある。通常は、どちらか一方を使うようにしよう。
現場でのベストプラクティスと注意点
さて、ここまで基本的な仕様とサンプルを見てきたわけだけど、現場で実際に運用する上で、いくつか気をつけておきたいことがある。
1. デフォルトは「すべて許可」を理解する
繰り返しになるが、`meta robots` タグで何も指定しない、あるいは `index, follow` と明示的に書くのが、デフォルトの「検索エンジンにすべて任せる」状態だ。意図しないインデックスを防ぎたいページ以外は、基本的にはこの状態にしておくのが自然だ。
2. `noindex` の設定は慎重に
「とりあえず `noindex` しとけばいいや」というのは危険だ。本当に検索結果に出なくていいページなのか、よく検討しよう。もし、本来インデックスされてほしいページに誤って `noindex` を設定してしまうと、検索エンジンから忘れ去られてしまう。
3. `nofollow` はリンクの評価を渡したくない時に
`nofollow` は、リンクの評価を渡したくない場合に使う。例えば、コメント欄やフォーラムなど、ユーザー生成コンテンツが多いページで、スパム的なリンクに評価が渡ってしまうのを防ぐために使われることもある。しかし、最近の検索エンジンは `nofollow` を「ヒント」として扱うようになり、必ずしもリンクを辿らないとは限らない。しかし、依然として「評価を渡したくない」という意図を伝える上では有効だ。
4. Google Search Console で確認する
設定した `meta robots` タグが正しく機能しているか、Google Search Console で確認するのが確実だ。
- 「インデックス」>「ページ」 のレポートで、各ページのインデックス状況を確認できる。
- 「インデックス作成できませんでした」の理由に、`noindex` ディレクティブが原因であることが表示されるはずだ。
- 「URL検査」ツール で個別のURLを検査すると、クローラーがどのようにページを解釈しているか、リアルタイムに近い情報が得られる。
5. サイトマップとの関係
`meta robots` タグで `noindex` を指定したページは、通常、サイトマップ（`sitemap.xml`）に含めるべきではない。サイトマップは、検索エンジンに「ここに重要なページがありますよ」と教えるためのものだからだ。`noindex` にしたいページをサイトマップに載せると、矛盾した指示になってしまう。
6. テンプレートやCMSでの実装
WordPress などのCMSを使っている場合、テーマやプラグインで `meta robots` タグを管理できることが多い。例えば、投稿編集画面で「検索エンジンにこの投稿をインデックスさせない」のようなチェックボックスがあったりする。そういう機能があれば、それを活用するのが楽で確実だ。もし自分でテンプレートをいじる場合は、上記サンプルコードのように `
` 内に記述するのを忘れないように。まとめ：君のサイトの「意志」を検索エンジンに伝えよう
`meta robots` タグは、君のウェブサイトが検索エンジンに対してどう振る舞うべきかを指示する、非常に強力なツールだ。
- `index` / `noindex`: ページを検索結果に出すか出さないか。
- `follow` / `nofollow`: ページ内のリンクを辿るか辿らないか。
これらを正しく理解し、適切に使い分けることで、サイトの検索エンジンからの見え方をコントロールし、より戦略的なSEO施策につなげることができる。
今回紹介したサンプルコードは、そのまま君のエディタにコピペして使えるはずだ。まずは、君の担当しているサイトで、本当に検索結果に出てほしくないページがないか見直してみてはどうだろうか。そして、必要であれば `noindex` を設定してみる。その効果を Google Search Console で確認する、というサイクルを回していくのが、実践力を高める一番の近道だ。
これからも、現場で役立つ「生きた」技術情報をどんどん発信していくから、期待していてくれよ。何か分からないことがあれば、いつでも聞いてくれ。
コメント