ブログで使う画像の圧縮(軽量化)はどうやるの?【経験上で最も簡単な方法お伝えします】

ブログ 画像 圧縮

こんにちは。ごちゃんです。

今回は

悩む人のイメージ
ブログで画像を入れるとき、圧縮した方がいいんだよね。それは分かるんだけど、
手間なく簡単にできる方法があったら教えてほしいな。
このような疑問を解決します。

 

サイトの表示速度を早くするために、写真や画像を圧縮したほうがいい。
それはなんとなく分かっている・・・

 

でも「圧縮方法」を調べればネットで山のようにたくさん情報が出てきますよね。。。

 

正直、どれにすれば良いかよくわからないし、一番簡単なのはどれ?

 

僕も以前そう思っていました。
ですから僕の経験上、一番簡単に圧縮できた方法をお伝えします。

 

僕がシンプルに一番簡単だった方法です!

 

画像挿入までを一連の流れでお伝えします。

 

ツールも使いますが、全て無料でできる内容です。

 

僕はブログ歴約1年。
全くの無知からブログをスタート。(ブログとは?から。笑)
本業をしながら朝活とスキマ時間を使ってコツコツ作業しています。
収益は5桁達成。お小遣いは自分の力でまかなえるようになりました。

 

それでは早速やってみましょう。

 

【最短1分】ブログに画像挿入までの一連の流れ

以下は基本的な流れになります。

  1. フリー素材から画像選択
  2. 画像の編集
  3. 画像の圧縮
  4. ブログに画像の挿入

一度覚えれば、ほとんどテクニックなしでできる内容です。

画像編集に時間かけなければ、画像挿入まで最短1分でできちゃいますよ。

 

手順①:フリー素材から画像選択

まずサイトや記事のイメージに合った画像を選択します。

たくさんある中で、僕がよく使うフリー素材のサイトは「Pixabay」です。

商用利用も画像の加工もOKで、ユーザー登録も不要なのでとっても使いやすいです。イラスト画像も多数あるので僕はよく使っています。

 

・まずは画像を選択しクリックする。

フリー素材 画像 選択

 

・画像が表示される

画像選択

 

・「Shift」+「Winキー」+「s」を押すと、画像の範囲選択ができます。

範囲選択のスクショ保存が簡単にできるので、これ知ってると便利ですよ。
※windowsの操作になります。

画像 トリミング

範囲の選択をした時点で保存がされています。

ポイントは、ダウンロードするのではなく「範囲選択し保存」をするところ。

 

手順②:画像の編集

続いて、画像の編集。(編集しなくても同じ手順ですすみます。)

ここで使うのが、画像編集ツール「Photoscape」です。あらかじめ無料ダウンロードしておきましょう。

・画像編集を選択します

フォトスケープ

 

・開いた編集画面に、先程切り取った画像を貼り付け。「Ctrl」+「v」で簡単に貼り付けできます。

フォトスケープ 編集画面

 

・貼り付けた画像はそのまま編集することができます。テキストを入れたり画像の編集、サイズの変更などもここでできます。

画像の編集

・編集が完了したら画像を保存します。

手順③:画像の圧縮

保存した画像はそのまま挿入するのではなく使わず、圧縮して使います。

ここが本記事で一番のポイント、画像の圧縮です。

と言いつつも、とっても簡単な方法です。安心してください。

 

・圧縮サイトは「tinypng」を使わせていただきます。

パンダさんがサクッと圧縮してくれますよ。

画像圧縮

・直接画像をドロップするか、フォルダから画像を選択するだけです。

 

・すると、圧縮が成功。パンダさんがバンザイしてくれます。

tinypng 圧縮完了画面

・ダウンロードをクリックしてフォルダへ保存してください。

 

手順④:ブログに画像の挿入

あとは記事に先ほど圧縮した画像を挿入です。

・いつも通り、「メディアを追加」から画像を選択して挿入します。

ここでもう一つだけおすすめは、画像に対して「代替えテキスト」を入力しておきましょう。

これはSEO的にやっておくことをおすすめします。

代替えテキストは、目が見えない方がサイトを音声視聴しようとしたときに画像に対して

読み取れないことが無いよう、画像のイメージをテキスト入力しておくことです。

 

ブログで使う画像の圧縮(軽量化)はどうやるの?【経験上で最も簡単な方法お伝えします】:まとめ

この方法、画像挿入までとっても簡単じゃありませんか?

一度マスターしてしまえば、何てことないですね。

 

でも・・知らないととっても損。

この方法を知り、圧縮に時間をかけるのはかなりもったいないと感じたので、今回お伝えさせていただきました。

 

お役に立てたらな嬉しいです。

最後までお読みいただきありがとうございました。

NO IMAGE