どうもreuです。
最近googleのPage Speed InsightのUIや仕様が変わったらしいです。正直いままでサイトのスピードについて気にしていなかったのですが、なんか読み込み遅いなーって思う事も多くなってきたので使ってみたところなんとスコアが100点中17というひどい結果に。
なんでこんなに低いの？って思ったんですが、いろいろ調べてある程度改善できたのでその方法を簡単に記載しておきたい。
目次
モバイルスコアが厳しい判定に変更？
結論から書くと改善後の結果は以下の結果になりました。
この通りパソコンはとてもいい結果になったのですが、モバイルはどう頑張ってもここが限界。。一瞬80くらいになった時もあったのですが、元にもどってしまいました笑
でも、ツイッターなどをみているとどのユーザも同じ状況らしくパソコンのスコアだけよくてモバイルのスコアがとても低いという状況が起こっているようです。
このロジックが正常なものなのかわからない以上しばらくは状況を注視していきたいです。
でもまあ、ツイッターをみていると一桁のスコアの人などもいるようでしたので50近くまで改善できた事はとりあえずはよかったです。
スコアの改善方法
画像の容量の節約
自分のサイトの画像を見直していたらだいたい200KBくらいの画像が多くを占めていました。これは結構重いです。しかし、画像サイズを少し小さくしてあげるだけでも、20KB未満に抑える事ができます。
なので、少し地道ではありますが画像のサイズ調整は効果的だと思います。
EWWW Image Optimizerを導入する
このプラグインは自動的に画像を圧縮してくれるプラグインです。これを導入する事で見た目はあまり変える事なく無駄な情報を除外し画像を軽くする事ができます。
Autoptimizeを導入する
こちらはHTMLやCSSを自動的に最適化してくれるプラグインです。これによってサイトそのものの容量を圧縮することができます。
Lazy Loadを導入する
こちらは画像の読み込みを遅らせるプラグインです。表示されている画面を優先的に画像読み込みさせるため待機時間を少なくする事ができます。
XアクセラレータをONにする
こちらはエックスサーバを利用している場合にしか有効にできませんが、これを使う事で高速化することができます。こちらの機能はいわゆるCDN（コンテンツデリバリーネットワーク）にあたるものです。ネットワーク事業者側でキャッシュ領域を用意しており、よくアクセスがあるコンテンツについてはあらかじめアクセスユーザの近いところから配信するという仕組みです。
ログインサイトなどでない場合は全ファイルを適用にしても問題ないでしょう。
ワードプレステーマJINを使っている場合
以下の方法を試してみてください。
- アニメーションをOFFにする
- 標準フォントを利用する
これによって描画処理が早くなりますし、フォントをgoogleからダウンロードしなくなるので待機時間を減らす事ができます。
さいごに
WEBにおいてスピードは重要ですよね。実際にサイトスピードはgoogle検索の順位にも影響を与えます。実際にgoogleのブログでもそのように宣言されていましたし、とあるセミナーでもそのような話をしていました。
最近すごいデザイン凝ったブログをよくみかけますが、ものすごく重くて読み込みが遅すぎるサイトも散見されます。
定期的にspeed insightでスコアを確認しつつ改善していきましょう。
読んでいただきありがとうございました！
