ブラウザのキャッシュを活用するの対策！広告バナーを消して表示を高速化

広告バナーを減らせばページ表示スピードは向上する

　
広告バナーを減らせばページ表示スピードは向上する！
　
このことに触れているブログはほとんどありませんが、あなたのブログに貼っているそのアフィリエイトの広告バナーが表示スピードに悪影響を与えています！
　
それを消すだけでページの表示スピードは向上します！
　
　
「Page Speed Insights」に出ている「ブラウザのキャッシュを活用する」「画像を最適化する」の未対応のリストも広告バナーが原因です！
　
　
万に一つでもクリックされれば……なんて期待してはいるものの、何の収益も上げていないバナーはきれいさっぱり消してしまいましょう。
（正確には、バリューコマースのバナーが原因です。違うアフィリエイトに変えるか、消してしまいましょう！）
　
　

mod_deflateと mod_expiresを設定しても消えない修正の指摘

Page Speed Insightsの指摘

　
「SEO対策！.htaccessのmod_deflateでファイル圧縮送信で高速化」と「SEO対策！.htaccessのmod_expiresでブラウザキャッシュで高速化」の記事に書いた mod_deflateと mod_expiresを使って処理を使って「ファイルを圧縮する処理」「ブラウザにキャッシュさせる処理」の対応を行っても「Page Speed Insights」でチェックすると「ブラウザのキャッシュを活用する」「画像を最適化する」の項目がまだまだ残っていました。
　

　
これはなんだろうと思って「修正方法を表示」をクリックして表示される内容をよくよく見てみると、下記の様に書いてあるのです。
　
「ブラウザのキャッシュを活用する」では
http://ad.jp.ap.valuecommerce.com/vc/images/**/**/**/**.gif（有効期限が指定されていません）
　
「画像を最適化する」では
http://ad.jp.ap.valuecommerce.com/vc/images/**/**/**/**.gif をロスレス圧縮すると 4.4 KB（22%）削減できます。
　
これが今回の記事の主目的である画面表示の高速化を妨げる元凶の広告バナーなのです。
　
　

キャッシュと最適化が反映されない原因

　
.htaccessに mod_deflateと mod_expiresの設定を行って、ファイルを圧縮してブラウザに送る処理、送ったファイルをブラウザにキャッシュさせる処理は、自分のサーバにおいてあるファイルに対しては有効なのですが、外部ファイルを直リンクで読み込んでいる場合は mod_deflateと mod_expiresの設定が有効にならないのです。
　
そのため、mod_deflateと mod_expiresの設定を行っても、「Page Speed Insights」でチェックをすると、ブラウザキャッシュされていない、画像が最適化されていない、との表示が残ってしまうのです。
よくよく確認をしてみると、それで表示されているものは、外部ファイルから読み込みをしている広告バナーや、Googleの JavaScriptや Analyticsのタグの JavaScriptなどであることが分かるでしょう。
　
　

外部に直リンクで設定しているファイルへの対応方法

　
自サーバにファイルがなく、直リンクで読み込んでいるファイルのうち、Googleの JavaScriptなどはダウンロードしてきて自分のサーバに置き直すことで圧縮して送信され、ブラウザにキャッシュされるようになります。
（JavaScriptへのリンクのパスなどの修正は必要です。）
　
ですが、それらのファイルが更新された際にはその都度ダウンロードしてくる作業が必要ですし、広告バナーや Analyticsのタグはそれらの対応ができません。
　
　
そこで、対応する簡単な方法として、
　　役に立たない広告は消してしまいましょう！
となるのです。
　
　

広告バナーを消してみた効果

　
元々このエス技研ブログには 9枚のバリューコマースのバナーが貼ってありました。
それを消したときに「Page Speed Insights」の値がどうなったかが下記の数値です。
　
　　PC　71　→　75　　SP　59　→　61
　
何と、mod_deflateと mod_expiresで対策をしたより効果が高いのです！
　
実際に「Page Speed Insights」で指摘があった「ブラウザのキャッシュを活用する」「画像を最適化する」の項目が「修正が必要」から消えているのです。
　

　
すごいですねぇ。
今すぐバリューコマースのバナーを外したくなったでしょ？
　
　
ちなみに、いつもは貼っていない Amazonとリンクシェアのバナーを同じように 9個ずつ貼って試してみたところ、「Page Speed Insights」の表示スピードには影響をしませんでした。
つまり、表示スピードが遅くなるのはバリューコマースだけの特有の問題のようです。
（バリューコマースは技術力が足りていないか、ユーザへの配慮が足りていないと言うことでしょうか？）
　
つまりは、バリューコマースの広告を貼るのは止めて、Amazonかリンクシェアのバナーにすべき！と言うことですね。
　
　
ちなみに、Google AdSenseを貼ると、
「ブラウザのキャッシュを活用する」で下記が
http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
http://pagead2.googlesyndication.com/pagead/osd.js (60 分)
　
「画像を最適化する」で下記が
http://pagead2.googlesyndication.com/simgad/******** をロスレス圧縮すると 861 バイト（3%）削減できます。
表示されます。
　
つまり、Google自体もその辺しっかり対応できてねーって言うことでしょうか？？？
　
ただ、そもそも大した額ではありませんが、このブログの広告収入のほぼ 100%が Google AdSenseからの収入なわけなので、外すわけには行かないのでそのままです。
　
　

広告を外すと表示スピードが速くなると考えたきっかけ

BJ Lazy Loadを設置している際の出来事

　
広告を消すと速くなるんじゃないか、と考えたのは「SEO効果絶大！PVもアップするWordPressの高速化プラグインBJ Lazy Load」で記事を書いている Lazy Load系プラグインを試しているときでした。
　
　
Lazy Load系のプラグインの中の「BJ Lazy Load」は、画像だけではなく iframeなども含めて事後読み込みをする機能が実装されています。
　
そのため、「Lazy Load」と比べて「BJ Lazy Load」が好調な結果を出したときは、「好調な理由は iframeの処理にあるんじゃないか？」と考えてたわけです。
広告や SNSのメッセージボックスなどは iframeの仕組みを使って利用して編集しているものが多々ありますので。
　
ですが、「iframeへの適用」を「No」にしてみましたが結果は変わりませんでした（「Yes」の状態と変わらず好調な結果を出していました）。
（「BJ Lazy Load」の設定方法については「SEO効果絶大！PVもアップするWordPressの高速化プラグインBJ Lazy Load」に記事を書いていますので参考にしてください。）
　
ですが、じゃぁ実際に広告を消してみたらどうなのだろう？と、「iframeへの適用」を「No」の状態で、右側のウィジェットに編集していたアフィリエイト（バリューコマース）のバナー 9点を削除して「Page Speed Insights」でスピードを計測してみたところ、上記に書いたように明らかな違いが見て取れたのです。
　
　
そんなわけで、当たり前のことながら外部サービスから情報を取得する仕組みは極力排除することをお勧めします。
特に、アフィリエイトバナーは貼っていても収益につながっていないなら、スピードアップのボトルネックになっていますので、思い切って外してしまいましょう！
　
バリューコマースのアフィリエイトから多くの収益を得ているサイトを運営している方は悩みどころだと思いますが、数を絞り込んでいくことも必要かもしれませんね。
（このことが世間に広まっていくと、バリューコマースは何かしらの対応をするんでしょうけども。）
　
　
また、このエス技研ブログには Facebookのウィジェットを貼っていませんので実験はできませんでしたが、「ブラウザのキャッシュを活用する」には Twitter関連と思われる JavaScriptがリストアップされていますし、Facebookや Twitterや Google+のウィジェットや、「いいね！」の SNSボタンなどもスピードに影響する可能性がありますので、スピードに影響しない設定の方法を試してみる必要がありそうです。
（実験する機会があれば、改めてレポートしたいと思います。）
　
　

広告を外すことのその他のメリット

　
実は、バナーを消すことで、画面表示が早くなること以外にもメリットがあるのです。
　
上記のサイトの「原則 #5: 多くの余白を設ける」がそれになります。
　http://www.seojapan.com/blog/eye-tracking
　
　
空白があるととにかくそこにはバナーなどで埋めたくなりますが、空白があることで余裕が生まれ、落ち着いて記事を最後まで読んでもらえることが分かっています。
　
そんなわけで、バナーを外すことを躊躇してはいけませんね。
　
　
最後に、ページ表示の高速化施策としては「WordPressの高速化でSEO対策！広告費も削減！高速化の施策のまとめ」にまとめ記事を書いていますので、あわせて参考にしてみてください。