「Google AdSense」設置で遅くなってしまったページ表示速度の改善

  • CATEGORY : WEB関連

自分用のメモです(o’∀’o)ノ

最近の Google SEO(検索エンジン最適化)で、「ページの表示速度」を見るようになったということで、Googleが用意しているページ速度検証サイト「PageSpeed Insights 」を参考にしながら、直せそうな箇所は直しているのですけどね。

「Google AdSenseプログラム」が一番足を引っ張ってるという現状(;・∀・)

同じGoogleサービスなのに(笑)

どうも…「Google AdSense」が画像データ・フォントデータ・設定ファイルなどなどの複数データを保有しているために表示速度に時間がかかっているというのと、広告を複数設置すると倍々ゲームになっているという罠!_| ̄|○

ここを解決しないと、ページ表示速度の大きな改善は見込めないーと判断したので、早速Google先生に問い合わせ!いつものw

結果!

素敵なサイトさまをご紹介いただけましたъ(`ー゜)ヤッタネタエチャン!

Google AdSense遅延プログラムの設置方法

「Google AdSense」を読み込むJavaScript(adsbygoogle.js)を初回読み込み時に読み込まないようにして、ユーザーアクション(スクロール、/マウス移動、マウス押下、タッチ開始)をすると、読み込み開始するように制御する素敵なJavaScriptでした。

詳しい動作や検証報告など詳細情報に関しては、ページ下の「参照サイト」内に筆者さんのページをご紹介していますので、みてみてください!

ここでは、自分用のメモなので設置方法だけ!(笑)

Google AdSense遅延プログラムの設置方法

JavaScriptはこんな感じに(´・ω・`)つ◎

Google AdSenseの認証スクリプトは書かれてなかったのですけど、ついでなので固めてみました。「ca-pub-xxxxxxxxxxxxxxxxxxx」のところは自分の認証コードナンバーを入れてください。

これを出来るだけ、</body>の直前に配置。

それと、Google AdSenseの読み込みJavaScript「<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>」をHTMLソースからすべて削除する必要があります。

いま配置したコードがこの代わりになるからです。

最後に

このコードに変えてから、PageSpeed Insights の評価が「20以上」あがりましたъ(`ー゜)

動作関係も、私のサイトの広告設置場所はすこしスクロールする必要があるので、相性が良かったですね。

このJavaScriptを公開されてます筆者さんも書いてますが、もし使用する際は自己責任でお願いします<(_ _)>

私にとっては「渡りに船」なコードでしたので、助かってます!

参照サイト:

記事TAG : ,


Leave a Comment

入力エリアすべてが必須項目です。メールアドレスが公開されることはありません。

内容をご確認の上、送信してください。

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

Twitter

MeteorDrive ネコノ

戦略的な提案型デザイナーとして日夜奮闘しています( ゜д゜)ノ

詳細情報はこちら

PICKUP ENTRY

ENTRY RANKING