すぐできるブログの軽量化　画像圧縮率が高いツールと対策方法

ブログのSEO対策には主に、キーワード選定、見出しの使い方、内部および外部リンク、画像の取り扱い、表示速度、記事の質などがあります。

今回は、すぐにできる対策として、ブログの表示速度を改善するためにどうすればいいのか？
もっとも効果が出やすい手だて、画像の処理方法について一緒に見ていきましょう。

私はブログを始めて3年目、かろうじて中級者の仲間入り？をしたかどうかというレベルです。
中級者としてさらなるステップアップを目指し、わかったことや改善した点をシェアしていきたいと思います。

サイトの軽量化を目指すなら、ブログに使用する画像ファイルの容量を小さくおさえることが重要です。

私は画像を圧縮・加工して、1枚あたり30kb前後にサイズダウンした画像を記事に使用します。

画像により元のバイト数にも差がありますが、加工後70kb以下を目安にして貼り付けています。私は基本的にブログの記事1ページあたり2枚の画像を配置しています。

本ブログでは、ウェブ上の無料ツールを使用して画像を圧縮し、はてなフォトライフ経由(さらに画質80％)で貼り付けています。

以前はパンダやゾウが目印の圧縮ツールを使っていましたが、圧縮率が70％程度で軽量化が足りてないと感じていました。
パンダやゾウはおなじみで、おすすめの無料オンライン画像圧縮ツールとしてよく紹介されていますよね。

Google提供のスクーシュも試してみましたが、私の場合はアンドロイド系のタブレットを使用しているせいなのか？ところどころ中国語？なのか日本語ではない漢字で表示されて(なにかのバグ？)うまく処理できませんでした。

ちなみにウーバーサジェストでも同様に謎の漢字表現が出現して意味不明な時があります。

スクーシュ　Squoosh

上記の3種類のツールの他にも試してみましたが、現在は大幅にファイルサイズを小さくできるツール｢Bulk Resize Photos｣に出会い、ブックマークして日々使用しています。

元の画像のファイルサイズが大きめのMBであっても、｢Bulk Resize Photos｣なら20～40KB程度まで加工してくれるので非常に助かっています。

一例として(上記のパンケーキの写真は)、1.2メガバイトの画像からリサイズして32.9キロバイトまで小さくなりました。

画像の寸法　640×400
画質　80％

私が設定している数値を参考にあげていますが、リサイズ方法やサイズ、画質のパーセンテージは、各自のニーズで自由に変えられます。

［画像サイズ変更］　無料ツール画像を圧縮する／画像のファイルサイズを小さくする　
Bulk Resize Photos - 画像サイズ変更

試しに同じ画像(さきほどのパンケーキ)をパンダの画像圧縮ツールを使って、加工前後の画像のバイト数を比較してみました。

やはりパンダでは私が目指す縮小サイズにはならず、｢Bulk Resize Photos｣の方が圧倒的に画像ファイルの容量を小さくできます。
(同じ画像で元の数値が1.2と1.3MBで表示されているのは微妙な誤差だと推察します)

Googleの推奨としてはWebサイト1ページに使用されるデータ容量は1.6MB以内を目安としているそうです。

ページスピードインサイトにて、｢◾過大なネットワーク　ペイロードの回避｣の項目を参照したところ、私のブログのトップページの合計サイズはモバイルで2964KiB(=3.035MB)だとわかりました。

とほほ、推奨を大きく上回るファイル容量でしたが、理想を目指して改善をはかりたいです。

ちなみにトップページのスコアはモバイル48、PC 78でした。

参考として記事ページも調べてみました。どのページも似たり寄ったりの数値だと判明しました。

モバイル50以上で及第点という見解もあります。
大幅な改善はすぐには難しいとしても、現状を把握(はあく)しておくことは大事ですよね。

［Googleによる表示速度計測ツール］
PageSpeed Insights

画像ファイルのサイズダウン以外にもブログの軽量化のためにできることはあります。

［私が実行したこと］

［実行していないこと］

知識を必要とする難しいことはさておき、簡単にできることは着手しておきたいですよね。
中級者になりかけの私による初歩的な内容でしたが、勉強中の誰かのお役に立ちますように…

［読んでほしい記事］
www.midoer.work
www.midoer.work