billion-log

ちょっと役立つ節約術やお得な割引情報など「生活」や「お金」に役立つ情報を配信しているサイトです。

Search ConsoleでCSSとJSファイルのブロックに関する重要な警告がきたので対処した


メールにて、Googleから以下のような重要メッセージが届きました。

http://billion-log.com/ の CSS および JS ファイルに Googlebot がアクセスできません

引用:Google Search Console Teamのメッセージ

突然でびっくりしたのですが、最近、PVの減少に悩んでいて「原因はこれ!?」じゃないかと思って早速リサーチ。

Google検索しても、事例が全く見当たらずめっちゃ不安になりましたが、検索期間を24時間にすると、いくつものブログで話題になっていました。直近で起こっていたことのようですね。

しかも、海外SEO情報ブログによると、対象となるサイトへ一斉送信されたようです。それも幅広い範囲で。当ブログだけではないようです。
(毎度のことですが、いち早く記事を作ってくれていてほんとに助かりました)

そして、警告メッセージの何に恐れたかというと、以下のようなメッセージが書かれていたことです。

Google では、これらのファイルによりウェブサイトが正常に機能していることを認識するため、これらのアセットへのアクセスをブロックすると検索結果における掲載順位が本来よりも低くなる可能性があります。

引用:Google Search Console Teamのメッセージ

とんでもないことですよね。当ブログでも早速、対処しましたので、その方法を紹介します。

スポンサードリンク

原因となるCSSとJSファイルを調査

今回の警告は、robots.txtでのブロックにより、Googlebotがアクセスできないファイルができてしまっていること。

解決するには、問題のCSSとJSファイルへGooglebotのアクセスを許可してやる必要があります。
(robots.txtとは、Googlebotのアクセスを制御するファイルです)

ブロックされたリソースで原因を確認

まず、原因となっているファイルをSearch Consoleの「ブロックされたリソース」で確認します。


当ブログでは、上記のように大量にブロックされたURLがでてきました。それまで全くなかったのが、6月末から急激に発生しています。

詳細を見ていくと、その問題となっているURLは、「wp-emoji-release.min.js」と「http://stats.wp.com/に紐づいたjs(例:e-201529.js)」。これらがほとんどのページのソースに読み込まれていました。

このjsに対して、Googlebotがアクセスできない状態になっているということです。

まずは、どちらも見覚えがないURLだったため、調査し検討してみました。

wp-emoji-release.min.js


「wp-emoji-release.min.js」はWordPress4.2から追加された絵文字機能に必要なjsのようです。

そもそも絵文字なんて全く使っていないし、これからも使う予定はないので、アクセスの許可ではなく、読み込みを削除することにしました。

削除するには、functions.phpに以下のコードを追記します。(やるなら必ずバックアップをとってから!)

remove_action( 'wp_head', 'print_emoji_detection_script', 7 );
remove_action( 'wp_print_styles', 'print_emoji_styles' );

これでソースから消えました。

http://stats.wp.com/に紐づいたjs


「stats.wp.com」は、WordPressのプラグイン「jetpack」に関わるURLです。jetpackは、SNS連携に使っていて便利なので、robots.txtによるアクセスの許可で対応してみることにしました。

当ブログでは、上記の2つでしたが、まずは、アクセス許可すべきファイルかどうかをよく調査してみてください。

robots.txtの修正

次に、現状のrobots.txtを確認します。robots.txtは、サーバーのルートに設置されています。もしくは、Search Consoleの「robots.txt テスター」でも確認できます。

当ブログは、以下のように設定していました。

User-agent: *
Disallow: /wp/wp-admin/
Disallow: /wp/wp-includes/

Sitemap: http://billion-log.com/sitemap.xml.gz

注目すべきは、

Disallow: /wp/wp-admin/
Disallow: /wp/wp-includes/

の部分です。Disallowは、「アクセスを許可しない」という意味で、以降のファイルへは、Googlebotがアクセスできないようになっています。

これは、WordPressのデェフォルトの記述です。

wp-adminは、管理系のファイル。wp-includesは、ブログを表示するためのファイルです。

おそらくこの中に、問題のjsが入っているのが原因。ここを許可してやる必要があります。

で、どうするかなんですが「WordPress初心者に贈る!robots.txtの書き方と設定方法全手順|Naifix」のようにディレクトリ単位で、細かくアクセス許可をしてもいいのですが、どこまで許可していいものか分かりません。もっと、ざくっとできないものかと。

そこで、いつも勉強させてもらっている、2つのブログのrobots.txtをのぞいてみました。

▽バズ部

User-agent: *
Disallow: /wp-admin/
Sitemap: http://bazubu.com/sitemap.xml

▽LIG

User-agent: *
Disallow: /wp-admin/

両者ともDisallow: /wp/wp-includes/の記述がありませんね。管理系は許可しないが、表示系は許可するということです。

僕もこれでいくことにしました。

テキストエディタでrobots.txtファイルを開き、修正、サーバーにアップロードして完了です。設定反映には数日かかるようです。

なお、Search Consoleの「robots.txt テスター」で、テストすることもできます。
参考:robots.txt テスターで robots.txt をテストする

追記

この記事を書いた後、Googleのゲイリー・イリーズ氏が、アクセスを許可する簡単な記述を公開してくれました。

User-Agent: Googlebot
Allow: .js
Allow: .css

参考:Stack Overflow

さらに海外SEOブログにも最新の対処方法が紹介されています。
Googleが送ってきたCSSとJSのブロック警告に正しく対応するために必要なこと

こちらも参考にしてみてください。

スポンサードリンク

まとめ

WordPressのサイトを中心に、今回の警告が届いているようですね。

もし、警告がきていたら、
1.Search Consoleのブロックされたリソースで問題を確認・調査
2.robots.txtを修正
という手順で、対処してみるとよいでしょう。