2021-05-02 Cloudflare Pages, Vercelを試す / Google noindex 設定方法
今まで GitHub Pages, Netlifyをメインで使っていたけど、Cloudflare Pages, Vercel も使ってみた。
モチベーションとしては、GitHub Pages の機能にはない、PRベースのPreview App機能が試したかったから。
その用途であればNetlifyで実質事足りるのだけど、ナウい感じのサービスを使いたく今回前述の2つのサービスを使ったわけだ。
Cloudflare Pages, Vercel でスタティックサイトデプロイしてみたけどどちらも秒でセットアップ完了して体験良かった。今は GitHub Pages メインで使っているけど Preview 機能が欲しいので、これらに移行してもいいかなと思い始めた
— toshimaru (@toshimaru_e) April 29, 2021
Cloudflare Pages, Vercelどちらも素晴らしかったけど、SEOが問題となった。メインとなるProductionページはGitHub Pagesを使いたいわけだけど、Preview Appを使ってしまうと各々のサービスの独自ドメイン上のProductionページにデプロイされてしまい、SEOにおける”重複コンテンツ”となってしまう。
Netlify Snippet injection
Netlify の Snippet injectionを使うとこれは解決できる。
つまり、HTMLの<head>
セクション内に noindex を埋め込んでやると良い。
Snippet injection | Netlify Docs
残念ながらこの機能と同等なものは Cloudflare Pages, Vercel どちらにも存在しないようだ。
Google noindex
余談だがGoogle noindexの設定方法として robots.txt
を利用する方法を考えていたが、robots.txt
でnoindexは設定できないらしい。
重要: noindex ディレクティブが有効に機能するようにするためには、robots.txt ファイルでページをブロックせず、クローラがページにアクセスできるようにする必要があります。ページが robots.txt ファイルでブロックされるか、クローラがページにアクセスできないと、クローラは noindex ディレクティブを認識しません。そのため、たとえば他のページからリンクされていると、ページは検索結果に引き続き表示される可能性があります。
下記2つの方法で noindex 設定が可能。
- metaタグ
-
<meta name="robots" content="noindex">
-
- HTTP レスポンス ヘッダー
X-Robots-Tag: noindex
Netlifyは2の仕組みでnoindexしている。
X-Robots-Tag: noindexというヘッダを返してくれるようになっています。これによりインデックス化されないようです。