JavaScriptで書かれたコンテンツはGoogleから評価される?されない?の謎に迫る

633
Pocket

少し前までは、JavaScriptを使った動的コンテンツはGoogleから評価されにくいと言われていました。そのため、まだまだJavaScriptを使うことを避けたほうが良いと思っている方も多いのではないでしょうか。しかしクローラ(Googlebot)のレンダリング機能も日々進化しているため、現在ではその状況は大きく変わっています。

今回はJavaScriptで書かれたコンテンツがGoogleからどのように評価されているのか、またJavaScriptでコンテンツを作成する場合の注意点や自分でレンダリングの状況を確認する方法についてお話します。

おさらい なぜJavaScriptで書かれたコンテンツは評価されないと思われているのか

「JavaScriptで書かれたコンテンツはGoogleから評価されない」。このような認識が広まったのは、主に2つの理由からでした。

1:JavaScriptを使用することでコードが冗長化しGoogleのクローラが途中でクロールを停止してしまう可能性がある

2:以前は実際にGooglebotはJavaScriptをうまく読み込めなかった

しかし私たちが考えるよりもGoogleのクローラ(Googlebot)の機能の進化はずっと早く、2014年5月23日のGoogle Webmaster Central Blog(英語)でJavaScriptを理解する能力を向上させていると公式にアナウンスがありました。

GooglebotがJavaScriptで作られたコンテンツを読み込めなかった時代は、もはや過去のものといっていいでしょう。

JavaScriptで書かれたコンテンツはHTMLより不利にならない

GoogleのトレンドアナリストであるJohn Mueller氏は、2016年12月に自身のTwitterで受けた「JavaScriptで作られたコンテンツはHTMLより不利になるか?」という質問に対して「いいえ、JavaScriptで生成されたコンテンツは(もし私たちが表示、認識できれば)HTMLと同じように扱われる」と回答しました。

JavaScriptで書かれたコンテンツは、HTMLで作られたコンテンツと同じようにGoogleは認識・評価されるようになっているといえます。ただし、ここで気をつけなければいけないのが”もし私たちが表示、認識(render/index)できれば”とJohn Mueller氏が注釈をつけて回答している点です。

この点について掘り下げて見ていきましょう。

JavaScriptでコンテンツを作成する際に気をつけるべき点

JavaScriptでコンテンツを作成する場合には、GoogleがきちんとJavaScriptを実行できる設定になっているかどうかが重要になります。

もし、サーバーへの負荷を避けるためにrobots.txtを使ってクローラの巡回を避けている場合は、Googlebotはそのサイトを正しく認識できなくなってしまいます。その結果自らのページの検索順位を下げる結果になってしまったら、自分で自分の首を絞めているようなものではないでしょうか。

以前robots.txtを設定したままで放置になっている……という可能性があるようなら、一度チェックしてみましょう。

※robots.txtのエラーについてはSearch Consoleのrobots.txt テスターを使用すれば確認ができます。

Googlebotがきちんとクロールできる状況を作っておくことを意識してください。続いて、Fetch as Googleを使ったGooglebotによるレンダリングの確認方法を見ていきましょう。

Fetch as Googleでレンダリングの結果を確認する

GooglebotがJavaScriptを殆どHTMLと同じように処理できるようになっているといっても、あまりにも複雑な記述だとうまく認識されない場合がないとはいえません。

そのため、Search ConsoleのFetch as Googleで確認しておくと安心です。

Search Consoleにログインした状態でダッシュボードから「クロール」「Fetch as Google」と進み、確認したいページを入力します。(サイトのトップページを確認したい場合は空欄のままにしておいてください)。

「取得」と「取得してレンダリング」の2つの項目がありますが、「取得してレンダリング」を選んでクリックしてください。

serchconsole

指定したURLの結果が下に表示されるので、その列をクリックするとGooglebotからどのように見られているかが分かります。

もし、JavaScriptのコンテンツが読み込まれていなければ、ここで確認することができるのです。

fetchasgoogle

検索サイトに早くインデックスさせるためにFetch as Googleを使っているという方は多いと思いますが、ここでいつも「インデックス登録をリクエスト」を押すことで終わってしまっていませんか?ふだんからレンダリングまで確認していないという方もいらっしゃるのではないでしょうか。

JavaScriptのエラーだけではなく、他のエラーも視覚的に分かりやすく確認できるので定期的に確認する癖をつけておきたいものです。PC版だけではなく「モバイル:スマートフォン」版でも確認しておきましょう。

稀に、ブラウザのキャッシュで確認しても良いのでしょうか?と質問をされることがあります。結論からいいますと、キャッシュページをレンダリングしているのはブラウザになるため、Fetch as Googleのレンダリング結果とは別物です。Googlebotが見ているレンダリング結果を確認できる唯一の手段は、Fetch as Googleのみになるので注意しましょう。

まとめ

ここまで、JavaScriptを使ったコンテンツはGoogleからきちんと評価されること、およびGooglebotからどう見られているかの確認方法についてお話してきました。

JavaScriptでコンテンツを作成するべきかどうかの判断は、Googleのウエブマスター向けガイドラインをもとに考えると良いでしょう。

・検索エンジンではなく、ユーザーの利便性を最優先に考慮してページを作成する。
・どうすれば自分のウェブサイトが独自性や、価値、魅力のあるサイトといえるようになるかを考えてみる。同分野の他のサイトとの差別化を図ります。

つまり、JavaScriptを使ったほうがユーザーにとって利便性の高いサイトになるのであればどんどん使うべきです。
ただし、クリックをすることで生成される展開型のコンテンツは、クローラはインデックスしません。クローラが来訪した状態でHTMLソースに存在しないコンテンツです。クローラが来訪したと同時に展開されるJavaScriptのコンテンツは、今のGoogleであれば、ほとんどを認識できると思います。

  • ユーザーにとって本当に見やすく、分かりやすいコンテンツになっているか
  • robots.txtの設定をしていないか
  • Fetch as Googleでエラーになっていないかを確認し、修正点があれば対応する

ぜひこの3点を意識して、むやみに恐れずにJavaScriptを使いこなしてください。

Pocket

無料ebook

【超実践編】実際のGoogleアナリティクス画面を見ながら学べるアクセス解析入門講座
姓(必須)
名(必須)
会社名(必須)
電話(必須)
メールアドレス(必須)
個人情報のお取り扱いについて

競合比較ができるSEOツール SEOカウンセラー

最大10項目(順位/被リンク数など)の競合調査が無料でできます。

プロモニスタ編集部
プロモニスタでは、コンテンツマーケティングとコンテンツSEO、SEO対策を中心にwebマーケティング関連の最新情報やノウハウ、当社の事例を発信しています。