Googleからモバイルユーザビリティの問題修正の指摘を受けたのに対し、早速問題点の検出を行いました（詳しくは⇒当サイト「モバイルユーザビリティの問題修正点の検出方法」を参照）。

「PageSpeed Insights」の「ユーザーエクスペリエンス」で指摘された修正個所は、以下2点でした。

●コンテンツのサイズを表示域に合わせる
●タップ ターゲットのサイズを適切に調整する

[修正方法を表示]をクリックしてみると、該当ページの問題個所のHTMLコードとともに具体的な修正点が表示されています。

「PageSpeed Insights」の下記ヘルプを参考にしながら、CSSの修正を行いある程度改善されました。

●コンテンツのサイズをビューポートに合わせる
●タップ ターゲットのサイズを適切に調整する

しかし、それでもまだクリアされない修正点がありました。

それは、Googleのアドセンス広告のコードの中の箇所でした。

例えば、該当ページのレスポンシブ対応のアドセンス広告を貼っている箇所では、レスポンシブ対応にもかかわらず、「表示域から外れている」と指摘されたり、同じくアドセンスの広告リンクの箇所では、リンクテキストが「タップターゲットが他のタップターゲットの近くにあります。」と指摘されています。

該当サイトは、WordPressで構築し、レスポンシブ対応のテンプレートを使用しています。

テンプレート自体の問題であれば、上述のようにCSSファイルを適宜修正することにより、ビューポートに合わせたり、タップターゲット同士の間隔をあけたりなど、ある程度の修正は可能です。

しかし、Googleのアドセンス広告のコードに関しては、ご存じのようにJavaScriptで外部ファイルを読み込むようになっており、また、コードを変更することはポリシー違反に抵触する可能性もあるので、こちらで修正できるものではありません。

従って、アドセンスのコード箇所に関してはとりあえずそのままにしておくしかないと判断しました。

とりあえず、CSSで修正可能な点は修正しましたので、念のため、モバイルフレンドリーテストを試してみました。

モバイルフレンドリーテストは、Googleから提供されているツールで、ウェブページがモバイルフレンドリーの条件を満たしているかどうかを確認できるというものです。

該当ページをモバイルフレンドリーテストで確認してみると、「このページがモバイル対応ではない理由」として、「PageSpeed Insights」で指摘された点と同じ内容が表示されるとともに、以下の赤枠で囲った「このページはGooglebotにどのように見えているか」という箇所がエラーとして表示されていました。

内容は、以下のようなものでした。

このページはGooglebotにどのように見えているか
このページで使用している○件のリソースがrobots.txtでブロックされているため、結果とスクリーンショットが不正確である可能性があります。

確かに、モバイルフレンドリーテストの結果で表示されるモバイルサイトのスクリーンショットのデザインが、まるでCSSファイルが読み込まれていないかかのうよにデザインが崩れてしまっています。

そして、[リソースの表示]をクリックしてみると、ブロックされているリソースが表示されます。

ブロックされているリソースは、ウェブマスターツールの[クロール]→[Fetch as Google]で検索ボックスにページURLを入力し、[取得してレンダリング]をクリックしても確認できます。

ブロックされているリソースを見てみると、以下のようなWordPressファイルで、以前にrobots.txtでブロックしたことのあるファイルばかりです。

/wp-content/○○○
/wp-includes/○○○

中には、テーマのCSSファイルもブロックされているようで、スクリーンショットが正常に表示されないのもこのためです。

なぜ、これらのファイルをrobots.txtでブロックしていたかというと、WordPressの場合、サイトの表示に不要なファイルが検索エンジンにインデックスされないようにするため、また、パラメータ付URLが複数生成されてしまい、重複コンテンツにならないように施した対策でした（詳しくは⇒当サイト「同一コンテンツに対しパラメータ付URLの重複ページが複数できてしまう」参照）。

ただ、スクリーンショットが正常に表示されないだけで、robots.txtでブロックしてもインデックスされないだけで、サイトは正常に表示されています。

なぜリソースをブロックしたことが、モバイルフレンドリーテストでエラーとなるのかわからなかったため、ヘルプの「Googlebot へのブロックを解除する方法をご確認ください。」を読んでみると、以下のような気になることが書いてありました。

これらのファイル（JavaScript、CSS、画像ファイル）のクロールを、サイトの robots.txt ファイルで禁止している場合、コンテンツのレンダリングとインデックス作成を行う Google のアルゴリズムの動作に直接悪影響を及ぼし、結果としてランキングが最適化されなくなる可能性があります。

つまり、レンダリングに必要なJavaScript、CSS、画像などのファイルをrobots.txtでブロックしていると、アルゴリズムの動作に直接悪影響を及ぼし、ランキングにも影響を与えるということのようです。

どうやら、今回、モバイルフレンドリーテストで、エラーが表示されたというのもこの点に関してだと思い、試しにrobots.txtでブロックしていた記述の中から、エラーで表示されたリソースが含まれるフォルダなど以下の記述を削除、クロールを許可し、robots.txtファイルをアップロードし、更新しました。

Disallow: /wp-includes/
Disallow: /wp-content/
Disallow: /*?*
Disallow: /*?

そして、再度、モバイルフレンドリーテストを試したところ、まだ以下のように「ブロックされているリソース」の欄にはアドセンス関連に関するコードが残っていますが、それでも「問題ありません。 このページはモバイル フレンドリーです。」と表示され、無事クリアすることができました。

この後、修正後のrobots.txtが検索エンジンに認識されれば、ウェブマスターツールにおいてのモバイルユーザビリティエラーのメッセージも消えるものと推測されます。

ただ、それでも1件だけブロックされているリソースとして、以下のアドセンス関連のリソースが残ってしまいました。

http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js

これはアドセンス広告の非同期コードの一部で、レンダリングが完了してから読み込まれるファイルのようなので、どうやら、これは残ってしまっても問題ないようです。

これに関連したGoogleのプロダクトフォーラムに、同じようなやり取りをしている以下のページがありました（英文なので要翻訳）。
https://productforums.google.com/forum/#!topic/webmasters/0nTei4YD_H4

今後、robots.txtから、上記記述を削除したので、これからは、インデックスされなくてもよいWordPressファイルがインデックスされてしまったり、パラメータ付URLが複数生成されてしまい、重複コンテンツになってしまう可能性も出てきます。

インデックスしてほしくないWordPress関連ファイルについては、以下のようにモバイルフレンドリーテストでブロックしないように指摘を受けたリソースのみを許可するというrobots.txtでの設定にしてもよいかと思います。

Disallow: /wp-content/
Allow: /wp-content/ブロックしないよう指摘を受けたファイル名

重複コンテンツに関しては、以降は、ウェブマスターツールの「URL パラメータ」で制御していきたいと思います（詳しくは⇒「ウェブマスターツールの「URLパラメータ」で重複ページを統合する」）。