クライアントサイドでレンダリングしたrel=”canonical”をGoogleは完全無視 #io18 #io18jp

[レベル: 上級]

Google は生 の HTML に記述されている rel="canonical" だけを処理します。
クライント側のレンダリングで生成された rel="canonical" は完全に無視されます。

Web担当者Forum 連載コラムで先週取り上げ、その後 Twitter でも補足したことなのですが、特に、開発者と密接に連携してサイト管理している人にとっては重要な情報なので僕のブログでも触れておきます。

最初の状態で rel=”canonical” を返すこと

JavaScript を使ってクライント側で rel="canonical" を生成させることができます。
言い換えれば、レンダリング後に rel="canonical" を挿入可能です。
JavaScript のフレームワークを使ってもいいでしょうし、Google タグマネージャでも実現可能です。

“クライント” とはブラウザを指しますが、Googlebot も含まれます。
Googlebot は多くのケースで JavaScript を解釈し実行できます。
DOM 操作によって、Googlebotに rel="canonical" をレンダリングさせることが技術的に可能です。

ところが、レンダリングしたあとに挿入した rel="canonical" を Google は無視するのです。
そこにあっても Googlebot は見て見ぬふりをするわけですね。

Google の Tom Greenaway(トム・グリーンアウェイ)氏。Google Sydney の Search Advocate だと自己紹介したと記憶してます)が Google I/O のセッションで説明していました。

同じセッションのスピーカーでもあった、John Mueller(ジョン・ミューラー)氏も事実であることを Twitter で再確認しています。

rel="canonical" を JavaScript で埋め込むのであれば、サーバーサイドレンダリングして、クライント側でのレンダリングが不要な状態にしておかなければなりません。
もしくは JavaScript を使わずに、生の HTML にハードコーディングしておくかです。

rel=”canonical” 以外のタグはどうなの?

rel="canonical" 以外の要素、たとえば、hreflang や rel=”prev/next” をレンダリング後に挿入した場合はどうなのでしょうか?

こちらに関しては言及していません(質問もスルーされている)。
おそらく、同様に無視されるのではないかと推測します。

情報を集めたところでは、title タグ や meta description タグのような meta データはインデックスの対象になるものの、link 要素に関しては機能しないようです。

とはいえ、Google 発の情報ではないので推測レベルにしか過ぎません。
機会を見て確認します。

少なとも、rel="canonical" に関しては裏付けが取れているので認識しておいてください。
多くのサイトで重要になってくる知識だとは思いませんが、関係してくるサイトが少なからず存在するはずです。