元法律事務員鈴木くん

もっぱら雑記になってきました。元法律事務員という肩書で書いてますが、関係ないことのほうが多いです。

はてなブログ初心者のカスタマイズ記録(画像圧縮してみた編)

f:id:poodlian:20170508192140j:plain

 

こんにちは、鈴木くんです。

 

色んな方にブログを見てもらえればと思いながらカスタマイズをしていますが、いじるにも限界がありますねー。

 

やりだしたらきりがないし、プログラミングとかできない僕には独自のカスタマイズってのも限りがありますから・・・

 

そんなわけで最近目線を変えてやっていることがあるので、紹介したいと思います。

 

 

ページの読み込み速度を改善したい

って思い立ったのは、勝手ながらブログ運営の教科書とさせていただいているgurigura (id:ayame253) さんのブログを見たときでした。

 

www.lifeport-gurigura.jp

 

正直、目から鱗でした。

 

ブログのカスタマイズっていったら、デザインを変えるとか、機能を追加するとかくらいしか考えてませんでしたから。

 

まさかページを読み込むスピードにまで着目してる人がいるなんて・・・

 

人の知恵を借りてデザイン変えたくらいで粋がっててすいません・・・

 

常識なのか応用なのかはわかりませんが、とりあえず自分も変えてみたいと思いました。

 

 

いざ見てみたらなかなかひどい結果だった

 

ということで僕もとりあえずGoogle PageSpeed Insightsで見てみることにしました。

 

ちなみにPageSpeed Insightsはモバイル(スマホ)、PCの両方を採点してくれて、修正点を教えてくれます。

 

モバイル

f:id:poodlian:20170508195925j:plain

 

PC

f:id:poodlian:20170508200143j:plain

 

PCは60点、モバイルにいたっては49点・・・

半分以下・・・高校のテスト以来・・・

 

思わぬ落とし穴でした。

 

 

とりあえず着目したのは「画像の最適化」

このままではいかんと思い対応しようと要修正内容を見たところ、

 

  • ブラウザのキャッシュを活用する
  • JavaScriptを縮小する etc.

言葉は知ってるがどうしたらいいかわからん!

 

と挫けそうなときに見たのが「画像を最適化する」という指摘。

 

これならできそうと思って見てみることにしました。

 

 

画像最適化ツールを使ったら少し改善された

画像の最適化についてGoogleのヘルプを見ましたがよくわからず。

 

自分で探してみて行き着いたのが最適化ツールのOptimizillaでした。

 

optimizilla.com

 

このツールは画像をアップロードしたら自動で圧縮してくれるので、それをダウンロードするだけのスグレモノです。

(さらに圧縮したい時は手動で変えられます。)

 

それだけ続けてたら、少しですが改善されました。

 

モバイル

f:id:poodlian:20170508202438j:plain

 

PC

f:id:poodlian:20170508202458j:plain

 

モバイル65点、PC79点。

まだまだ黄色信号ですがマシになりました。

 

 

まとめ

正直これが正解かもわかりませんが、とりあえず少しでも改善が見られたのでよしとします。

 

これが他の誰かの知恵の足しになれば幸いですし、詳しい方は色々教えてくれると助かります。

 

でもこんだけキャプチャ貼ってたら本末転倒かな・・・

広告を非表示にする