ちょっと曲がった家

おもに家と庭についてのブログです。。。

ブログの表示速度が遅すぎた

よそのブログの表示速度計測の記事を読んで、興味本位で調べてみたらうちはとんでもなく遅いことが判明しました(*_*;

ブログがメチャ重かった!

紹介されていた『Page Speed Insights』というGoogleのサービスでこのブログの表示速度を調べてみたのですが…

なにかを発見したネコのイラスト

パソコンの測定結果

Paga Speed Insightsブログの表示速度の診断結果パソコン

スマホの測定結果

Paga Speed Insightsブログの表示速度の診断結果スマホ

どちらも成績悪すぎ!( ;∀;)

診断の結果

様々なチェック項目があるようなのですが、とりあえず私が理解できたのは画像データが大きすぎる事くらい(;^ω^)

Paga Speed Insightsの診断結果 改善項目

改善点まで丁寧に指摘してくれるなんて、親切すぎる( ;∀;)

Paga Speed Insightsの診断項目一覧

それにしても真っ赤っかwwここまで赤いと見事ですね(;^ω^)

ブログの画像は何がいいのか?

何年もブログ書いてるのに勉強不足だったのですが、ブログに載せる画像はそのままよりも圧縮して軽くするのが正解だったのですね(;^ω^)

いままでずっと写真はトリミングやサイズの縮小しかしてなかったんです。。。

画像データはJPEGPNGを使い分ける

JPEGPNGの違いも知らず、ぜーんぶPNGに変換してました(汗)

  • JPEG:写真向き(ただし、保存をするたびに画像が荒れてしまう欠点あり)
  • PNG:イラストや画面ショットなどに向いている

本来は目的に応じて使い分けるのがベストらしいです(^^;

画像は記事上で縮小しない

クセというか無意識にやっていたことですが、大きな画像を記事上で縮小して貼り付けていました。

本来は記事に張り付けるサイズに加工してから、貼り付ける方が良かったみたい(^^;

640×480サイズの画像をわざわざ記事上で360×270サイズに縮小していたけど、元の画像自体を360×270サイズにして、そのまま貼り付けるのが正しいようです(*'ω'*)

ただし、意図的にクリックして拡大して見てもらいたい画像については、大きなサイズのまま貼り付けて、記事上で縮小しています。

画像を圧縮してみたら

一気に全部やり直すのは無理ですが、記事を参考にして50ファイル分だけ圧縮した画像データを貼り直してみました(疲)

写真(640×480サイズ)のPNGファイルを圧縮したJPEGにするだけで、およそ1/10近くまでデータ容量を減らせることができました(*'ω'*)

知らなかったとはいえ、見た目同じなのにこんなに軽いなら、ひと手間かけても圧縮するべきですね。。。

詳しい手順は、こちらでご覧いただけます↓

toniho.hatenablog.jp

パソコンの測定結果

Paga Speed Insights改善後のブログの表示速度の診断結果パソコン

スマホの測定結果

Paga Speed Insights改善後のブログの表示速度の診断結果スマホ

時間帯によって変動するのでもしかしたら誤差の範囲かもしれないんですが、パソコンの方は少し改善してて一安心(^^;

とりあえず平均目指して、コツコツがんばります。。。
画像の総数2700ファイル以上…気が遠くなりますね(*_*;

関連記事

toniho.hatenablog.jp

toniho.hatenablog.jp