ブラウザのキャッシュを活用するの対策!広告バナーを消して表示を高速化
2017/03/12
広告バナーを減らせばページ表示スピードは向上する
広告バナーを減らせばページ表示スピードは向上する!
このことに触れているブログはほとんどありませんが、あなたのブログに貼っているそのアフィリエイトの広告バナーが表示スピードに悪影響を与えています!
それを消すだけでページの表示スピードは向上します!
「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対策!広告費も削減!高速化の施策のまとめ」にまとめ記事を書いていますので、あわせて参考にしてみてください。
GoogleAdwords
GoogleAdwords
この記事が参考になったと思いましたらソーシャルメディアで共有していただけると嬉しいです!
関連記事
-
EストアのショップサーブのWordPressサービスにメリット無し
ショップサーブのオプションサービスのWordPressを使ってみましたがデータベースには直接触れず使えないサービスでした。
-
Selenium WebDriver、Pythonをインストールし Chromeの自動操作の環境構築手順のまとめ
Selenium WebDriverを使ってChromeを自動操作する環境を構築する手順のまとめ。使用するPythonのインストールから、サンプルスクリプトの動作確認までを詳細解説。
-
直リンクとは何か?直リンクとディープリンクの違いと著作権問題
直リンクは著作権違反なのか?議論の前にまず「直リンク」の意味を正しく理解しよう。直リンクは他のサイトの画像を読み込む、ディープリンクなど多様な意味がある。
-
.gitignoreを更新しても反映されないときは「git rm -r –cached .」でキャッシュを削除
gitの.gitignoreを変更しても記述内容が反映されない時がある。それはGitのキャッシュが残っているため。そんなときは「git rm」コマンドを使ってキャッシュを削除すれば解決する。
-
日本語は2バイト文字?3バイト文字?
日本語は2バイトという理解でしたが、UTF-8では事情が違います。その説明です。
-
PythonでURLの有無、存在をチェックするスクリプト
PythonでURLが存在するか否かのチェックスクリプト。ライブラリ「urllib2」を使い、指定のURLにアクセスしそのレスポンスコードを判別するという仕組み。
-
.htaccessのmod_deflateでファイル圧縮送信で高速化でSEO対策!
Page Speed Insightsの指摘事項であるファイルの圧縮送信の対応方法。処理内容の解説もあるけど、.htaccessにコピペするだけの簡単設置で効果抜群!SEOにも威力を発揮!
-
mod_pagespeedでWebサイトを超簡単高速化・Google謹製の最終兵器
Webサイトの表示スピード高速化の最終兵器、Google謹製mod_pagespeedの解説です。レンタルサーバではX-Serverでしか利用できませんが、ワンクリックで高速化します。
-
Selenium WebDriverでFirefoxをプライベートウィンドウ/Chromeをシークレットモードで起動する方法・言語はpython
Seleniumでは初期状態でブラウザを起動する Seleniumでブラウザ …
-
Webサイト公開時に重複コンテンツを排除する.htaccessのリダイレクトの設定のまとめ
サイトを公開する際にはURLの正規化は必須です。正規化とは何かを解説し、.htaccessに設定すべきリダイレクトの設定を具体的に説明します。