ブログの表示速度はtinypngのパンダに助けられたー画像を圧縮してSEO対策ー

tinypng

こんにちは!ハゲてるよー!(@hagetemasu7)

なんかブログが表示されるスピード遅ない?って思ったんですよ。
それで調べてみました。

pageinsights

pageinsights

これめちゃくちゃ便利です。Googleが提供している「PageSpeedinsights」というサービスなんですが、その名の通り、入力したページの表示速度を教えてくれて、何が課題で表示速度が遅くなっているかまで教えてくれるんですよ。

ということでやってみました。

pagespeedinsghts

pagespeedinsghts

まあ、こんな感じでそのページがどれだけ速いかの点数が出ます。個人のサイトだと70が目標らしんですが、僕のサイト全然ダメですね。

ということでどうやらまずはブログにアップしている画像の容量が重いみたいなんで、それを圧縮すれば解決するみたいです。なので、パンダに頼ってみました。

tinypng

tinypng

このパンダめちゃくちゃ便利で画像をアップするだけで、容量を下げてくれるんですよ。だいたい、70%ぐらい削減してくれるので、1MBあるファイルが、300KBになるイメージです。しかも解像度は下げずに。

ちなみに今回は、この画像を圧縮しました。

肝機能障害

肝機能障害

こちらは、ストレスで酒を飲み過ぎて、今年の5月に肝機能障害でひっかかっちゃいましたよーという記事で使った画像です。もちろんこの記事にアップしてるのは圧縮済みの476KBの軽い画像ファイルを使っています。

当初は、2.3MBでした。

スーパー重いですね。スマホで大きめの写真撮るときは注意が必要かもです。
ということで、早速にパンダさんに圧縮してもらいます。

tynypanda

tynypanda

はい。こんな感じで76%も削減できちゃってます。これ画面のデザインも綺麗で使いやすいし、いいサービスだなあ。ということで今回はパンダに助けられました。

まだまだ表示速度を上げたいので、他の方法でも上げてみようと思います。
じゃあね。


スポンサードリンク

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">