INTP型のブログ

苦味があるな?

WEBで働いているのに画像最適化誤認してたんだが?

今日も今日とて資金不足によりケツが燃え上がりながら労働に勤しんでおりまして、今回は結構画像多めのサイトを作っているんですね。

 

ウェブサイトといえばとにかく軽さが命。

 

よくウェブページの読み込みに3秒かかると離脱率が大幅に向上し始めるなんて話がでているぐらい、サイトの軽さは命題なのです。

 

f:id:intptan:20200202203058p:plain

https://royal.pingdom.com/page-load-time-really-affect-bounce-rate/

 

画像を小さくしておかなければ1画像で数百KBになることもあり、何枚も画像を使うサイトだとその読み込みだけで数十MBほどに。当然読み込み速度も遅くなってしまいます。

 

で、画像を軽くする方法は色々あるんですが、よく「画像はJPGのが良い」みたいに言われていたような気がしてたので今日までPNG画像を見たらJPGに変換しておったのですよ。

 

それでもたまに忘れることがあったのでついPNGでサイトを作っておりまして、「ああ、直さないとな」と同じ画像をアップロードし直したところ

 

f:id:intptan:20200202203512j:plain

 

f:id:intptan:20200202203526j:plain

 

あ、あれ?

 

??????????

 

---

 

調べてみたところ色数によって画像容量と品質の最適拡張子が違う様子で、とにかくJPGにしておけばOKというのは違うみたいでした…。

 

今まで作ってきたサイトの画像は大体JPGのが良い形式だったので基本問題はなさそうですが、いやなにこれ無知すぎやん。

 

今後気をつけようということで思考整理も兼ねて記事にしておきました。