うちのブログはめちゃくちゃ遅いという真実を知って以降、こつこつとブログの軽量化に取り組んでおります。。。
関連記事＞＞＞ブログの表示速度が遅すぎた
知らなかったとはいえ、バカみたいに重い画像をベタベタ貼り付けた記事を読ませていたなんて…無知という罪は重いですね(涙)
圧縮すると画像が軽くなる
画像を軽くするのは圧縮が一番と知り、どれくらい画像を軽くできるのか実験してみました。
カメラで撮った写真データ(元データ.JPG)を、圧縮(写真なのでJPEGに変換)とリサイズ(サイズ縮小)してみた結果です。
圧縮＋サイズ縮小の合わせ技(圧縮後_サイズ縮小.jpg)で1.11MBが79.6KBにまで小さくなりました^^
私がしている画像の軽量化
圧縮した画像ファイルを新たに作り、それと置き換えるという地道な作業をしています。
1.画像を圧縮する
圧縮したい画像を適当なフォルダに集め、画像編集サイトで圧縮します。
画像の圧縮に利用しているサイト↓
2.はてなフォトライフ経由でアップロード
はてなフォトライフ自体に圧縮機能があるので、そちらだけの利用でも良いのかもしれません(^^;
はてなフォトライフのアップロードを選択
ファイルを指定
3.圧縮済み画像ファイルと置き換え
はてなフォトライフで、アップロードした画像ファイルを選ぶ。
[ブログに貼り付ける]メニューを押すと、タグが表示されるのでコピーする。
はてなブログの記事編集の[HTML編集]画面を開き、参照先を書き換えます。
コピーしておいたタグを、置き換えたい画像のタグの下にペーストし、参照先(src=" … ")の部分と置き換える。
下の画像では、水色になっている文字列をオレンジの下線の文字列と置き換えます。
置き換え完了後は、貼り付けたタグの行を消去すれば出来上がり。
圧縮やアップロードは、複数ファイルをまとめてできるんだけど、画像の置き換えは一つ一つやっています(疲)
もっと効率の良い方法があればいいんだけど…(;^ω^)
ヨソの画像も原因のうち
表示速度のチェックをしていて気づいたことが。。。
Page Speed Insightが測定している対象って、ブログ記事のテキストや画像だけでなく、リンクや広告も全部ひっくるめてなんですね(;^ω^)
絶対うちのブログじゃない画像(見知らぬ男性3人の写真)が指摘を受けてて、なんでこんなのが入ってるんだろ？もしかして何か仕込まれてる？？と不安だったんですが、ついさっき謎が解けました。。。
原因はコレ↓
はてなニュースの広告画像425KBナリ(-。-)y-゜゜゜
必死で圧縮してるのが急に馬鹿らしくなった瞬間でした(-_-;)
はてなニュースは広告に載せる画像を圧縮してないのかしらね…
