【簡単】ブログ初心者向け!重い画像を圧縮して軽くしてみた

画像圧縮する方法Word press

ブログに上げたスマホで撮ったドラミちゃん🐈の写真が重すぎる・・・
画像を圧縮するいい方法はないかな?

写真や画像がたくさん使われている記事ってイメージしやすくていいですよね。

私も文字ばかりの記事より、写真いっぱいの記事がだいすきです。

 

しかし、写真はデータが重くなるのが難点。

 

重い画像を軽く画像に圧縮できたら、ブログもサクサク動いて、見る人にとって快適なサイトになりますよね。

今回は、ブログ初心者でも簡単にできる「重い画像を圧縮して軽くする方法」を紹介します。

スポンサーリンク

ブログにのせる重い画像を圧縮して軽くするには?

画像圧縮のサイト

<画像圧縮の流れ>

①プレビューで画像サイズを小さくする(リサイズする)
②パンダのサイトで画像を70%圧縮する「tinypng」
③すでに使われている画像には一括圧縮できるパンダのプラグインを使う
イメージ的には、2段階で画像を圧縮します。
まず、不必要に大きい画像サイズを小さくし、パンダのサイトで画像をさらに圧縮するという流れ。
過去に作成した記事の中で、すでに使われている画像を1枚1枚圧縮するのは不可能なので、プラグインを使って一括で圧縮していきます。

ブログに貼る画像を圧縮しないとこうなる

読み込みが遅いパソコン

ブログを始めて最初の頃は、画像を圧縮するということなど知らずに、のほほんと記事に写真を貼り付けていました。

しかし、自分の記事をスマホで確認してみると、記事の読み込みが遅い!!

なぜかめちゃくちゃ遅くなってました。

 

スピードインサイトというサイトの表示速度を調べるサイトで見ても真っ赤かの低速

たしか34点とかでした。

 

ちなみにスマホで撮った写真の元のサイズは「4032×3024」。

このサイズが超デカイということに遅まきながら気づきました。記事の中に入れるだけならこんな大きい画像はいらないってことです。

 

そこで、パンダの圧縮サイトで画像を圧縮してみることに。ほんの数秒で70%カット。あっという間。

しかも、ほとんど画像の劣化がないので、圧縮前と圧縮後の違いがわからないレベルでした。

画像が圧縮されたことで、データが軽くなりサイトの表示スピードもサクサクになりました。

ほんとに、早く知りたかったですね〜。

画像圧縮には、いろんなやり方がある

「画像 圧縮 ワードプレス」で検索すると、画像圧縮についての記事がたくさん出てきます。

有料ツールを入れるとか、ペイントツールで画像を小さくするなど、いろいろです。

どの方法が一番良いのかはわかりませんが、私は一番ラクな方法で圧縮することにしています。

ブログに貼る画像を実際に圧縮して軽くしてみる

圧縮前の写真

(圧縮前)

例)猫の写真

 (圧縮後)

圧縮しても画像のキレイさはほとんど変わりません。

人間の目では違いがほとんどわからないレベルですね。

今回は、自宅でスマホ撮影したドラミちゃんの写真を使ってみます。

①プレビューで画像を小さくする(リサイズする)

圧縮の手順1

フォルダ→ダウンロードでお目当ての写真をダブルクリックします。

 

 

圧縮手順2

「ツール」→「サイズ調整」→「幅」をお好みのサイズに変える

元サイズ:「4032×3024」→「560×315」に変更

縦横比を固定に☑️が入っていれば、幅に数値を入れるだけで自動的に高さも変更されます。

 

ここでカラー調整が必要であれば、

「ツール」→「カラー調整」→「露出・コントラスト・彩度」を写真を見ながら調整できます。

よければ変更を「保存」します。

 

②パンダのサイト『tinypng』で画像を圧縮

圧縮手順3

パンダのサイトを開き、先ほどサイズ変更し保存した画像をドラッグ&ドロップします。

 

圧縮手順4

ドラッグ&ドロップして数秒以内に画像の圧縮が終了。

右側にある「download」からダウンロードできます。

70〜80%近く圧縮できています。

これはすごいですよね。

過去記事の画像の一括圧縮にはプラグイン『Compress JPEG&PNG images』

「プラグイン」→「新規追加」→右上の検索窓で「compress」と検索。

手順5

いくつかプラグインが表示される中におなじみのパンダがいるので「今すぐインストール」→「有効化」

プラグインの設定はこちらのサイトがオススメ

ブログの重い画像を圧縮するには:まとめ

・大きすぎる画像はリサイズする
・パンダのサイト『tinypng』で70%軽くなる
・今までの過去記事内の画像はプラグインで一括圧縮
最近はスマホのカメラの性能が良くなっているので、そのまま写真を使うと重くてサイトが動かないという事態になってしまいます。
今回の圧縮方法は、慣れてしまうとあっという間にできるようになるので、早いうちから画像は圧縮してアップする癖をつけたいですね。
↓ブログ初心者さん向け!無料テーマ「Cocoon」でYouTubeを高速化する方法

< 初心者さんにおすすめ>

ブログで手軽にアフィリを始める方法

① A8.net   →アフィリといえばココ!すぐ使えて人気No. 1

もしもアフィリエイト →Amazonと楽天商品を紹介して手軽に始められる!

Word press
スポンサーリンク
CUTIEをフォローする
CUTIE

ライフハックや雑学、動物が好きな雑記ブロガー。
犬を撫でながらブログを書いてます(´∀`)
特技は、徹底的に調べ上げて買うネットショッピング。

CUTIEをフォローする
いまをシンプルに生きるには

コメント

タイトルとURLをコピーしました