2019.07.24ブログ運営WordPressサーチコンソールでインデックス登録するためURL検査で公開URLをテストしました。するとモバイルユーザビリティに2つのエラーが表示されていた。クリック可能な要素が近すぎますコンテンツの幅が画面の幅を超えていますテーマはCocoonを利用させていただいています。実は結構前からこのエラーは毎回出ていたのですが、問題なさそうなので放置していました。放っておくのはやはり気持ち悪いので、今回本腰を入れて原因を調べてみたところ無事解決に至りました。考察モバイルユーザビリティのエラーサーチコンソールでURLを検査、公開URLをテストをすると「URLはGoogleに登録できますが、問題があります」と表示されます。場所はモバイルユーザビリティで「このページはモバイルフレンドリーではありません」とのこと。詳細を確認すると、問題の件数に2つのエラー表示されていました。クリック可能な要素が近すぎますコンテンツの幅が画面の幅を超えていますはじめは、広告とか表とか画像がはみ出ているのかと勘ぐりましたが、どれも駄目。念の為、Googleのモバイルフレンドリーテストを実行すると「このページはモバイルフレンドリーです」と表示されます。サーチコンソールの拡張にあるモバイルユーザビリティのエラーも0件です。URL検査でテストするとエラーが出るから不思議だ。原因はCSS私は2つのブログでCocoonのテーマを使用しています。今回、もう片方のブログにはエラーが出ていませんでした。そのことから2つのブログの設定を比較していくことで、原因を探りました。結論から先に言いますと、”CSSが原因“でした。「CSSの読み込みが遅い」らしい。CSSの読み込みが遅いCSSを読み込むタイミングに問題がある私のカスタムしたCSSは400行を超えていて、無駄な改行やらが多いからこれが原因だったのかも。WordPressの「Cocoon設定」から「高速化」をクリック。「CSSを縮小化する」にチェックを入れるだけ。これでサーチコンソールの公開URLをテストしてみてください。今度は問題なく「このページはモバイルフレンドリーです」と表示されるはず。試しに「CSSを縮小化する」のチェックを外して、もう一度テストしたら再びエラーが出たので、私の場合はCSSが原因で確定かと思います。素人考えですが、CSSを縮小化することによって、読み込みの遅さが解消したのではないかと思います。このCocoonの高速化は、CSSの余分な改行や余白を整理することによってソースコードのサイズを減らしているらしいので、CSSを見直して整理すれば、縮小化しなくても解決するのかもしれない。Cocoon以外のテーマでも、もしかしたらCSSの読み込みが原因の可能性があるかもしれません。CSSを大量にカスタマイズしたなど、心当たりがある方は確認してみてください。2018年9月やまち当ブログは、私が買ったもの、試したこと、体験したことを紹介しています。このブログの情報が皆さんのお役に立てたら幸いです。2018年9月やまち当ブログは、私が買ったもの、試したこと、体験したことを紹介しています。このブログの情報が皆さんのお役に立てたら幸いです。前へ次へタイトルとURLをコピーしました。