プレビューと公開サイトの、検索への出し分け

プレビューと公開用を分ける理由

記事を確認するためのプレビューと、検索エンジンに見つけてもらう公開用ページは、同じHTMLを使うと扱いを誤りやすくなります。確認用URLを検索に出さないことと、公開用サイトを巡回できる状態にすることは、反対の設定を要します。

このサイトでは、同じ記事内容から2種類の静的出力を作ります。通常のbuildはプレビュー用、production指定のbuildは公開用です。ページの本文を切り替えるのではなく、出力に含める検索向けのメタ情報と巡回設定をモードごとに変えます。

生成する検索向けの情報

表は横にスクロールできます。

確認点	プレビュー出力	公開用出力
HTMLのrobots指示	`noindex,nofollow`	`index,follow`
`robots.txt`	巡回を拒否する	巡回を許可し、サイトマップの場所を示す
canonical / Open Graph URL	出力しない	選んだHTTPS originを使って出力
構造化データ / sitemap	出力しない	ページ情報と生成ルートを出力
404	noindex	noindex、canonicalとサイトマップ対象外

プレビューではHTMLのmeta robotsとrobots.txtの両方に検索・巡回を避ける値を出力し、canonicalや構造化データが公開先のように見える情報も加えません。プレビューサーバー自体もローカルだけで待ち受けます。公開用では指定したHTTPS originをもとにURLを作り、通常ページを巡回できるrobots.txtとsitemapを生成します。URLにpath、query、fragment、認証情報やloopback hostが含まれる場合はoriginとして受け付けません。

404ページは公開用buildでも検索対象にしません。サイトマップには実在する生成ルートだけを並べ、見つからないページを一覧へ加えない形です。

robots.txtのDisallowはページを隠す仕組みではありません。Googleの案内では、DisallowされたURLも外部リンクなどから見つかれば検索結果にURLが出ることがあり、robots.txtでブロックされてmeta noindexを読めないと、その指示も適用できません。公開プレビューを検索に出したくない場合は、この出力だけを公開して安心せず、アクセス制限を設けるか、検索ロボットがnoindexを読める提供方法を選びます。Google Search Central: robots.txtの仕組み ↗Google Search Central: noindexで検索対象外にする方法 ↗

設定例と、出力の確かめ方

自分のサイトに同じ考え方を取り入れるなら、まず生成するHTMLのheadをモードごとに分けます。以下は、このサイトのトップページで確認する最小限の例です。

<!-- ローカルプレビューのhead -->
<meta name="robots" content="noindex,nofollow">

<!-- 公開するトップページのhead -->
<meta name="robots" content="index,follow">
<link rel="canonical" href="https://yuzrin.jp/">

公開用のrobots.txtでは巡回を許可し、サイトマップを案内します。別のドメインに使う場合は、canonicalとSitemapの両方を実際の公開URLへ置き換えます。

User-agent: *
Allow: /
Sitemap: https://yuzrin.jp/sitemap.xml

HTMLのソースを開く
ブラウザの「ページのソースを表示」でname="robots"とrel="canonical"を探します。画面上の本文にその単語があるかではなく、head内のタグと値を確認します。記事ページのcanonicalは、その記事自身の公開URLです。
robots.txtとサイトマップを開く
このサイトのrobots.txtと公開用サイトマップを確認します。公開用では存在するページのURLが並び、404ページのURLは含めません。プレビュー用ビルドではサイトマップ自体を生成しません。
存在しないURLでHTTPの状態を見る
ブラウザの開発者ツールのNetworkで、自分のサイトに存在しないURLを開きます。エラー案内が表示されるだけでなく、HTTPステータスが404であることも確認します。200のままでは、ページが見つからないことを正しく伝えられません。

このサイトでは、通常のbuild/checkとproduction指定のbuild/checkをそれぞれ実行し、13ページの検査が両方で成功しました。検査対象はrobots値、canonical、JSON-LD、内部リンク、404の扱い、robots.txtとsitemapのURL集合です。公開用サイトマップは404を除く12ページになっています。

生成確認と公開確認の違い

ローカルbuildとcheckで確かめられるのは、生成物に設定したURLや巡回方針が含まれているかです。公開ホストで正しいファイルが配信されること、検索エンジンが巡回して結果を更新することまでは分かりません。公開後は対象サイトのHTML・robots.txt・sitemapを確認し、検索サービス側の実クロールや反映状態はSearch Consoleなどで別途確認します。

公開用の設定に誤りがあると、意図しないoriginをcanonicalやsitemapへ入れてしまいます。別環境へファイルを配置する前に、originと生成先の組み合わせを再確認してください。

実装と確認方法

build.mjs — preview/productionの選択、robots meta、canonical・構造化データ、sitemap・robots.txtの生成。
check.mjs — 出力モードに沿ったページメタ情報とrobots/sitemapを検査。
preview.mjs — プレビュー用出力をlocalhostに限定して配信。

この記事はローカル出力の設定を説明します。公開ホストへの接続や検索エンジンの登録状態を示すものではありません。