アドセンス、アナリティクスの遅延読込みでページ表示速度を改善する手順【第三者コードの影響を抑える】

今回はWordPressでブログ運営を行っている方向けに、PageSpeed InsightsでGoogleアドセンスやアナリティクスなどの第三者コードの影響を抑え、できる限りページの表示速度を改善する方法を解説していきます。

WordPressでブログ運営を行っている場合、アドセンスやアナリティクスを設置しているとどうしても、ページを開く時に外部URLの影響を受けてしまうためその分表示速度に影響が出てしまうんですね。

これらの要因をPageSpeed Insightsでは「第三者コードの影響」と表現していますが、これらを遅延読み込みできれば、ページの表示速度を改善できます。

どのように対処したのかをまとめましたので、ご紹介いたします。

アドセンス、アナリティクスの遅延読込みでページ表示速度を改善する手順

遅延読込みというのは、ページにアクセスする際に表示される画面内のデータ以外の部分（スクロールしないと見えない部分）を後で読み込んで表示速度を上げましょう、という手法です。

Googleは特にモバイルで画像の遅延読み込みを推奨していますので、ご存知の方も多いと思います。

WordPressの場合は「Lazy Load」プラグインが有名ですね。

これまでであれば、画像の読み込みさえ遅らせられれば問題ありませんでした。

しかし「モバイルファースト」がより重要視される中で、今後は特に表示速度が遅くならないように注意しなければなりません。

そんなわけで色々なサイトを参考にしながらまとめてみました。

手順は次の3つ。

手順① JavaScriptの記述を追記
手順② アドセンス広告のソースを修正
手順③ 第三者コードのURLをAutoptimizeで設定

アドセンスの対応は手順①と②、アドセンスとアナリティクス両方の手順が③になります。

ではひとつずつ解説していきます。

手順① JavaScriptの記述を追記

今回はアドセンス広告そのものを遅延読み込みさせるので、ユーザーがアクセスしたときに表示される範囲に広告がある場合、広告は遅れて表示されます。

手順② アドセンス広告のソースを修正

こちらも貼っている広告すべてのソースを修正します。

この手順①と②だけでも少し変わります。

しかしひとつ、デメリットがあるのでそれも書いておきます。

遅延表示させるため、ユーザーがアクセスした際に最初に表示される画面の中に広告がある場合、少し遅れて表示されます。

そのためすぐにスクロールすると実質表示されていないように見えてしまいます。

特にタイトル下や記事上広告が最初に表示される画面の中に含まれている時、この広告の収益は損失となってしまうかもしれません。

これは「表示速度を改善して検索順位を上げる」方を取るか、「検索順位が悪くてもタイトル下の広告を維持するか」の2択になってしまうかもしれませんね。

手順③ 第三者コードのURLをAutoptimizeで設定

手順③はプラグイン「Autoptimize」を利用していることが前提となります。

これはPageSpeed Insightsでのサイト分析結果の画面で、第三者コードの影響を抑えてくださいと表示された箇所のURLを「Autoptimize」で設定し、サードパーティのドメインに事前接続すると言う仕組みです。

アドセンス、アナリティクスの遅延読込みでページ表示速度を改善する手順まとめ

手順① JavaScriptの記述を追記
手順② アドセンス広告のソースを修正
手順③ 第三者コードのURLをAutoptimizeで設定

有料テーマやSEOに強いと言われる無料テーマを使用するだけでなく、こういった対策でさらに改善が図れるので是非実践してみましょう。

おまけ

今回の記事、実は去年、雑記ブログの方で書いた記事なんですが、まだ需要がありそうなのでちょっと書き直して再度公開することにしました。

WordPressをご利用の方向けの内容になっていますので、WordPressではない方には関係ない内容になっちゃいましたが、もったいないので公開しようかなと。

役に立つ内容だと思いますのでnoteで公開する意味があるかどうかは別として公開します。