サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2020年3月31日 22:45
お世話になっております。
モバイルフレンドリーテストで「モバイルフレンドリーではありません」になってしまう件について、テーマとは関係ありませんが、この「ブログ相談」というスレッドで質問させていただければと思います。
【現在の状態】
該当ページ： https://milmemo.net/usb-complete-guide
テストの結果、
- クリック可能な要素同士が近すぎます
- テキストが小さすぎて読めません
- コンテンツの幅が画面の幅を超えています
のいつもの３セットがエラーとして出ています。
レンダリング結果を見ると、本来表示されるべきスマホの横幅100%に対して、ページコンテンツ全体が明らかに縮小されていることも分かります。
投稿は３日前で、即インデックス、インデックスされた瞬間から今に至るまでずっとモバイルフレンドリーテストはエラーです。この後に投稿した記事など、他の記事は問題なくモバイルフレンドリーと診断されます。
また、「ページの読み込みに関する問題」というものも出ています（これは他の記事でも出ますし、中身のエラーは今回のものとは関係ないように思えます）。
【お聞きしたいこと】
過去にも同じエラーが出たことはありますが、時間による解決だったり、再度テストをすることで必ず解消できていました。
また、ページをチェックするとたしかにメインカラムから大きくはみ出ている要素があったこともありました（特にtableなど）。
しかし今回はいくらチェックしてもそういったものは見つけられていません。また、デベロッパーツール、モバイル実機の各ブラウザなどでは一切問題なく表示されています。
この原因について何かご存知の方がいましたら…というのが趣旨になります。同じようなご経験をされた方などの意見を聞ければ、と思っています。
かろうじて思いついたのが、「ページのコンテンツが多すぎて（5万字弱＋画像多数あります）読み込みに時間がかかり、テストのGooglebotがちゃんとレンダリングできていない」という程度です。こんなことってありえますでしょうか？
Topic starter
2020年3月31日 22:46
ページの読み込みに関する問題
2020年4月1日 01:46
みるみさん
いつもお世話になっております。
サーチコンソールでエラーが出ると、なんだか気になってしまいますよね。
ネットで検索すると、モバイルで横スライドさせるグローバルメニューも、ひっかかったという記事もありました。
でも、それよりも気になったのは、実際に該当ページをスマホで閲覧しようとしたら、私の環境では読み込みにとても時間がかかりました。
たぶん、大きなサイズの画像をたくさんアップされていらっしゃることも要因の一つではないかと私は推測しています。
私は、写真の多い記事だと、画像は全てコンテンツ幅ぴったりにリサイズして、photoshopやTinyPing等でできるだけ軽いデータにしてアップしています。
レティーナデイスプレイを念頭に置いて大きいサイズをアップするなんてことは、ほぼしていません。
拡大しないとよくわからない画像でも800px程度にしています。
それでもiphoneで閲覧して、画像が汚いと感じることはほとんどありません。（大した記事がないこともありますが・・）さすがに、ピンチアウトすると、ちょっと粗く感じることはありますけども。
あと、長い記事は、分割してしまうという手もありますし・・
コンテンツ幅がオーバーしている箇所が、もしかしたら、あるのかもしれませんが、私のiphoneでスクロールしてみても、横揺れしてしまうという箇所は見つけられませんでした。
あまり知識のない私の書き込みでは、あまり参考にならないかもしれないですが・・
わいひら reacted
2020年4月1日 12:24
こんにちは。
かろうじて思いついたのが、「ページのコンテンツが多すぎて（5万字弱＋画像多数あります）読み込みに時間がかかり、テストのGooglebotがちゃんとレンダリングできていない」という程度です。こんなことってありえますでしょうか？
調べてみたところ、あるようです。
モバイルフレンドリーテストのbotは、短い時間でタイムアウトするみたいです。
https://support.google.com/webmasters/thread/4318798?hl=en
https://support.google.com/webmasters/thread/8371348?hl=en
ページスピードインサイトでレンダリングできているので、おそらくGoogle検索のbotは、ちゃんとレンダリングしているのではないかと推測します。
×モバイルフレンドリーテストのbot
○Google検索のbot
の場合、順位に影響するのかは不明ですね・・・。
いずれにしても、スピードの改善が必要のように思えます。
過去にも同じエラーが出たことはありますが、時間による解決だったり、再度テストをすることで必ず解消できていました。
サーバーの状況によっては、「外部リソースがたまたま読めない」ということは、よくありますね。
わいひら reacted
Topic starter
2020年4月1日 20:01
leafytreeさん、たなかまさん
ありがとうございます。
やっぱりページの読み込み速度に時間がかかりすぎなのが原因なのでは？ということですよね…。
コンテンツ幅がオーバーしている箇所が、もしかしたら、あるのかもしれませんが、私のiphoneでスクロールしてみても、横揺れしてしまうという箇所は見つけられませんでした。
ご確認もありがとうございました。
モバイルフレンドリーテストのbotは、短い時間でタイムアウトするみたいです。
言われて思い出したのですが、以前になにかの記事で鈴木謙一さんのブログでそのことについて読んだことがある気がしてきました。たしかにこの線が強そうですね。
しかしレンダリング崩れや明らかな異常があるわけではなく、あの微妙なレンダリング結果がよく分からないです…。
ページスピードインサイトでレンダリングできているので、おそらくGoogle検索のbotは、ちゃんとレンダリングしているのではないかと推測します。
PageSpeed Insightsのレンダリングbotは普段のGooglebotと同じものなのでしょうか？ものによってはちゃんとレンダリングしてくれているのは少し安心しましたが、（僕個人の）体感では順位の付きが悪く嫌な予感はしていました。
いずれにしても、そろそろページ速度とちゃんと向き合うべきかもと思いました。色々実験して再度報告させていただければと思います。
（他の方に需要があるかは分かりませんがトピックが閉じていなかったらいつかまた書き込みさせていただきます）
わいひら reacted
2020年4月2日 01:12
PageSpeed Insightsのレンダリングbotは普段のGooglebotと同じものなのでしょうか？ものによってはちゃんとレンダリングしてくれているのは少し安心しましたが、（僕個人の）体感では順位の付きが悪く嫌な予感はしていました。
GooglebotとPageSpeed Insightsのbotは、ユーザーエージェントが違うので、別物みたいですね。
https://webtan.impress.co.jp/e/2019/12/06/34750
▼PageSpeed Insightsのユーザーエージェント
https://stackoverflow.com/questions/16403295/what-is-the-name-of-the-google-pagespeed-user-agent
以下のフォラームの回答をGoogle翻訳すると
https://support.google.com/webmasters/thread/8371348?hl=en
pagespeedツールはページを正しくレンダリングしているようです。つまり、速度の問題は別として、モバイルの使いやすさには問題がありません。
とのことなので、モバイルフレンドリーには、なっているのだと思います。
こちらのゴールドプロダクトエキスパートさんの回答は、「モバイルフレンドリーだけど、速度には問題があるので、改善しましょう」というアドバイスなんだと思います。
僕なりの解釈だと、ユーザーにも、Googleにも、モバイルフレンドリーとは認識されてるんだと思います。←ただ、これの確実なソースが見つからなくて・・・。
Google botのレンダリングは、最新のChrome相当なので、大丈夫そうに思うのですが、上記のソースが見当たらない分、心配ですよね・・・。
わいひら reacted
Topic starter
2020年4月2日 19:47
たなかまさん、詳しいソースをたくさん提供くださりありがとうございます！
たしかに
僕なりの解釈だと、ユーザーにも、Googleにも、モバイルフレンドリーとは認識されてるんだと思います。←ただ、これの確実なソースが見つからなくて・・・。
ここが決定的に安心できない理由にはなっていますね。
しかしこちらに問題があるからどこかしら（今回はモバイルフレンドリーテスト）で不都合が発生しているわけで、結局は問題（読み込み速度？）に対処するしか方法はない気がします。
今週末にまた色々試してみる予定です！
わいひら reacted
Topic starter
2020年4月3日 23:01
Akiraさん、ありがとうございます。
色々確認してみたところ、キャプションを足した画像は他の記事も全てこうなっているようです。
<div>
<img/>(aタグがある場合はこのimgタグがaタグでちゃんと囲われている)
<p id="caption-attachment-xxxxx" class="wp-caption-text">～～～～(閉じタグなしで終わり)
</div>
クラシックエディタ（のビジュアルエディタ）で普段作業をしていますが、これはなんの問題によるものなのでしょうか？みなさんはこうならないのでしょうか？
また、同じエラーが出ているページでもモバイルフレンドリーテストはパスしましたので直接的には関係なさそうです（要因のひとつにはなっているかもしれませんが）。
Topic starter
2020年4月5日 15:44
【解決しました】
報告させていただきます。
やったことや気付いたことを全て書くとまたすごい量になってしまうので、２点だけ。
①：
原因は、tableタグの中にあるimgタグが「配置なし」以外になっている（＝alignnone以外のクラスが付与されている）ことでした。
意味不明ですが、これを直すと正しくレンダリングされました。
もともとデベロッパーツールのモバイル用ビューでも異常はなかったのですが、「PCビュー→モバイルビューに切り替える1回の瞬間だけモバイルフレンドリーテストのエラーレンダリングと同等の表示がなされる」ことが分かり、それを手がかりに記事のスクロールを繰り返したところ原因を突き止められました。
②：
Akiraさんに教えていただいた閉じタグが合わない件ですが、１つ上のレスでも申し上げたように、この問題は別件だったものの解決していないままです（切り分けのためにこの記事だけは手動で全部直すことも試みた上でです）。
というわけで「[caption]ショートコードで正しいHTMLタグセットが出力されない」という内容で別トピックにさせていただいてもいいものか検討中です。
WordPress側（img_caption_shortcode関数など）に異常があるとは思えないので僕の環境によるなんらかの不具合だと思います。
以上です。書き込みいただいた皆様、本当にありがとうございます。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。