「PageSpeed Insights」タグアーカイブ

サイトのスピードは画像によってずいぶん変わりますね

先日、 PageSpeed Insights のスコアが悪いという話を書きましたが、やったことを書いてみますね。まぁ、参考になるかどうかはわかりませんけどね。

プラグインを厳選

SEO に関するプラグインもこの際外してみました。正直あまり効果はなさそうです。プラグインを外すことは、 WordPress の Core システムの応答時間の短縮につながりますね。しかし、私の環境下においてはあまり効果は出ませんでした。

PageSpeed のサイトでは、サーバーの応答速度に関するコメントが必ず一番上に表示されました。先のエントリでもちょっと書きましたが、サーバーの応答速度を上げるのはプラン変更で可能になると思います。しかし、今回はそこまでのことをしたいとは思っていませんので、サーバー変更は却下です。

とはいえ、応答速度の改善という意味では多少なりとも効果があるであろうと言うことで普段使いのプラグイン以外は外して運用しています。

画像をリサイズ

リサイズというと縦横のサイズのことがもっとも言われますが、それを含めて画像の大きさを見直しました。

私が使っているのは、 iMac の 2018 年モデル。 Retina ディスプレイモデルです。そしてけっこう頻繁にスクリーンショットを使っていました。 Retina ディスプレイというのは、ピクセルサイズが非常に細かいんですね。 Retina ディスプレイで見ると、普通の大きさでも実サイズは結構大きいということよくあります。

なんせ、 4096×2304 ピクセルですからね。スクリーンショットはそのサイズになってしまうわけです。私のブログだと width5 〜 800 ピクセルあれば十分です。全てではないのですが、サイズを変更してみました。

これ効果がありました。読込速度の改善に極めて効果がありました。画像サイズというか、画像最適化をするプラグインも使っていたのですが、プラグインに頼るのではなく、実際の画像サイズを小さくしてやることの方が数倍効果的だという結果になりました。

モバイルは難しい

エントリの冒頭の写真はパソコン環境の採点で、 90 点オーバーになっています。しかし、問題のモバイル環境の方は、

モバイル環境の採点

このように、 60 点です。パソコンからの流入が多いのが私のサイトの特徴ではあるのですが、モバイルも無視できませんよね。及第点にはちょっと届かない感じですね。

実は悩ましいことに、 AMP 関連のプラグインを入れるとモバイル環境の採点がガクッと落ちてしまうんです。それどころか、 AMP 関連のプラグインはパソコン環境にも影響を与えるようで、思わしくないのです。 AMP というのは簡易 ( でもないけど ) サイトでモバイルの読込速度を上げられるというものです。いや、悪くないと思うのですが、どうも私の環境ではダメでしたね。

少なくともこのスコアを維持したい

油断するとこういうスコアはすぐ落ちてしまいます。油断するというか、忘れるというか。パソコン環境では 90 点台を、モバイル環境の方は最低ラインとして現在の 60 点を維持していきたいと思います。

AMP 関連の改善も進めていきたいですね。何が足かせになっているのか今のところよく分かっていないです。個別のエントリアドレスに関しても調べてみましたが、ほぼ同程度のスコアが出ています。トップページが改善されれば、エントリページも改善されると言うことでしょうね。

何とかがんばっていきたいと思います。


孤独とは、港を離れ、海を漂うような寂しさではない。本当の自己を知り、この美しい地球上に存在している間に、自分たちが何をしようとしているのか、どこに向かおうとしているのを知るためのよい機会なのだ。

アン・シャノン・モンロー

Page Speed Insights の点数が低い!

Google さんの PageSpeed Insights にちょっとはまり込んでいます。「 WordPress サイトの高速化」吉田哲也さんのブログなんですが、これを見て自分のブログでもやってみたのです。いけませんなぁ。モバイル 35 点 …

私のブログは、 Lolipop さんのスタンダード・プラン上にあります。より高いグレードのハイスピード・プランならレスポンスが改善されるはずですが、まぁそうも言っていられません。現状の状態でどのぐらい改善できるかやってみました。

まだ途中ですが、パソコン環境は 80 〜 70 点、モバイル 35 点って、落第ですね。

あまり考えずにプラグインを入れていった結果、プラグインを厳選することでパフォーマンスはある程度あがったようです。あとは画像。これもよく考えずに馬鹿でかい画像をそのまま上げていました (iPhone の画像でかいんですよね ) 。以前もいじってけっこう高い点数にしていた気がするのですが、すっかり忘れて色々手を入れて点数も下がっていました。

パソコン環境では 80 点台を、モバイル環境はせめて 50 点台にしないとなぁ。まずは画像に気をつけてやってみます。


「仲間を大切にしない奴はそれ以上のクズだ」

はたけカカシ「 NARUTO 」

遅延読込プラグインを導入

遅延読込プラグイン (Lazy Load) を導入しました。遅きに失した感はありますが、とりあえず導入して様子を見てみます。

参照したのは「 WordPress でスクロールにより画像を遅延読み込みするプラグイン Lazy Load 」です。ここで記述がある GoogleBot に対する対応と、スマートフォン向けの対応を実施しました。直接プラグインのソースに手を入れますので、 1 度プラグインを OFF にしてから行うのが鉄則です。私は忘れてましたが(汗

上の画像は PageSpeed Insights という Google さんのページでこのブログを評価してもらったものです。どちらもギリギリですが、 GOOD の評価をもらいました。すごい人はいるもので、このページで 90 点以上を稼ぎ出す人もいるらしいです。ただ、速度が速いのはもちろんいいことですが、それ以外のことにも注目しなければいけませんので、私はこの点数を維持することを目標にします。

このプラグインの効果のほどはいかほどか? 楽しみです。


我々は、我々の歴史の中に我々の未来の秘密が横たわっていることを本能的に知る。

岡倉天心