はじめてのWordPress入門講座【基礎知識・基本的な使い方・トラブル対応】

GoogleボットがWEBサイトを正しく認識しているかを確認できるFetch as Googleのレンダリング機能。

WEB担当者の方ならすでにご存知の方も多いと思いますが、Googleがウェブマスターツールの「Fetch as Google」の機能をバージョンアップしましたね。

まだ「Fetch as Google」を使って自社のWEBサイトを確認していないという方は、確認することをお勧めします。特にモバイル対応後にモバイル検索での評価を上げたいと考えている方は必須ですね。

ウェブマスターツールのFetch as Google機能

「Fetch as Google」はウェブマスターツールの「クロール」内の機能です。Googleボットと人(ユーザー)と、それぞれからWEBサイトがどのように見えているのか(認識されているのか)を確認することができます。

Fetch as Googleは以前からあった機能ですが、「レンダリング」ができるようになりました。(レンタリング:得られたデータを画像化すること)

WEBサイトが正しく認識されているかを確認する

Fetch as Googleのレンダリング機能を使うことによって、WEBサイト内の「Googlebot」が取得できないデータをチェックすることができます。

特にJavaScriptやCSSが適切に認識されているかは重要です。そしてモバイルサイトであっても同じです。

JavaScriptやCSSをブロックするのは止めよう

GoogleはWEBサイトを適切に把握できるように、すべてのJavaScriptやCSSがクロールできるようにすることを推奨しています。

Google がサイトのコンテンツを完全に把握できるように、サイトのアセット(CSS や JavaScript ファイル)がすべてクロールされるようにしてください。Google インデックス登録システムは、ページの HTML やそのアセット(画像、CSS、Javascript ファイル)を使用してウェブページをレンダリングします。Googlebot がクロールできないページアセットを確認し、robots.txt ファイルのディレクティブをデバッグするには、ウェブマスター ツールの Fetch as Google ツールと robots.txt テスターツールを使用します。

引用元:ウェブマスター向けガイドライン – ウェブマスター ツール ヘルプ

Fetch as GoogleでPCを使った場合のWEBサイトを確認

Fetch as GoogleでPCを使った場合のWEBサイトを確認

Fetch as GoogleでPCを使った場合のモバイルサイトを確認

Fetch as GoogleでPCを使った場合のモバイルサイトを確認

Fetch as Googleの使い方

まずはウェブマスターツールにログインして、確認したいWEBサイトへ進みます。その後、クロール→Fetch as Googleと進みます。
Fetch as Googleの使い方

チェックするWEBページの指定

確認したいWEBサイトのページURLを設定します。
Fetch as Googleの使い方|URLの設定

デバイスの選択

レンダリングするデバイスを選択します。(モバイルサイトを確認したい場合は「モバイル:スマーフォン」を選択)
Fetch as Googleの使い方|デバイスの選択

レンダリングを開始

設定ができたら「取得してレンダリング」をクリック。しばらくGoogleが情報を得るために待ちます。

ステータスにグリーンマークが出たらクリックします。
Fetch as Googleの使い方|ステータス

ステータスについて詳細:Fetch as Google の結果を診断する – ウェブマスター ツール ヘルプ

レンダリング結果が表示されるので、下の方にある「Googlebot はこのページの一部のリソースを取得できませんでした。取得できなかったリソースは次のとおりです: 」以下を確認して、問題箇所をチェックしましょう。

ここに表示される項目はできるだけ少ない方がベストです。JavaScriptやCSS、画像など、Googlebotをブロックをしてしまっている要素があったらできるだけ改善しましょう。改善したら「インデックスに送信」をお忘れなく。

レンダリング結果で「Googlebot ではこのページを以下のように認識しました。」を見ると、Googlebotがほぼ人に見えているのと同じようにWEBサイトを認識しているのがよくわかりますね。

背景色や文字色、文字サイズまでほとんど人と同じく認識しているのは凄いですね。